New Asynchronous AdSense Ad Code

How to use use new new 'asynchronous' Google AdSense ad codes beta.

Beta version of the new Google AdSense ad code called as Asynchronous tag is now available to publishers to try out. The new ad code "enhances user experience on your sites by ensuring site content loads for your users, even if they're having trouble loading the ad," informs adsense team. This is particularly good news for mobile users.

A few other benefits come along for the ride, is like the ability for "ad slot configuration" and "placement to live entirely in the DOM."

Since the new asynchronous ad code is still in beta, changing over it is optional. Now, when log in to your account, you'll be able to choose between the new and current versions of the synchronous code.

Google explains this new tag is built around the modern <script async></script> mechanism, ensuring faster loading of the rest of the page even if a slow network connection makes the ad script slow to load.

On the otherhand the classic ad code that blocking javascript tag is a "Frontend Single Point of Failure", because "if a server or network problem makes that script unavailable, it could prevent the whole rest of the page from appearing," explained web speed evangelist Steve Souders.

The new ad code uses a upstart adsbygoogle.js beta vs. the classic show_ads.js tag, a a battle-tested warrior with years of experience, running on millions of sites around the web.

As you can see in the new ad block size is based on the width and height of the <ins></ins>, which can be set inline, or via CSS. "Other configuration happens through its data-* properties, which take the place of the old (and manifestly not async-friendly!) google_* window-level variables. If your Google Analytics integration required setting google_analytics_uacct="UA-zzzzzz-zz" before, then you should now add the property data-analytics-uacct="UA-zzzzzz-zz" to the <ins></ins> instead, for example," explains google.

Anatomy of the new tag:

The new asnchronous script, needs to appear "only once on a page," even if you have multiple ads on the page and it loads asynchronously.

<script async src=""></script>

A particular DOM element, inside of which the ad will appear. "The attributes of this element can be used to configure the properties of the ad slot," explains google.

A call to adsbygoogle.push(), which instructs us to fill in the first unfilled slot.

<ins class="adsbygoogle"
  (adsbygoogle = window.adsbygoogle || []).push({});

Google note, if you choose to switch to the new code, publishers are recommend to switching all of their ad units on the pages to the new asynchronous tag for better user experience.

"To try the new ad code, follow the steps to create an ad unit, then, in the Ad code box, select 'Asynchronous (BETA)' from the Code type drop-down menu." Finally, as before, copy and paste the ad code into the HTML source code of your pages.

New AdSense Asynchronous Beta Ad Tag