blog/source/_posts/cloudflare-html-cache.md

1.8 KiB

title excerpt date tags
Cloudflare does not cache html by default But it can be easily enabled 2020-11-21
cloudflare

In this guide, I'll show you how to enable html caching. Since the inception of this website, I always make sure caching is configured correctly so that most of the content are served from CDN, which is much faster than serving content from my origin server. This is in addition to the fact that this website is a static site, so all content are cacheable. I configured caching in Netlify, Caddy and Cloudflare.

However, for the past 8 months, the analytics (Analytics -> Performance) showed that only 1% is served from cache.

1% bandwidth saved

It was only last week that I realised that Cloudflare does not cache everything by default, only certain file extensions are cached and they do not include HTML and XML, despite majority (55%) of content served are HTML and XML.

Html caching can be easily enabled through Page Rules. Since my site's content are all static, I opt to cache everything instead. To achieve this, I created a new page rule:

  • URL: https://mdleom.com/*
    • The asterisk (*) is to apply the page rule to every page under HTTPS, instead of just the homepage.
  • Setting: Cache Level
  • Value: Cache Everything

After a week with the new page rule, cached content has now increased to 72%.

72% bandwidth saved