Head JS Loads JavaScript Files Like Images Without Blocking the Page | Hacker News Reader

Head JS Loads JavaScript Files Like Images Without Blocking the Page

headjs.com

68 pointswslh14 comments

Yes, we talked about this yesterday.

http://news.ycombinator.com/item?id=2780233

And this does the same thing without using proprietary code:

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

(and head.js won't do anything special in browsers where the above line isn't supported anyway)

It's MIT licensed, so not proprietary. Did you mean to say "third-party"?

AFAIK, `defer` only works in IE, and `async` only works in: IE10p2+, Chrome 11+, Safari 5+, Firefox 3.6+

So some browsers would be left out, right?

That list represents most of the browsers people care about, with the exception of old IE. And "better with a modern browser, manages to function on old IE" seems like the right standard to shoot for most of the time, depending on your site's audience.

The pattern Async Analytics uses works in all browsers and it's simple enough that you don't need a library for it:

    var script = document.createElement('script'); 
    script.async = true; // enables out of order execution
    script.src = '…'
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(script, s);

http://code.google.com/apis/analytics/docs/tracking/asyncTra...

I use yepnope, it does the same thing and is very active, it's now part of modernizr which is used by google, microsoft, twitter and more:

http://yepnopejs.com/

http://www.modernizr.com/

HeadJS appears to be abandoned by its developer, FWIW: https://github.com/headjs/headjs/issues/152

While parallel script loading is cool, it's been done by a number of other script loaders. What's neat about HeadJS is all the other stuff! a smaller version of modernizer, pseudo media queries, etc. I quite like it.

You can customize Modernizr to include only features you need.

I had some serious issues with head.js with http://blitz.io in that the load order was not deterministic causing all sorts of weirdness. For example jQuery will end up loading after the code that requires jQuery resulting in undefined stuff and form posts not binding properly. While I truly liked the idea, it wasn't for us.

The HeadJS website says scripts will "run in order", you must have had a buggy version.

I have successfully used LABjs (labjs.com), it has more fine-grained control over parallel/serial loading and execution. For a single project. One of the goals was to parallelize script loading, but modern browsers already do that, they will load up to 4 js files in parallel and execute them in order. In the end the performance gain does not justify the added complexity.

Also worth noting is Steve Souders' control.js (http://stevesouders.com/controljs/) which adds some tools for delayed script execution and solves a few document.write use cases that have been issues with deferred loading/execution.

And there's LABjs http://labjs.com/

but I wouldn't bother with any of them. IMHO concatenated scripts at end of <body> are just fine.

I made the tests in the "Head JS script loader" section several times and it wasn't faster.

Reply on news.ycombinator.com