How To Make WordPress Faster Using W3 Total Cache and CloudFlare

By Jonathan Griffin. Editor, SEO Consultant, & Developer.

· 29 min read

Slow sites really suck. Just ask anyone. If I’m trying to load a web page, and have to wait for more than a second or two, I’m out of there.

That’s why I am going to show you how to make your WordPress site significantly faster by implementing W3 Total Cache and CloudFlare. With my optimal settings, your site will literally fly, I promise.

But why do you need a fast website, I hear you ask.

There are multiple reasons, and they are best seen in light of the following information:

Google did some research into the relationship between page load time and bounce rate and found that:

  • The average time it takes to load a mobile landing page fully was around 15 seconds in February 2018, an improvement of 7 seconds from 2017.
  • 53% of mobile site visits leave a page that takes longer than three seconds to load.

Here are the full stats from Google:

Mobile page speed benchmarks relating to bounce rate.
Mobile page speed benchmarks relating to bounce rate. CREDIT: GOOGLE

You get the point.

This can really hurt a company’s bottom line, with less traffic, and ultimately resulting in fewer sales or advertising revenue.

Why are Unoptimized WordPress sites so slow?

Let’s say I visit a page on an unoptimized WordPress site.

It can take many seconds to load because WordPress builds that page from scratch. When a user requests the page in the browser, it is created using PHP templates, and is populated with information from a database.

The problem is confounded because many WordPress theme and plugin developers produce all-singing, all-dancing themes, and plugins.

They try and do everything for everyone to appeal to as many people as possible, because, you know, sales. This means more templates, PHP scripts, and database calls. Resulting in, of course, slower sites.

You get the picture. Unoptimized WordPress sites are slooooooooow.

Thankfully, there is a solution, and it involves W3 Total Cache and CloudFlare.

How will W3 Total Cache and CloudFlare improve your page speed?

The W3 Total Cache WordPress Plugin boosts your site speed by caching the dynamically rendered portions of your page into plain HTML. This means subsequent visitors will see a pre-rendered HTML version of a web page instead of it being created on demand. It integrates seamlessly with many content delivery networks, including the CloudFlare CDN for increased site performance.

In addition to caching the HTML of the page, W3 Total Cache can minify, compress and enable browser caching of your pages to reduce bandwidth usage by up to 80%.

CloudFlare increases your site speed by using a CDN to cache your static files at multiple servers around the world, instead of just one server. Because the files are served closer to your visitors, they load significantly faster.

Another option (which may be suitable) for CloudFlare users is to use Page Rules to cache the HTML of your page and server those via the CDN.

There are many other website optimization benefits to using CloudFlare, including Javascript optimization, Image Optimization, DDoS protection, HTTP/2, Browser, Argo Smart Routing and Tiered Caching.

I’ve kept this tutorial simple, but there is a lot to get through. You should allow between 30 minutes and an hour to set everything up. It will be worth it, I promise.

Part 1. How to Install the W3 Total Cache Plugin

Part 2. How to Configure W3 Total Cache Settings for CloudFlare

It can be tempting to install W3 Total Cache, enable everything, and then call it a day.

While this is feasable, you can get significantly better results if you take 10 minutes to customize it properly.

I’ll take you through all the steps in no time. Don’t worry.

After showing you how to configure W3 Total Cache, I’ll walk you through how to set up CloudFlare.

Part 2.1. General Settings

Part 2.2. Page Cache

Part 2.3. Minify

Part 2.4. Database Cache

The Database Cache will store the most commonly used queries used by your WordPress website to reduce the time it takes to load the dynamically generated parts of your website.

Part 2.5. Object Cache

The object cache will store the results of common runtime operations that again will reduce CPU usage and in turn also speed up your website.

Part 2.6. Browser Cache

Browser cache stores web pages and static files in the browser so that upon subsequent views the data is retrieved from their saved copy in the browser.

W3 Total Cache uses the browser settings for the Page Cache times.

Part 2.7. Ignore the remainder of the Sections

Part 2.8. Deploy W3 Total Cache Settings

Part 3. How to set up CloudFlare

Part 4. How to Configure CloudFlare for WordPress

Frequently Asked questions

What are the different types of WordPress Caching?

  • Page Cache — If you use a CMS, such as WordPress, whenever a page is viewed the server has first to query the database and run scripts to understand what form it should take. Page Caching stores a copy of the finished page so it can be retrieved without having first to do all this work for subsequent loads.

  • Database Cache — This stores the results of any database queries, making the retrieval of subsequent duplicate queries faster.

  • Fragment Cache — A page can be made up of various parts (i.e. Main content, Sidebar, Footer, etc.). Fragment Cache works like Page Cache but can store and retrieve each section separately.

  • Object Cache — This stores any calculations made by the WordPress API into the cache.

  • Browser Cache — This places a copy of the webpage in the Users Browser Cache. When that user re-visits the same page using the same browser, it will be loaded from the cache stored on their computer rather than querying the web server.

What are the different caching methods?

Shared Servers:

  • Disk: Basic - This method will invoke a PHP script to serve the cached page.
  • Disk: Enhanced - This method will modify the .htaccess file to direct Apache to a static Cached version of the page, so is much faster, and recommended.

If for whatever reason your website slows as a result of using Disk: Enhanced then we recommend you find a new host. It is very rare that this happens, but it is not unknown.

Dedicated / Virtual Server

While the majority of hosts do not offer these on shared hosting, there are some exceptions, especially on the most expensive plans such as Business Hosting or Semi-dedicated hosting.

  • Opcode: Alternative PHP Cache (known as APC Cache) - This caches the PHP code into RAM, and for a long time was the PHP Opcode Cache of Choice. It is now used much less as it is no longer supported, and will only work with PHP 5.4 and below. There are no plans to make it work with PHP 5.5. and 5.6.
  • Opcode: eAccelerator - A not so common Opcode cache, but one you will see from time to time. Again, it will store compiled PHP scripts into shared memory and will execute code from it speeding up dynamic websites.
  • Opcode: XCache - This is now the go to Opcode cache of choice. It is well supported, and updated and works with all versions of PHP. XCache has both a PHP Cache component that works to cache the PHP files directly into RAM and a Variable Cache component that works off the W3TAPI to cache the data that is subject to change. This is our recommended choice.
  • Opcode: WinCache - This is an Opcode Cache for Windows servers.

Multiple Servers

  • Memcached - Memcached is a distributed system that you will often see when web hosts have multiple server configurations. It speeds up dynamic web applications by reducing database load by storing chunks of data from the results of database calls.

Which WordPress versions are supported?

3.2 or higher.

Will the plugin interfere with other plugins or widgets?

Sometimes you can experience display issues caused by using the minification functionality. For this reason, I recommend using CloudFlare for minification.

No, you should uninstall any other caching solutions (not just disabled).