javascriptjqueryjscompress

What is the best/fastest way to include my external javascripts? I use jQuery


I am nearly done with my site and am optimising it at the moment; I would like to know the best and fastest way to include all my external javascript files. I want the site to download as quick as possible, but it has quite a few (10 or so) external javascript files that need to be loaded; some are jQuery library files from Google's AJAX API and some are mine.

I'm sure I read a while ago that I could call all external scripts using a bit of javascript code, in effect, only calling one external file from the browsers point of view.

Do you see what I mean?

Many thanks


Solution

    1. Combine all your Javascript into one external file (you can do this dynamically and save the cached result);
    2. Minify that file;
    3. Version that file (I use the mtime of a preconfigured file for this);
    4. Gzip the file if the client supports that; and
    5. Use a far futures Expires header on the file.

    What you're referring to (using Google's AJAX Libraries service) is another way to handle this that falls under the heading of a CDN (Content Delivery Network). The idea being that the file is stored in multiple plallllces and the client will download the closest (and that result will be saved).

    That's hard or just awkward to combine with other techniques and I've found that doing multiple external loads this way completely erodes any perceived benefit (unless that's your only external load) so I use the method listed above instead.