Cloudflare is a popular service that offers DNS, CDN, security services, and more. It is often used by WordPress site owners to speed up and secure their websites. By default, Cloudflare automatically caches static assets like CSS, JS, and images. With a little extra work, Cloudflare can also be configured to “cache everything,” which means a static HTML copy of your website will be cached and served from Cloudflare’s extensive network of data centers around the world. In this post, you’ll learn more about Cloudflare’s “full page cache” feature, and if it’s a good option for your WordPress site.

Who Should Use Full Page Cache?

Cloudflare’s full page cache feature is not for everyone. In general, WordPress users with largely dynamic websites should not enable full page cache. One example of a dynamic WordPress site is a WooCommerce store, which requires “add-to-cart” and billing functionality. With Cloudflare’s full page cache switched on, one customer’s cart will get cached and served to other customers. Similarly, private billing details like names and addresses on a checkout page could also get cached.

If you’re running a standard blog or simple business website, enabling Cloudflare full page cache could result in a significant performance boost. The only thing to keep in mind is that WordPress’ default commenting system may not play nice with full page cache – new comments won’t show up until the Cloudflare cache is cleared. Based on the information above, this website is the perfect candidate for Cloudflare full page cache because it’s pretty much completely static – no store functionality, no comments, and no contact forms.

How to Set Up Cloudflare Full Page Cache

To set up Cloudflare full page cache on your WordPress site, you’ll have to make a page rule like the one in the image below. Makes sure you replace staging-brian.kinsta.cloud with your own domain name.

Cloudflare Full Page Cache Speed Test

Below are two examples of speed tests with Cloudflare full page cache disabled and enabled. For reference, my origin server is located in Los Angeles, and the speed test was conducted with KeyCDN’s speed test tool from San Francisco and Tokyo.

San Francisco — Full Page Cache Disabled

Since my origin server is located in Los Angeles, performance is already stellar with Cloudflare full page cache disabled.

San Francisco — Full Page Cache Enabled

With Cloudflare full page cache enabled, the page load time was reduced by 40% to a mere 98.913 ms.

Tokyo — Full Page Cache Disabled

The effects of Cloudflare full page caching are much more obvious when there is significant geographical distance between the origin server and client. Since I use Kinsta’s high performance web hosting for staging-brian.kinsta.cloud, running KeyCDN’s speed test tool from Tokyo with Cloudflare full page caching disabled still resulted in a very fast page load time of 587.867 ms.

Tokyo — Full Page Cache Enabled

With Cloudflare full page cache enabled, the page load time was reduced by an incredible 89% to 64.395 ms. In other words, Cloudflare full page cache enables visitors from Tokyo to browse this website 9x faster – this is very important because staging-brian.kinsta.cloud also has Japanese, Korean, and Chinese content.

Bypassing Cloudflare Full Page Cache

Sometimes, enabling full page cache site-wide is not a good idea. Even on a relatively static site like this one, there are a few pages that shouldn’t be cached by Cloudflare’s full page cache feature – the home and archive pages are two examples. Fortunately, there are a few different ways to selectively bypass Cloudflare full page cache on your WordPress site.

Cloudflare WordPress Plugin

Cloudflare’s official WordPress plugin has an “automatic cache purge” feature that automatically clears the cache “when you change the appearance of your website.” Presumably, this means the plugin will automatically purge the cache if a new post is published or if even existing post is updated. I personally don’t use this plugin on my WordPress site because I like to install as few plugins as possible. If this plugin works as advertised, it would essentially act as a bypass of sorts by automatically clearing Cloudflare’s cache when necessary.

Selective Cloudflare Page Rules

Setting selective page rules is the method I’m currently using for Cloudflare full page cache on staging-brian.kinsta.cloud. The upside to this method is that it’s convenient and easy to set up. The downside to this method is that it’s not free because it typically requires more than three page rules. For me, this isn’t an issue because I pay $20/month for Cloudflare’s Pro Plan, which comes with 20 page rules and a bunch of other useful features.

Here’s what my Cloudflare page rules look like.

Since page rules work on a “first match, first serve” basis, the “catch-all” URL *staging-brian.kinsta.cloud/* is at the end of the priority list. Above the catch-all URL are various URLs that should not have full page cache enabled. I like this method because it provides a very granular level of control over Cloudflare’s full page cache. If you’re on a free Cloudflare plan and want to use this method, I recommend paying $5/month for five extra page rules.

Origin Server Cache-Control

Cloudflare’s “cache-control” setting can be configured to “respect existing headers” – this means Cloudflare will not overwrite the origin server’s cache-control settings. Thus, you can disable Cloudflare from caching certain pages by adding the PHP code below to the corresponding page templates.

<?php
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
?>

Depending on your level of technical skill and server configuration, adding custom cache-control headers could be a suitable method for bypassing full page cache on certain pages. For example, adding the code above to your index.php template would tell Cloudflare not to cache your home page.

Conclusion

Cloudflare full page cache is a powerful tool for speeding up your WordPress site – especially for international visitors. If you’re running a normal blog or static business website, I highly recommend looking into setting up Cloudflare full page cache. If you’re running a dynamic site like a WooCommerce store or a bbPress forum, it’s still possible to reap the benefits of Cloudflare full page cache by implementing it on specific URL structures.