How to Use CloudFlare Full Page Caching With WordPress

In this post you will learn how to use CloudFlare Full page caching with WordPress by writing three basic page rules.

CloudFlare by default caches CSS, Images and JavaScript but it doesn’t cache HTML pages.

When you use page rules to cache your HTML pages, the majority of your content will be served from CloudFlare servers around the world.

I like using CloudFlare Full Page Caching to improve the speed of my WordPress sites and reduce the load on my server.

Am I Saving Server Resources?

If you don’t clear the cache of your site very often, you will see that more than 90% of requests are served from CloudFlare CDN.

I use a basic Digital Ocean plan to host 9 sites and my server is healthy. I never use the resources available per month.

These are the stats of one of my sites, as you can see, CloudFlare is taking care of 96% of request made to my sites.

How to Implement CloudFlare Full Page Caching

Implementing CloudFlare Full Page Caching is not that difficult

  1. Go to CloudFlare
  2. Go to your domain
  3. Then go to rules
  4. Finally write these three rules for your domain in that specific order.

From the moment you do this, CloudFlare will save a copy of your content in their servers and serve it.

Common Issues with CloudFlare Full Page Caching

With those three CloudFlare Page rules:

  1. Your WordPress dashboard won’t be cached
  2. You will be able to preview the changes you make to posts or to your theme appearance
  3. Your pages and posts will be cached.

The changes you make to your site won’t be visible until 30 days pass and the version of your posts and pages is cleared.

Clearing your Cache Manually

You can solve that minor issue by clearing individual urls or the whole site

  1. Go to CloudFlare
  2. Go to Caching
  3. Then to Configuration
  4. Click on Custom Purge
  5. Add the URL that you want to purge from the cache

Clearing the Cache Using the CloudFlare Plugin

You can also install the CloudFlare plugin and make sure the content is cleared when you make changes in the appearance of your WordPress site

You can also clear the purge everything or purge individual files

Should I stop using my Caching Plugin

A while ago, I stopped using caching plugins because I didn’t find a really good reason to keep them

But I am using WP Rocket to remove unused CSS.

I also recommend Swift Performance Lite because of the preloading functionality and the Critical CSS

Autoptimize can help you minify JS, HTML and CSS of your site. If you think that inlining all CSS is a good idea.

Manuel Campos, English Professor

Manuel Campos

I am José Manuel. I am writing about things I know and things that I am learning about WordPress. I hope you find the content of this blog useful.






© 2024 WP SURFER • Made with Love in Costa Rica