Introduction
Modern web applications rely heavily on client side
scripting to provide rich user experience. To that end ASP.NET AJAX and jQuery are popular choices amongst ASP.NET developers to render rich user
interface. These libraries make use of client script physically stored in
JavaScript (.js) files. When a client accesses a web form that makes use of
these libraries the client browser first needs to download the required
library files on the client side and then execute the client script.
Developers often store these JavaScript files as a part of their web site and
then refer to them in various web forms. Though this approach works, it’s not
the best approach to make use of such client side libraries. That is where Content Delivery
Network or CDN comes into picture. As an ASP.NET
developer it would be nice to know what a CDN is and how Microsoft
Ajax CDN can be used in ASP.NET web sites to refer ASP.NET AJAX and jQuery
files. The remainder of the article discusses these concepts.
What is CDN?
A Content Delivery Network or CDN is a network of servers
situated at key locations across the globe. This network maintains cached
copies of files that are to be delivered to the client. When a client tries
to access any file that is being maintained by the CDN, the server nearest to
the requesting client fulfills the request. This technique is known as Edge
Caching since the servers towards the "edge" supply the content.
Microsoft’s Ajax CDN hosts frequently accessed library
files such as ASP.NET AJAX and jQuery so that they are served by the CDN and
not by your web site. Using CDN can improve overall performance of your web
forms since client script libraries are downloaded by the client browser from
the nearest location. Microsoft Ajax CDN can be accessed at ajax.aspnetcdn.com and can be used for
referring ASP.NET AJAX and jQuery files. A sample <script> block that
refers jQuery library from Microsoft Ajax CDN looks like this:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.min.js" ...> </script>
Benefits of Using CDN
In order to understand how using CDN can be beneficial to
your web application, let’s assume that you have a web server located in the
US. Your web site developed in ASP.NET is hosted on that server and is using
ASP.NET AJAX and jQuery libraries. Now let’s further assume that clients from
India are trying to use your web site. Without any CDN in the picture, all
requests for the ASP.NET AJAX and jQuery libraries will be served by the
single web server located in US. The files needed by the clients from India
will be downloaded all the way from the US based web server.
Now consider the following figure.
Figure 1: Edge Cache Servers
Suppose that you have introduced CDN for ASP.NET AJAX and
jQuery files and these libraries are now hosted in edge cache servers.
Further assume that one of the edge cache servers is located in India itself.
Now when a request originating from India is received, there is no need to
fetch the files from the US based web server. Instead they can be readily
served by the nearest edge cache server located in India. This will obviously
improve the overall performance of your web site. If, for some reason, the
edge cache server located in India is unavailable, the requests can be routed
to other servers in the network ensuring high availability.
Using CDN also lessens the load on the web server. Let’s
say your web form is making use of five JavaScript files. In the absence of
CDN each client will send at least six requests (one for the web form and
five for the JavaScript files) to the web server software (IIS as far as ASP.NET
is concerned). However, with CDN in place only the web form request will
reach the web server. The other five requests will be served by CDN. This can
reduce load on the web server considerably.
Consider a case wherein you have developed two web sites, both
making use of ASP.NET AJAX and jQuery and you are not using CDN. If the same
client tries to use both of the web sites, the client browser will download
the ASP.NET AJAX and jQuery library files twice (once for each web site). See
the following figure.
Figure 2: CDNDemo
Figure 3: CDNDemo2
The figure shows two web sites – CDNDemo and CDNDemo2 –
making use of jquery-1.4.3.js file. Since the web sites are not using CDN, the
browser will download the same file twice as shown by the FireFox cache
above. With CDN in place both the web sites will refer the jquery-1.4.3.js
file from the CDN. Now the browser will download just one copy of
jquery-1.4.3.js because both the web sites are pointing to the same file.
Using Microsoft Ajax CDN for ASP.NET AJAX Files
Now that you know the benefits of using CDN, let’s see how
to use Microsoft Ajax CDN for referring ASP.NET AJAX files. If you wish to
use ASP.NET AJAX, you must place a ScriptManager control on the web form. In
ASP.NET 4.0, the ScriptManager control has EnableCdn property that governs
whether to use Microsoft Ajax CDN or not. If set to True the ScriptManager
control will emit <script> blocks that point to Microsoft Ajax CDN;
otherwise scripts are served by the web server.
Figure 4: The ScriptManager control has EnableCdn property
If you see the HTML source of the web form after
configuring the ScriptManager control to use Microsoft Ajax CDN, you will
find script blocks as shown below:
<script src="http://ajax.microsoft.com/ajax/4.0/1/WebForms.js" type="text/javascript"></script> <script src="http://ajax.microsoft.com/ajax/4.0/1/MicrosoftAjax.debug.js" type="text/javascript"></script> <script src="http://ajax.microsoft.com/ajax/4.0/1/MicrosoftAjaxWebForms.debug.js" type="text/javascript"></script> <script src="http://ajax.microsoft.com/ajax/4.0/1/MicrosoftAjaxTimer.debug.js" type="text/javascript"></script>
Note that initially Microsoft Ajax CDN used to point to
ajax.microsoft.com but now it has been changed to ajax.aspnetcdn.com. Though
the former domain still works it is recommended to use the later domain in
your websites.
Using Microsoft Ajax CDN for jQuery Files
Using jQuery library from Microsoft Ajax CDN is just a
matter of adding a <script> block that points to the appropriate file
from the CDN. The following <script> block shows how the jQuery library
version 1.4.4 can be referred :
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.js" type="text/javascript"> </script>
Summary
A CDN is a network of servers situated at key locations
across the globe that serves cached copies of frequently accessed files.
Microsoft Ajax CDN can be accessed at ajax.aspnetcdn.com. Using Microsoft
Ajax CDN for ASP.NET AJAX and jQuery files can considerably improve the
overall performance of your web site since the frequently accessed script
files are served by edge cache servers located near the client end. A list of files hosted in Microsoft Ajax CDN can be found here.
About the Author:
Bipin Joshi is a blogger and writes about
apparently unrelated topics – Yoga & technology! A former Software
Consultant by profession, Bipin has been programming since 1995 and has
worked with .NET framework ever since its inception. He has authored or
co-authored half a dozen books and numerous articles on .NET technologies. He
has also penned a few books on Yoga. He was a well-known technology author,
trainer and an active member of Microsoft developer community before he
decided to take a backseat from the mainstream IT circle and dedicate himself
completely to spiritual path. Having embraced Yoga way of life he now codes
for fun and writes on his blogs. He
can also be reached there.
