Reduce Your jQuery Script Loading Times

By Sam Deering


Hi guys, I’ve stumbled upon a jQuery script that reduces the loading time of your JavaScript include files. It works by loading all your dot js files at the same time inside an array. I’ve tried the tests out and it does seem to load much quicker than loading your files in the standard way. See the proof below and try it for yourself!

The Standard Way


The head.js Way



Document Ready with head.js

Usually with jQuery code you need to wait until the DOM is ready. This is the same when using head.js and this is how you can acheive the same result.

//same as document.ready() function
head.ready(function() {
     //code to be executed once .js files have loaded.


  • Pingback: Reduce Your jQuery Script Loading Times | Web Design Northamptonshire()

  • Moises

    In the demo I see no difference between the 3 possibilities. In fact, “Script SRC at bottom” seems to be quicker, at least in Chrome 11.
    My loading times:
    – SCRIPT SRC in head: 1235 ms
    – SCRIPT SRC on bottom: 1005 ms
    – head.js on head: 1051 ms
    I pressed CTRL+SHIFT+R several times to get an average load time.
    So no need to use another script to load scripts.
    On Firefox 4.0.1 seem to improve a bit:
    – SCRIPT SRC in head: 1419 ms
    – SCRIPT SRC on bottom: 1507 ms
    – head.js on head: 1032 ms

  • jquery4u

    Yeah I did notice it was quicker in FF. It seems when the scripts are cached it outperforms the conventional methods by alot but fresh loads only marginal differences.

    Also I found it broke when I was using IE so I kinda lost my faith in it! I will update my post to reflect this.

  • jQueryInBlood

    I am so sorry to tell you but your script doesn’t work properly.
    It has increased the loading time of my webpage for about 5 times.



Because We Like You
Free Ebooks!

Grab SitePoint's top 10 web dev and design ebooks, completely free!

Get the latest in JavaScript, once a week, for free.