How to Speed up Your Wordpress Website with WP Super Cache and CloudFront

In the post How to Use Dropbox as a Content Delivery Network for Wordpress I described how to use Dropbox as a poor man's content delivery network. Somebody over at cdnpoint said that this might violate the terms of service of Dropbox, especially when you have a website with high traffic. Though I think it is still a viable option to use Dropbox to deliver static files I recommend using a real CDN (Content Delivery Network). To do this we will install one Wordpress plugin and configure it to use Amazon's CloudFront for delivering our static files.

Wordpress Plugin WP Super Cache

Careful study on the internet reveals that most of the Wordpress users are using WP Super Cache or W3 Total Cache to add caching and CDN capabilities to their Wordpress installations. I haven't done any thorough comparison of the two plugins, but it seems that WP Super Cache is easier to install.

Amazon CloudFront

Before we can configure the WP Super Cache plugin, we need to create an account for Amazon's CloudFront service.

Click on the Create Distribution button. Choose Custom Origin (notAmazon S3 Origin). Enter your domain in the field labeled Origin DNS Name. My domain is cutemachine.com. Leave all other options untouched. Compare your settings to the following screenshot and then click Continue.

In the next dialog, just enter a comment and leave the other settings as preset by Amazon. Again, compare your settings to the screenshot given below and then click Continue.

In the last dialog review your settings. If everything is correct, click the Create Distribution button.

That's it.

In the CloudFront management console you will see the distribution you just created. Copy the domain name to the clipboard or write it down. Mine is d26up2jkoas2dz.cloudfront.net.

Now hop over to the Wordpress plugins page. Open the settings for WP Super Cache. Select the tab CDN. Click on Enable CDN Support. Paste the domain name into the field labeled Off-site URL. Do not forget to add the http:// in front of the domain name.

That's all: your static files should be served from CloudFront now.

You can test your installation by using the Pingdom Tools. Just enter your blog's URL into the text field and press Test Now. You will get an overview of all the load times for the resources of the page. You can also filter for resources served by the CDN. Do this by entering CloudFront into the text field labeled Filter URL at the top right. If there are no results you need to check your configuration and ensure that the settings are exactly as described in this post.

Conclusion

Adding a CDN to your blog is easy. You can do this in a few minutes. You should notice that your pages load much faster than before. With this method I was able to improve the loading times of my Wordpress blogs hosted on Bluehost considerably.

If you haven't subscribed to my blog's RSS feed, please consider doing so. You can also find me on Twitter and on Google+.