We've moved! Come visit our new blog:

Blog Archive

Thursday, March 17, 2011

Your Web, Half a Second Sooner

At Google we’re constantly trying to make the web faster — not just our corner of it, but the whole thing. Over the past few days we’ve been rolling out a new and improved version of show_ads.js, the piece of JavaScript used by more than two million publishers to put AdSense advertisements on their web pages. The new show_ads is small and fast, built so that your browser can turn its attention back to its main task — working on the rest of the web page — as soon as possible. This change is now making billions of web pages every day load faster by half a second or more.

The old show_ads did lots of work: loading additional scripts, gathering information about the web page it was running on, and building the ad request to send back to Google. The new show_ads has a different job. It creates a friendly (same-origin) iframe on the web page, and starts the old script with a new name, show_ads_impl, running inside that iframe. The _impl does all the heavy lifting, and in the end the ads look exactly the same. But there’s a substantial speed advantage: many things happening inside an iframe don’t block the web browser’s other work.

How much of an effect this has depends on context: a page with nothing but ads on it isn’t going to get any faster. But on the real-world sites we tested, the latency overhead from our ads is basically gone. Page load times with the new asynchronous AdSense implementation are statistically indistinguishable from load times for the same pages with no ads at all.

The new show_ads is a drop-in replacement for the old one: web site owners don’t need to do anything to get this speed-up. But these dynamically-populated friendly iframes are finicky beasts. For now, we’re only using this technique on Chrome, Firefox, and Internet Explorer 8, with more to come once we’re sure that it plays well with other browsers.

And what if you’ve built a page that loads AdSense ads and then manipulates them in exotic ways not compatible with friendly iframes? (This is the web, after all, land of “What do you mean that’s ‘not supported’? I tried it, and it worked!”) You can set “google_enable_async = false” for any individual ad slot to revert to the old blocking behavior. But if your site loads ads in some tortuous way because you were looking for latency benefits, consider giving the straightforward invocation of show_ads.js a whirl. Because now, we’re fast.

I understand the need to limit browsers, but it seems like just those 3 is a little restrictive. For example, I use Opera, which would likely work with this new method if I masked my user agent. Would it make more sense to blacklist?

Is Adsense still serving content from third parties? (Bad example: an ad for McDonalds coming from mcdonalds.com.) Last time I checked this is what caused the biggest slowdown, at least according to the timelines on various speed test sites.

@Brian: Chrome, Firefox and IE8 cover at least 80% of visitors which is a pretty big chunk.

Would you consider making it possible for sites to directly include the appropriate iframe, rather than having the script construct it? That would allow Google ads without including third-party scripts directly on the site.

Fans of other browsers: fear not, we plan to extend as soon as it's safe to do so. The async iframe technique is delicate enough, though, that each of the three browsers we're launching on now had some idiosyncrasies that we had to address — and several we didn't launch on certainly have new and different ones.

@Matt, thanks for your concern for my job security. But see the comments from @Patrick Meenan and @Anon4yqABAte: Ads Latency Team has no shortage of future work.

Definitely a welcome move, but Adsense is still slow and unfortunately this also didn't fix a core issue causing javascript errors for many users over many years (which should be an easy fix...). Very frustrating...

"Unable to post message to http://googleads.g.doubleclick.net. Recipient has origin mydomain.com"

Solution is at the following, please deploy:http://stackoverflow.com/questions/2541797/javascript-errors-from-google-adsense

Yeah, sam feeling as comment from CXNET and MISH15 ... there are several errors that need to be fixed. Since this new feature is up, we also noticed problems in Firefox 3.6, that loading of the page freezes on loading AdSense files and scripts, and never finishes ! Reloading page brings up the adsense banners almost immediatly and page works ok. Till next click ...

Also, most of the adsense codes and scripts come up as problematic and slow on ANY measurement tool, including Google Webmaster Tools !!! Google Chrome says

Firefox for Mobile is blocking Adsense ads by default, leaving a white spot. This is killing revenue streams. How can FF block ads by default? It is time to stop using Firefox? What is Google doing about it?

I was happy with the new iframe method until I noticed flash ads now overlap *everything*, including lightboxes and the semi-transparent backgrounds behind lightboxes. It looks incredibly tacky when it happens, like I'm trying to force visitors to click ads or something by having them overlap lightboxed content.

Can't flash ads be set to wmode=transparent to fix this? I do it manually with the new YouTube iframes, but I don't dare try anything with Adsense.

The saga continues. I just started using head.js to async. load all my large script's (jQuery, jQuery-UI, etc.) and the speed difference is incredible! In Chrome (Linux 15.0.874.106), pages load almost twice as fast. Simply incredible.

But, now the pages load so fast that the google adsense code, even at the bottom of the page, loads before all external css has had a chance to been fully applied, and thus seems to trigger adsense meltdown. My guess is, that since my adsense div's are "resized" by incoming application of ext. css (some added dynamically for mobile vs. pc), adsense code believes them to be moved or manipulated.

What a shame. I can't fully use the new speed because the google ad's die prematurely. If anyone knows of a way to make the ad's wait until the async. javascript and ext. css loads, I would love to hear about it.