Roll Your Own CDN with Amazon S3 and Cloudfront

If you serve a lot of static files from your website you can acheive a healthy speed boost for your visitors as well as offloading the burden of serving up those files by using Amazon Cloudfront to roll your own Content Delivery Network (CDN).

Setting up your own CDN is a three step process and it’s very easy to do. If you have not done so already you need to sign up for an Amazon AWS account and register for Amazon Simple Storage Service (Amazon S3) and Amazon Cloudfront.

Setting up your Amazon S3 bucket.

The best tool I’ve found so far for managing your Amazon S3 buckets is Cloudberry Explorer, which is available as freeware. Once connected to S3 you need to create a new bucket, I recommend naming it as the subdomain that you will use when you distribute it using Cloudfront. In this example the domain will be http://cdn.club-306.com, so the S3 bucket is called cdn.club-306.com

Enabling Cloudfront for your S3 bucket

Using Cloudberry pull up the properties of the bucket you just created. On the distribution tab check “Enable Distribution” and put your intended domain name in the CNAMEs field. Again we are using cdn.club-306.com in this example.

Once your bucket has been enabled for distribution you can see the publicly accessible domain name by pulling up the bucket preferences and looking on the General tab under Distribution – Domain name. Take a note of this domain, you will need it later.

Mapping a custom CNAME record to Cloudfront

This third step is optional, as your S3 bucket is now available on Amazon Cloudfront and you can access files within in it by using the public domain name you got from the last step. It is however possible to map the public domain to your own domain using a CNAME record. Setting up CNAMEs varies according to your registrar but all you need to do is set your subdomain to point with a CNAME to the public domain at Cloudfront. Shown below is the GoDaddy panel with the appropriate fields completed.

Now you are all set up to start using your Amazon Cloudfront powered CDN on your own domain, simple wasn’t it? All you need to do now is upload your files such as images and video and replace the links on your site to point to the CDN enabled domain.

Before and after speed comparison

If you want to see how much difference using cloudfront can make to the load times of your website then before you start be sure to run a page load test at pingdom.com. Before I set up Cloudfront for one of my domains the full page load time for the home page was 4.5 seconds. Running the same test after moving just a few of the images and the CSS files to Cloudfront and the load time dropped to 1.48 seconds, so now the home page is more than 3 times faster.

I’m continuing to investigate the Amazon S3 and Cloudfront services, so keep an eye out for a future update. If you have any questions please leave a comment and I’ll get back to you.