Use of CDN Support in Asp.net bundling- Tutorial with Screenshots

Asp.net MVC possesses great features such as bundling. With the help of minification and bundling, the user can lower the HTTP request numbers for Asp.net web development by gathering style sheet files and individual scripts. He can also lessen the overall size of bundle via minified application content. Bundling also involves CDN support where user can access public CDN from common libraries.

CDN support use:

Applications normally use libraries like JQuery UI and JQuery. These are accessible from CDN (Content Delivery Network) that specifies URL for each specific library along with version. CDN path is a new parameter in default bundle functionality where user can specify the CDN library path and use it. It is necessary to check the availability of content delivery network before running the application in production environment. If CDN is present, it will load the files itself, and if not, then it will load files that are hosted on our server.

Advantages of using CDN for common libraries:

Fast content loading Different application may directly load libraries via browser cache Limited downloading of resources that influence speedy loading CDNs provides high accessibility and low latency Availability of version controls for Asp.net web development

Let’s start with creating a sample application and make it more understandable. Here, professionals have created a MVC application:

Prepared By : ASP.Net Development Team of Aegis Soft Tech

After creating this Asp.net MVC web development project, go to App_start folder and open BundleConfig.cs file, you will see following JQuery Bundle code-

The ‘new’ Scriptbundle object consists of another constructor that also takes CDN path as parameter.

To notice difference in running app with and without CDN, you can now test the app and check its performance without adding CDN.

You will notice that it is loaded from bundle that is not having CDN. In this turtorial, you will get to know about using CDN in such cases. You can find many CDNs online, in this appliation; we have used Microsoft hosted CDN file.

This link will help you in finding all CDN hosted files-http://www.asp.net/ajaxlibrary/cdn.ashx

We have used JQuery 1.10.2 version because Asp.net MVC app by default available in this version only.

Prepared By : ASP.Net Development Team of Aegis Soft Tech

By enabling USeCdn to true will command bundle to utilize CDN whenever it is available for use. While doing this, you need to set Debug= false in web.config for testing application. Once it is done, the Asp.net web development project you run in browser will look like –

Prepared By : ASP.Net Development Team of Aegis Soft Tech