3

From reading, it seems like asynchronously loading Google Analytics is primarily a strategy to speed up browsers that block while loading JavaScript such as IE6 and IE7. In newer browsers that load JavaScript in parallel, and generally handle JavaScript better, it seems like the benefits diminish.

If we're only considering "newer browsers" (say IE8+ and 1-2 year old versions of Firefox and Chrome) are there still significant advantages to using the asynchronous load script? If so, what are they?

1
  • the payoff is less. not sure if IE8 is cool like that, it's probably sync... there are other factors. if the ga url is slow to lookup/respond, document.ready() will be delayed. also, async lets the GA script execute upon arrival instead of in-order. While it may be fetched in parallel, if coded naively, it's still executed in-series, when it need not be.
    – dandavis
    Commented Aug 29, 2013 at 19:13

1 Answer 1

3

Even with modern browsers that have improved parallel loading and other things performance wise, there are still two rules that they have to abide to which force them to make some sacrifices when you use a simple script tag:

  • script tags may change the dom "in place". If your js has a document.write() call, it has to happen wherever the script tag was, not where the browser might be in its loading at the time the code execute, and the browser has no way to know if you are doing it or not before it has the actual js file.

    The defer attribute on a script tag let the browser know that your script will not include any such dom-modifying call, it can safely go ahead with the loading of every thing else and run the javascript whenever it gets it.

  • script tags have to be processed in order. If you include two scripts (say, google analytics and then facebook), your browser is not allowed to run the second one until after the first one is run. In other words, if one of the third party services you use has a slow down, your entire page is waiting for it.

    The async attribute has the same effect as defer ("I promise I won't try to change the dom in place"), but it also tells the browser that the script tag does not have to be run before the ones following it, the browser can just run it whenever it wants/can.

    So in that exemple, if you scripts are loaded asynchronously it tells your browser that if it gets the facebook js file before the analytics one, it can run it right now without waiting.

Not the answer you're looking for? Browse other questions tagged or ask your own question.