HowTo – Using Google’s CDN API For jQuery And Other JavaScript Libraries

Filed under: Industry News,Web Design — Tags: ,

Google and a number of other large providers including Microsoft and Media Temple allow developers to access a variety of JavaScript Libraries which can aid in website deployment and availability.

Using Google’s CDN has both benefits and drawbacks and before you make use of this offering you should understand that there is a possibility your site could be broke for visitors or content made unavailable if your CDN Provider happens to go offline or is blocked. Blocking is a concern if you are attracting corporate customers who may have Google blocked in a proxy or if your site is behind a firewall. In addition to blocking websites placing heavy loads on free CDN providers may get their site blacklisted. You must read the API guidelines before you decide if your site will see a benefit from using Google’s repository.

Before you begin you must first signup for an API Key

http://code.google.com/apis/loader/signup.html

To load your API Key use the following line of script

[php]
<pre><script type="text/javascript" src="https://www.google.com/jsapi?key=<em>INSERT-YOUR-KEY</em>"></script>
</pre>
[/php]

Although jQuery is one of the most popular libraries available there are a few others that you can load on your pages.

Available Libraries

Chrome Frame
Dojo
Ext Core
jQuery
jQuery UI
MooTools
Prototype
script_aculo_us
SWFObject
Yahoo! User Interface Library (YUI)
WebFont Loader

Loading the remote JavaScript Library

After you get an API Key select the Library that you want to use and load it using the following:

[php]<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> [/php]

By using the Google Load command you can load a number of libraries at the same time.

[php]
<pre><script type="text/javascript">
  google.load("jquery", "1.5.2");
</script></pre>
[/php]

 

For more information about using the Google CDN visit

http://code.google.com/apis/libraries/devguide.html