1

I'm loading an Angular app and loading some initialisation data using a <script src="/init"> call.

I found that Chrome wasn't starting the Angular $compile process until all javascript scripts were loaded, including the /init call, which might take a long time.

So to make the Angular compile process begin before /init returns I added async, thus <script src="/init" async>, which gets that desired result.

However, there is a strange problem with async (only in Chrome it seems), whereby if async is added, Chrome doesn't request that resource until after all other resources listed on the page have loaded (not Angular ng-includes etc, just the regular ones with src and href attributes).

Here's the network results in DevTools without async. The LAST one is the /init call, and the ones before it are script tags calling Angular code

without async

Here's with async

with async

The last bar is the <script src="/init" async> one. If you ask me, the async script has been loaded synchronously (as in, in sequence).

So have I misunderstood how async works? Or is this a bug in Chrome (Version 40.0.2214.94 m on XP)? I'm guessing the latter, because Firefox kicks off all script loads regardless of async as I'd expect.

UPDATE: Chrome team intentionally reduced the priority of async script load, so my problem isn't a bug at all. It's a feature! :)

poshest
  • 4,157
  • 2
  • 26
  • 37
  • async simply tells the browser that you don't care if the asset is loaded in-line before continuing to load the rest of the page. It's up to the browser maker to determine what that exactly means. I would imagine something similar happens in IE. – Patrick Gunderson Feb 07 '15 at 22:53
  • @PatrickGunderson, yes that's how I understood it. It partly defeats the purpose of an async call though if, in implementing it, the browser waits arbitrarily to make the call itself. – poshest Feb 07 '15 at 23:03
  • Well, the point of using async is that your page doesn't depend on the script to do the basics, so loading/running the script shouldn't hold everything else up. If you need the script, you should remove async. – Patrick Gunderson Feb 08 '15 at 02:28
  • @PatrickGunderson, yes, it seems that way. Perhaps the feature should have been called noblock. Using the word async got me thinking I could get things done in parallel (fairly standard feature of the async idea in most developers' minds I'd say). The way Chrome implements it seems remarkably 'synchronous'. – poshest Feb 08 '15 at 10:57
  • In any case, their change to reduce async script load priority [was intentional](https://code.google.com/p/chromium/issues/detail?can=2&start=0&num=100&q=&colspec=ID%20Pri%20M%20Week%20ReleaseBlock%20Cr%20Status%20Owner%20Summary%20OS%20Modified&groupby=&sort=&id=408229) – poshest Feb 08 '15 at 10:58
  • No, it's not synchronous. It seems that chrome is optimizing the load process by not opening up too many simultaneous connections to the server, opting to move an asynchronous call (meaning less critical than the synchronous calls) to the end of the load queue. – Patrick Gunderson Feb 09 '15 at 18:46

0 Answers0