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.
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:
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:
The same can also be accessed by typing in:
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