Seriously Optimize Your Website With WP Super Cache And Max CDN
We recently launched our new website at ITXDesign.com that features our new line of VPS Servers, Dedicated Servers, and Shared Web Hosting Plans. After the launch we were tasked with quickly optimizing the site to take advantage of some of the latest optimization and caching tools. The first thing you should do before making any changes to your website is test the site using webpagetest.org. This will allow you to establish a benchmark on how your site ranks. Run the test:
When we first ran the test we had very low rankings for almost all of the items that webpagetest.org checks. We had a few A’s, however most of the tests failed horribly with D’s and F’s.
- First Byte Time
- Compress Transfer
- Compress Images
- Progressive JPEGs
- Cache static content
- Effective use of CDN
Our goal was to get all A’s since we’re over achievers, however it wasn’t an easy task. Our visitors appreciate a fast loading website so we began the process of speeding things up.
This tutorial is primarily for WordPress Websites as that’s what we use for our corporate sites.
Step 1. We installed and configured WP Super Cache. To complete the install login to your worpdress admin, click Plugins, and then search for “WP Super Cache”. Click the install and the activate the plugin. This alone will address a lot of the issues. Once the install is complete go to the settings for the plugin, Click the Easy tab, and then select “On” caching. Then Click Update Status. After this we would suggest clicking the Advanced Tab and be sure to select the following options:
- Cache hits to this website for quick access. (Recommended)
- Use mod_rewrite to serve cache files. (Recommended)
- Compress pages so they’re served more quickly to visitors. (Recommended)
- Cache rebuild. Serve a supercache file to anonymous users while a new file is being generated. (Recommended)
Then Click Update Status
This will enable the WP Super Cache Plugin, however there’s still one more step. After applying these changes you must click Update Mod_Rewrite Rules. This will update your .htaccess file automatically with all of the caching directives so caching is enabled.
This step really helps with the First Byte Time and Compress Images. It causes your website to create a cache version of each of your dynamic pages. In other words it speeds up the first response from the server since it doesn’t happen to make multiple mysql calls and generate the page on the fly. Once you’ve completed all of this it’s time to go to webpagetest.org again and run another test. First you should open your website homepage in your browser to ensure the cache is generated. Then run the second test and grab a cup of coffee.
Setting Up MaxCDN With WP Super Cache In WordPress
Step 2. To resolve the rest of the optimization issues we would suggest setting up a CDN account with Max CDN
The benefits of a Pull Zone with Max CDN
You should really consider using a Pull Zone. If not then every time you upload a new image to your website you would have to login to your CDN account and upload it there. However, with a pull zone you simply upload the image to your website. The first time a visitor goes to your site and requests an image that’s not in the CDN, the CDN will automatically download that image from your site, add it to the CDN, and then display the image to the visitor. This initial pull is slower than hosting the image yourself, however after the first pull the image is stored in the CDN and you’ll see a huge improvement in speed.
Setup a Sub Domain or CNAME Record for Your CDN
In this step you can choose to either use the url that Max CDN provides or you can setup a sub domain using your own domain name. We would suggest using cdn.yourdomain.com. Contact your hosting provider and have them create a new dns cname record that points cdn.yourdomain.com to your url with Max CDN. Your Max CDN url can be found by logging into your account, click Zones, click Manage next to the zone your created, Click Settings. Then scroll to the bottom under custom domain settings. For custom domains enter in cdn.yourdomain.com and click add. Right below that you will see: domain.domain.netdna-cdn.com. Copy the CNAME to and that’s what you send to your host. This will allow them to setup your CNAME Record and point cdn.yourdomain.com to your Max CDN CNAME to domain.domain.netdna-cdn.com.
Enabling a CDN in WP Super Cache
After you’ve installed WP Super Cache and setup Max CDN you have to login to WordPress and enable the CDN function.
- Login to WordPress
- Go to Settings –> WP Super Cache
- Click the CDN tab
- Check “Enable CDN Support”
- Off-site URL “cdn.yourdomain.com”
- Additional CNAMES “http://cdn.yourdomain.com”
- Check “Skip https URLs to avoid “mixed content” errors”
- Save Changes
We followed all of these steps and in the end it was very rewarding. Our website is now superfast and we were able to achieve all “A’s” with webpagetest.org
If I had to rank this on difficulty for the average user I would say it’s an 8 out of 10. You have to understand caching, dns, cname records and CDN services in order to optimize your website and achieve a great report. If you have questions leave a comment and we’ll try to help. If your website is hosted with us and you’re using WordPress you can open a support ticket and we can handle the setup for you which is included in our hosting and support services. If not we offer this service to non-clients for $150 if you’re using WordPress and your website is hosted by another host.
WordPress Web Hosting, WP Super Cache, and MaxCDN are the ultimate combination if you want a fast website that utilizes the best in caching and content delivery networks.