Using a CDN with WordPress – A real world example?

It is understandable to mistakenly assume that CDNs are only used by big sites that deliver huge amounts of data, whether streamed media or software downloads etc. This was the case in the beginning but the world has moved on and, as with most aspects of technology, bigger and faster are accompanied by cheaper.

Today, websites of all shapes and sizes are regularly featuring video and audio streaming and are often built using content management systems such as WordPress, Drupal, Joomla etc.

As of today nearly 20% of all self-hosted websites on the web are using WordPress (About 37 million). If you look at an average WordPress site using an analytical tool like GTmetrix (https://gtmetrix.com) you can easily see the overhead from WordPress itself together with theme elements, plugins and content. If your site has no commercial purpose then you’re probably not bothered about how fast and efficiently it performs but if not, you should be aware that there is plenty of potential to improve matters. One of the many tools available to improve your WordPress site is by using a CDN.

There is no substitute for a real-world example so here is our own website and we are going to see how far we can get in optimizing it today

The website uses WordPress with a one-page theme, parallax effects, large images and streaming video content. It is hosted on a mass-market reseller account using basic shared server hosting.

We have installed the W3 TotalCache plugin and setup a cdn resource on CDN.net.

We are using GTmetrix to measure its performance…

This is the starting point before using any optimization:

Unoptimized WordPress

Unoptimized WordPress

Now we set up a CDN (cdn1.logic-workshop.co.uk) resource using CDN.net, enable it in W3 TotalCache and run the test again:

WordPress with CDN 1

WordPress with CDN 1

Using the CDN, we have reduces the page load time by 26% from 4.6s to 3.4s. This has had a slight impact on the YSlow score but nothing else is changed significantly.

Now we’ll disable the CDN in W3 TotalCache and enable all the other caching options including minification, concatenation and compression of CSS and JS files to measure the impact of those features:

WordPress with W3TC caching.

WordPress with W3TC caching.

The various optimization techniques employed by W3 TotalCache have had a significant impact on the PageSpeed and YSlow scores but the real impact is the reduction in file requests and the total page size – 29% and 42% respectively. The resultant reduction in page load time is 26%.

Finally, we will re-enable the CDN and run it together with the caching.

WordPress with CDN & Caching

WordPress with CDN & Caching

As expected, the CDN returns the same marginal improvement in YSlow score but the real impact is the 21% reduction in page load time. This is a smaller reduction than before because now we have 29% fewer file requests to accelerate.

The end result is a 43% reduction in page load time and a 42% reduction in page size. As well as a significant improvement in user experience, the acceleration will also improve the SEO score with Google.

No comments

Be the first to post a comment.

Post a comment