---

Search posts under jQuery:

---

Loading jQuery file from CDN in jQuery

How to load jQuery file from CDN (Content Delivery Network)?

What is CDN?

CDN Stands for Content Distribution Network or also called Content Delivery Networkis a group of computers placed at various points connected with network containing copies of data files to maximize bandwidth in accessing the data. In CDN a client access a copy of data nearer to the client location rather than all clients accessing from the one particular server. This helps to achieve better performance of data retrieval by client.

There are two leading CDNs available that hosts jQuery files.

Microsoft - To load jQuery from Microsoft AJAX CDN
jQuery file can be loaded from Microsoft AJAX CDN. For more details, go to http://www.asp.net/ajax/cdn. You will need to keep following tags in your page.

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.3.min.js"></script>

Google - To load jQuery from Google Libraries API
jQuery file can be loaded from Google CDN for more details, go to https://developers.google.com/speed/libraries/. You will need to keep following tag in your page.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

Why to load jQuery file from CDN?

You may ask that if we can load the jQuery file from our own server why to load it from the CDNs. The answer is logical and very simple. The browser behavior is that whenever it loads any webpage, it keeps related files (eg. Javascript file, CSS file and Images) used for that page into its cache (also called history). When next time the user browses any web page, browser loads only those files that are new or modified and is not available in the browser cache or history. In this way, browser improves its performance and loads the page.

The possibility is that if more and more websites are using CDNs, the user might have already browsed some other web pages that is using CDNs jQuery file and that file may have into browser cache; so when user browse your page and you are also using CDNs file, the older cached version of jQuery file will be used. In this way your page will load faster as browser will not have to load the jQuery file for your page again.

The benefit

1. Faster page load as jQuery file need not to be downloaded
2. Saves your bandwidth as jQuery file is not loaded from your server
3. Scalable - generally CDNs place these files on the servers located at different geographical locations of the world so that they load faster so irrespective of from where your user is browsing your page, your application runs well.