What Is a CDN And Why Do You Need It?

The web is a very different place today from what it was. A report released just a few months ago in July 2014 reveals that the average page size on the Internet has breached 1.6 MB. If you consider that at one point of time, 3 1/2 inch floppy drives used to store 1.44 MB, it gives you an idea of the sheer volume of bandwidth we’re talking about for each page load! Whether you’re using a framework as famous as WordPress, or one which is a little less familiar, you need to find a way to deliver your content to users as quickly as possible. A couple of years ago, the New York Times ran a segment on how a mere 400 ms can be “too long” for a page to load before users close it out of frustration. That time has substantially decreased since then.

The majority of the size of a page is taken up by static content that doesn’t change frequently or at all – images, CSS files and JavaScript etc. The actual HTML content of a web page comprises a tiny fraction of the page size. So you need to find a way to quickly deliver this static content to your users without relying on slow isolated servers. Whether you have a shared web hosting plan or a VPN, as an individual you simply do not have the resources to mirror your content on servers throughout the globe so as to adequately serve every geographical region. Left to itself, your system will serve a visitor from Japan from the same location as a user in the US. From an efficiency point of view, this is a terrible setup. And this is where CDNs come in.

How Does A CDN Work?

A Content Distribution Network or CDN takes all the heavy loading files from your site and places them on fast, easily accessible servers around the world. This means that the response time of a user in Japan will be comparable to that of a user in the US since each will be downloading an image from a server close to them. MaxCDN is one such example of a service. By reducing the load on your server and distributing your image and static CSS/JavaScript files on their own highly responsive machines throughout the globe, you’re able to deliver a blazing fast user experience to all your customers. Here’s how it works:

I’m going to use the example of my WordPress blog at www.bhagwad.com. By default, all of WordPress’s image files are stored in http://www.bhagwad.com/blog/wp-content/uploads/ . What we want is for MaxCDN to pull the image files from this location and serve them directly from their servers. When you log into MaxCDN, the first thing you do is create what is known as a “Pull Zone”. As you can see in the screenshot below, you get this option when you click the “Zones” icon at the top of the screen.

Creating a zone is simple. It requires three pieces of information:

• A zone name
• The origin directory URL
• A zone label for identification

As you can see in the screenshot below, I’ve used my WordPress image directory in the second text box.

Once we’ve saved this and MaxCDN has finished creating a zone, we’re taken to the next screen giving us the details:

What this screenshot tells us is simple. It means that any file within my upload folder gets mirrored onto MaxCDN’s servers throughout the globe and is accessible via the new “CDN URL” as seen above. So if I have a file on my site accessible from this URL within the uploads folder of WordPress:

http://www.bhagwad.com/blog/wp-content/uploads/2011/01/Vito-listens-to-a-personal-request.jpg

The same can also be accessed by typing in:

http://image-files.writerinccom.netdna-cdn.com/2011/01/Vito-listens-to-a-personal-request.jpg

You can see that the base URLs have been rewritten. At least that’s how it should work in theory. Let’s test it out by trying to load each URL:

As you can see in the screenshot above, both URLs display the image. I didn’t have to do anything to mirror the file on MaxCDN’s servers. Everything happens automatically. Of course, we need to find a way to automatically rewrite in-page URLs so that web pages contain the CDN base instead of the origin server base. There are many ways to do this including creating subdomains etc. WordPress in particular has a neat plug-in called W3 Total Cache that takes care of all the hard work in the background.

But this is the basic idea of how a CDN works and why every site will benefit from using one. By replacing your server as the origin point for thousands of requests of the same files again and again, you instead outsource the heavy lifting to highly responsive third-party servers across the globe. This way, you can provide your visitors with an optimal viewing experience regardless of where they are and what hosting plan you subscribe to!

Thanks to maxcdn.com