HTML and CSS Reference
In-Depth Information
Google CDN hosting
Google hosts a lot of popular JavaScript libraries. A list of all libraries hosted
on Google's CDN is available at code.google.com/apis/libraries/
devguide.html .
We could take advantage of Google's CDN for jQuery UI too, as it is hosted on it. Let
us convert it to use Google's CDN by changing the source of the script file from js/
libs/jqueryui-jquery-ui-1.8.17.min.js to the following:
//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/
jquery-ui.min.js
But wait! Let us take a look at how we refer to jQuery CDN in HTML5 Boilerplate.
This is shown in the following code snippet:
<script src="//ajax.googleapis.com/ajax/libs/
jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery ||
document.write('<script src="js/vendor/
jquery-1.8.2.min.js"><\/script>')
</script>
Do you notice how we also refer to a local copy of the jQuery file? We do this just so
that in the event Google's CDN fails, we still have our local copy to use. Granted this
does not happen often, but it is useful to have a fallback when or if it does.
The statement window.jQuery || document.write(…) does two things.
These are as follows:
• Check if the jQuery object exists: If it does, it means Google's CDN
worked. If it exists, do nothing.
• If the window.jQuery object does not exist: This means Google's CDN
failed; it immediately renders a script tag with a reference to the copy
of jQuery in the project's libs folder. This tells the browser to immedi-
ately make a request for that resource.
Search WWH ::




Custom Search