Build a small business empire you can be proud of

Welcome to Microblogger! First time here?
I know there's a lot going on, click here to Get Started.

19 Comments

Switch Google Adsense to Asynchronous Ad Code for Speed Boost

Today’s post is a quickie and a must read if you’re using Google Adsense.

If you’re using Google Adsense and are still using the old ad code, you’re potentially slowing down the rendering of your site unnecessarily. Google Adsense is executed through JavaScript and by default, Javascript is always synchronous and single-threaded. This means that as the browser loads up the page, it hits a section of Javascript and executes it. The page will wait until the Javascript is completed before continuing to load the remainder of the page.

Google introduced an asynchronous ad code that, using wizardry, no longer forces the browser to wait until the Javascript loads before proceeding. It’s technically in beta but Gmail was in beta for five years, so I think it’s probably OK to use. 🙂

This won’t make your site load faster. It potentially helps it appear faster since your browser isn’t waiting for the Adsense code to execute before it processes the remainder of the page.

How to Find the Asynchronous Ad Code

If you’re familiar with Adsense, just go to the ad unit area of Adsense, get the code, and click on the drop down to show the Asynch code. If you’re not as familiar, the longer more detailed version is…

Log into your Google Adsense account and click on My ads in the header. It should load up your list of Ad units, click on Get Code underneath the name and you should see this pop up:
ad-code-popup

Click on the drop down to load the Asynchronous (BETA) code:
ad-code-asynch-popup

Copy and paste that in the place of your ad block.

Small Tweak for Multiple Ad Blocks

If you have multiple ad blocks, you can load the two parts of the code separately. The first section:

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

Put that snippet at the top of your theme before your </head> tag.

Then the rest can be placed where you want the ad to appear. Just remember to remove that first line with each ad block since you’ve already loaded it in the header. Keeping them there won’t do any harm, the browser will just load it again (technically, it might not because of caching but it’ll execute it multiple times).

That’s it! Told you it was quick.

Sharing is caring! Tweet about this on TwitterShare on Facebook5Share on Google+16Buffer this pageShare on LinkedIn0Share on StumbleUpon0Email this to someone
The following two tabs change content below.

Jim

In 2005, I founded a personal finance blog (Bargaineering.com) that became successful enough that I quit my career as a software developer in the defense industry. It is my goal to share everything I learned so that you can do the same - build an online business that let's you pursue your passion.

19 responses to “Switch Google Adsense to Asynchronous Ad Code for Speed Boost”

  1. Michael says:

    Very interesting. I’ve been tweaking things to improve page speed recently, so will have to check this out.

    Related: CloudFlare’s “RocketLoader” claims to do something similar, saying that it “Automatically asynchronously load all JavaScript resources.” Any idea if one is better than the other, or if it hurts to have both?

    Also, I’ve heard stories of people seeing Adsense earnings decline when using RocketLoader to asynchronously load their .js b/c the page doesn’t wait for the ads to load. Apparently that slight difference in timing (w/ads showing up sometime after the content appears) affects user behavior.

    From what I’ve seen, this (potential) effect on earnings is all anecdotal, with no formal tests, but something to keep in mind. Of course, you could argue that there’s a benefit b/c people are more likely to read your stuff if your page loads fast.

    • Jim says:

      I think it’s always better to do things yourself, rather than letting Cloudflare do it. Based on their claim, I’d suspect they do some kind of caching that may not be great if you change your .js.

      As for earnings decline, I don’t think the delay is going to be noticeable to a person honestly… it’s probably just coincidental. Plus, Google isn’t going to suggest something that lowers earnings. 🙂

  2. Robb says:

    Thanks for this, Jim. Just the kind of quick and actionable tip for someone like me who, quite frankly, doesn’t know enough about the technical side of blogging.

  3. Lucian says:

    I’ve seen that they introduced the new tags but I didn’t have time to change them. But I am curious if you did any tests and if you can really feel the increase of loading speed and how much time you win. Because in some cases, having the ads load last might not be the best idea…

  4. Mike Collins says:

    Great tip Jim! User perception is important and if your page appears to me loading slow it could turn users off. I’m making a note to check this out asap. thanks!

  5. Ryan Cote says:

    Great tip Jim. I wonder if they have the same thing with the google analytics code. I remember seeing they have a new version of the code, but I’m going to now check if it’s Asynchronous.

  6. Forest Parks says:

    Great tip. I have been upgrading my adsense blocks but didn’t think about removing the first line and only loading it once.

  7. Carolyn says:

    I’m using the asynchronous code, but I’m not sure what you mean by “multiple ad blocks.” Do you mean having more than one Adsense ad on the page? Or something else? Thanks!

    • Cap says:

      That’s exactly what Jim meant. More than one Adsense block being display on the page.

      You don’t need to have the line in each of the Adsense block placement because its already included in the section of your site. The browser has already loaded this JavaScript resource, you’re now just telling it that there’s another ad block that needs to be displayed here.

      Its not a huge difference because of caching but in a day when plenty of people read on mobile devices (and there’s everything from fast mobile device to slow ones out there), one less line of unnecessary execution for the mobile browser is a good thing.

  8. Geoff says:

    Hey Jim, good to know. I’m curious, are you aware if the same issue of synch v asynch is applicable to Google Analytics code?

  9. Richard says:

    Hi Jim. Thanks for the advice.. How about CPC and earning? Is the asycnchronus scipt get higher CPC or only make faster loading?

Leave a Reply

Your email address will not be published. Required fields are marked *