Web Development / WordPress

How to Configure W3 Total Cache & CloudFlare

Dec 01, 2022
15 min read
W3 Total Cache and CloudFlare Tutorial

Slow sites 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 will 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 the 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 fully load a mobile landing page 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.

You get the point.

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

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 web page version instead of 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 worldwide 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.

This tutorial was last updated on 26th November 2022 and includes new screenshots.

Part 1. How to Install the W3 Total Cache Plugin

Part 2. How to Configure the Best W3 Total Cache Settings

It was quite a task to configure W3 Total Cache with optimized settings properly.

Now, you can configure W3 Total Cache with the best settings in just a few minutes by using the W3 Total Cache Setup Guide.

Let us show you how right now.

Part 3. Advanced W3 Total Cache Settings

For most sites, the default settings are perfectly fine.

Unless you have a specific reason or are just someone who loves looking at detail, you can happily proceed to part 4, where we set up CloudFlare.

Here is what we will cover in part 3:

  • Minification: For HTML and CSS.
  • Advanced Page Cache Settings: Caching of Category and Tag pages and excluding specific pages from being cached.

There are other Database, Object, and Browser cache settings, but we recommend leaving these at the default settings. We don’t recommend minifying Javascript files.

Part 4. How to set up CloudFlare

Part 5. How to Configure CloudFlare for WordPress

Congratulations. You have successfully configured W3 Total Cache with CloudFlare

Hopefully, you managed to make it to the end. We promise it was worth it.

Your site will be faster, use fewer resources, and be protected against malicious bots, and your increased performance will even help with SEO.

We call that a win. Enjoy!

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 retrieving 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 revisits 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 it is much faster and recommended.

If your website slows due to Disk: Enhanced for whatever reason, then we recommend you find a new host. This rarely happens, but it is not unknown.

Dedicated / Virtual Server / Premium Shared Hosting

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

  • Opcode: Alternative PHP Cache (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 execute code from it, speeding up dynamic websites.
  • Opcode: XCache - This is now the go-to Opcode cache of choice. It is well-supported, updated, and works with all versions of PHP. XCache has both a PHP Cache component that caches 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.
  • Memcached - Memcached is a distributed system often seen 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.

Is this plugin compatible with other popular caching plugins?

You should uninstall any other caching solutions (not just disable them).