Looking at Code

You should have Google host your javascript libraries for you. I, up to recently, downloaded the libraries myself, and updated them myself, thinking it was the correct thing to do.

Boy was I wrong.

Then I tried just linking straight to the Google hosted jQuery library. Better, but not ideal.

Then I ran across this article on the Google AJAX Libraries content delivery network. This is the way to go. Using this will allower better caching, decrease latency, and increase parallelism.

If you host jQuery (or another library) on your site, your user has to download it. That’s bandwidth wasted. Chances are they’ve downloaded it already from other sites. Chances are they have numerous copies of the file in their cache already. And if they haven’t, they’ll download it from a server that has bandwidth available, and is close-by (low number of hops).

But, if a browser sees multiple requests for the same Google hosted version of jQuery, it understands that these requests are for the same file. Google’s servers will then return a 304 “Not Modified” response if the file is requested again and tell the browser to cache the file for up to one year. So, even if someone is going to tons of sites using the same library, they’ll only download the file once. That’s a huge bandwidth savings.

Parallelism has to do with concurrent connections. It basically is a bit browser/techinical/geeky, but it’s faster as you have more requests at a time available using this way.

You have two options to use this script, according to Google. The most powerful and flexible way is using The most powerful way to load the libraries is by using google.load() to name a library and your prefered version.


<script type="text/javascript" src="http://www.google.com/jsapi”></script>
<script type=”text/javascript”>
  google.load(”jquery”, “1.2.6″);
 
  google.setOnLoadCallback(function() {
    // Place init code here instead of $(document).ready()
  });
</script>


What’s nice about this is that you’re not locked into specific version. You could just say “jquery”, “1.2″ and it’ll load the most up-to-date 1.2.x version. Slick.

There are extra commands you can put in there as well. For jQuery you can put in the uncompressed command. e.g., google.load("jquery", "1.2", {uncompressed:true});