CDN Hosted Javascript

This is totally not new, but a really nice feature I’ve discovered – using “CDN Hosted” javascript libraries, e.g. jQuery.

All you need to do is add an external reference the resource in your HTML, e.g.:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

This gives you multiple advantages, as:

  • you don’t have to store files on your hosting
  • you don’t have to worry about caching
  • you can decrease the bandwidth usage of your server
  • most likely you site’s overall performance will increase
  • you’re able to write a “single html” page e.g. for testing reasons using heavy JS / CSS frameworks, and send a single file over e-mail & etc.

I would like to see Blueprint CSS framework to be hosted on CDN too, but for testing reasons I can just use their test CSS directly when I need it.

See example:

Or usage in my CC validator trial page: http://blog.cikas.info/try/luhn.html

I like Microsoft’s explanation why CDN should be used:

Content delivery networks (CDNs) are composed of “edge cache” servers that are strategically placed around the world at key Internet network points. These “edge cache” servers can be used to cache and deliver all types of content – including images, videos, CSS and JavaScript files.

Using a CDN can significantly improve a website’s end-user performance, since it enables browsers to more quickly retrieve and download content. For example, instead of having a browser request for an image traverse all the way across the Internet to your web server to download, a CDN can instead serve the request directly from a nearby “edge cache” server that might only be a single network hop away from your customer (making it return much faster – which makes your pages load quicker).