Google Now Hosts Javascript Libraries
Posted
News of Google Ajax Libraries API is spreading fast, and I for one welcome it. Anything I can do to speed up websites and offload files is something I'll likely take advantage of.
They've recently added jQuery, and I've started using it with this new design. So far it is working great, but will it last? Anyone who uses Google Analytics knows that at times it can slow your page down. Although Google says this is a faster alternative to using your own server, I think the chance for slow response time is still there.
The Real Benefit
However, offloading the file to the Gibsons over at Google is not the main reason this is faster. Caching is what makes this so much faster, after the initial download, the library is cached and no longer re-downloaded at every website. For example if a user visits jQuery's site, then visits mine, they will no longer have to wait for the jQuery library to load as it will already be cached on their computer. Obviously this only works if people start using the service. I imagine plenty of web 2.0 companies will start using the service, which will benefit everyone, and you should use it too.
Security Risks
All is not rosy though, there is some security risk when using the service. If someone was able to hack into the service(unlikely) or someone with access was to turn evil(more likely, think postal workers) they would be able to inject javscript into your site. This would be a flawless victory and fatality(<-- mortal kombat reference) for the hacker. I think there is a VERY small chance of this actually happening, so the reward well exceeds that risk.
Another point to consider is Google will have access to data about your website it may not normally have access to. This doesn't bother me in the least as I worship at the Google temple, but for some the invasion may be more of a serious issue.
How do I use it?
Thats easy, you can either call the new script in a simple <script> tag like I am currently doing. Or use the google.load function.
Below is the script tag I use which calls the minified jQuery library. The url structure is pretty straightforward: name of the library, version, and file name. I believe using 1 as the version number gets the latest version, but I'm not 100% sure. The structure below uses a version wild card to get the latest 1.*.* version. I would recommend using the full version number for better results(see Mark Lucovsky comment).
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
The next example uses the google.load function and is straight from the Google page.
<script src="http://www.google.com/jsapi"></script>
<script>
// Load jQuery
google.load("jquery", "1");
// on page load complete, fire off a jQuery json-p query
// against Google web search
google.setOnLoadCallback(function() {
$.getJSON("http://ajax.googleapis.com/ajax/services/search/web?q=google&;v=1.0&;callback=?",
// on search completion, process the results
function (data) {
if (data.responseDate.results &&
data.responseDate.results.length>0) {
renderResults(data.responseDate.results);
}
});
});
</script>
For more information about the API see Google's AJAX libraries page