Head JS Loads JavaScript Files Like Images Without Blocking the Page

http://headjs.com/#

by wslh • 15 years ago

68 14 15 years ago

headjs.com

ck2• 15 years ago

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)

wulczer• 15 years ago

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

padolsey• 15 years ago

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?

JoshTriplett• 15 years ago

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.

pornel2• 15 years ago

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...

tkaemming• 15 years ago

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.

pornel2• 15 years ago

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.

threepointone• 15 years ago

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.

dw0rm• 15 years ago

You can customize Modernizr to include only features you need.

kowsik• 15 years ago

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.

ricardobeat• 15 years ago

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.

paulirish• 15 years ago

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

patrickaljord• 15 years ago

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/

swah• 15 years ago

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

Head JS Loads JavaScript Files Like Images Without Blocking the Page

Related Stories