What is jQuery?
What is a CDN?
CDN stands for Content Delivery Network or Content Distribution Network depending on who you’re talking to. It can loosely be defined as a collection of web servers at various geographical locations, with each location containing a copy of the same web content. Since the distance between your site’s visitor and your server has an impact on page load time, it makes sense for a visitor to download your content from the closest server collection. For example a visitor from Glasgow might access the CDN servers in Dublin to download content, where as a visitor from Las Vegas might access the content from the CDN servers in San Francisco. This is a faster approach than forcing the vistor in Las Vegas to go all the way to servers in Dublin to fetch content.
What is the Google Libraries API?
So why load jQuery from the Google CDN?
There are two big reasons for this:
The great thing about loading from Google’s CDN is that if the user has visted another site that also loads from the CDN, then they will already have a cached copy stored locally, so there’s no need to download another copy from the server. This caching effect can help improve the loading time of your site, especially if you’re loading multiple files from the CDN.
As I mentioned before, a CDN is distributed across multiple geogrphical locations. This means the vistor is downloading jQuery from a server closer to them, thus helping to reduce latency, which is another important factor.
But what if the site can’t access the Google CDN?
This can happen, maybe the Google CDN goes down (however unlikely!) or you don’t have Internet access in your development environment. Fear not, there are solutions, my personal favourite being the one used by HTML5 Boilerplate. HTML5 Boilerplate uses a nice, simple way of falling back to a local copy in your js/lib folder, shown below:
So there you have it, a quick guide to jQuery and The Google Libraries API and an slick, effective way to fall back to a local copy.Share