In this post I am going to show you how you can configure Cloudflare ‘Page Rules’ to cache your site on their edge servers. This will allow Cloudflare to show a cached version of your website to visitors if your origin/host is down or not available.
I am assuming you are already serving your website from Cloudflare. If you need help setting up the basic Cloudflare ‘Page Rules’ take a look at my earlier post explaining how I setup my website with the three rules that you are allowed for free. You can purchase additional 5 rules from Cloudflare giving you a total of 8 rules. Additional rules from Cloudflare will allow you to set more precisely targeted rules for your website.
The rule we are going to add is called ‘Edge Cache TTL’ setting in the Page Rules of Cloudflare dashboard and it controls how long the Cloudflare edge server will cache a resource before going back to your origin/host to fetch a fresh version of that resource. These rules can be applied to any resource served by your website.
I have enabled two rules, one specifically for everything served from the wp-content folder and one that applies to the rest of the URL’s. I cache static assets like Javascript, CSS and images for a month and rest of the site for two or more hours.
As long as your pages are already in Cloudflare edge server, you can be assured that if something happens to your origin/host, your visitors will not see an error, instead they will see a cached version of that page. Do keep in mind that if the Edge server does not have a cached version of the page, your visitors will see an error.
With Edge Caching comes another issue, when you publish something new, that post may not show up on your site if Cloudflare has a previously cached version. If you set the TTL to 2 hours, then it could take that long for the new page to show up. You can however use the Cloudflare plugin which helps purge items from their cache or you could purge the same from Cloudflare dashboard yourself.
Steps
Login to your Cloudflare account and navigate to the Page Rules page on the dashboard. The rules are applied in order that they are listed on the page. So when you add a new rule make sure it is after all the other rules you already have.
Set up a new rule for everything served out of wp-content* matching your website.
- Set ‘Always Online’ to On.
- ‘Cache Level’ set it to Cache Everything
- ‘Edge Cache TTL’ to a period that you wish. I set mine to a month. If I change something, I can always purge my cache.
The next rule will probably be the last one among your rules. This would apply to anything that has already not matched a rule before this. The path is /*.
- Set Always Online to On.
- Cache Level set it to Cache Everything
- Edge Cache TTL to a period that you wish. I set mine to two hours which is the minimum allowed by my Cloudflare plan.
Another option you can consider setting is under Caching on the Cloudflare dashboard. I have shown it here in the image below. If you set this to on and your website origin/host returns a 500, 503 or 4XX error, then Cloudflare will server your site from cache if a cache version is available.
Conclusion
With these rules in place, I know I can do a quick maintenance on my host and not worry about the site not being available to my users.
Disclosure:
I am not being paid by anyone to promote Cloudflare on my website. You do not have to purchase any additional rules.
You are free to use any service from any company to accomplish what I have demonstrated in this post. This post just highlights how I cache content on Cloudflare using ‘Page rules’.
I do use more rules than available under the free plan.
