Enabling HTML Cache in CloudFlare

Cloudflare is a type of free CDN to protect your server from attacks and make your website faster and with a more robust cache. In this article we will teach you step by step how to further improve your speed with Cloudflare HTML Cache.

Natively, CloudFlare does not cache HTML, but it is possible to enable this feature and achieve much greater and almost instantaneous loading speed for your page. Just be aware that this feature may cause issues with some themes and elements of the site, so make sure to test before enabling it.

Enabling CloudFlare HTML Cache

To enable HTML Cache in Cloudflare, simply access the Page Rules tab in your CloudFlare dashboard and create a new rule that covers all domains or subdomains, select Cache Level and choose the option Cache everything. Just add as in the image below:

Ativando Cache de HTML no CloudFlare

By doing this, just save and clear the CloudFlare cache to apply the new rules, now your website will work with HTML cache and will load the pages almost instantly.

Cloudflare HTML Cache Issues

One of the small mistakes I noticed is that if you keep it enabled in the wp-admin of WordPress, there is a risk that you might open an outdated code editor or article and save it. Therefore, always refresh the page a second time or clear the cache before editing it.

Another issue is that sometimes the WordPress admin bar doesn't appear. It hasn't happened to me, but if for some reason the wp-admin bar is showing up for non-logged users, just disable it with a code in function.php.

Despite these small sacrifices, I think it is worth activating the HTML cache, your site is much faster. Perhaps with a few settings and adding exceptions to Page Rules you will be able to use this function without any problems.

To avoid issues in your Wp-Admin, you can disable HTML Cache by creating another specific rule for the /wp-admin part of the site. This way, you can use HTML Cache on the Frontend without any problems.

Solving 301 Problem

We previously wrote about a problem related to 301 redirect that can also be solved with a Page Rules. Unfortunately, if you enable HTML Cache, this problem reoccurs as well.

An alternative is to activate the HTML Cache only in its HTTPS version without WWW. which is an easy thing to do, but I believe leaving out your subdomains. As the free version of CloudFlare only allows 3 active Page Rules, we recommend using it wisely.

Enabling the HTML Cache for your website will help you achieve a 90+ on PageSpeed. Remember that we wrote an article on how to achieve 90+ on mobile with Adsense.

Ativando Cache de HTML no CloudFlare