Improve website performance with Cloudflare

→ Are you a new visitor? Please visit the page guidance for new visitors ←

Improve website performance with Cloudflare

Its been a while since my last article on website optimization, the reason for this is because I really haven’t made much changes on my site since long ago. Recently however I switched back to Cloudflare, thought of giving them a test again and it loads fast, I can’t really complain much about this, but it could be even faster. Here’s what I thought:

What if I make Cloudflare serve my website completely from their servers?

Lets try to explain a bit …

Of course I’m referring strictly to static resources like css, images, js, but wait! What about html/htm pages?

Cloudflare has a rule set that it would not cache html/htm pages since there’s really no point in doing it normally. These pages have really low resources and you probably want to not have it cached. If you have a pretty good web server, speed with Cloudflare should be really good. But caching html/htm pages could be better, right?

I mean, lets face it, html pages are static pages that you normally don’t change. Or if you do need to make changes, you will rely, where possible, on the browser side, using javascript. On this specific website you are reading, I really don’t go in each article and changing things once a post has been published, so almost everything is pretty much static. I say almost since the homepage does refresh a couple of times a day, plus the comments. But from what I could see, if last modified time on page is different, Cloudflare will update it properly.

Why would you want to do this?

Well the reason why you would think in doing this is simple, less time to reach your website. It would load it directly from Cloudflare servers. I’ve seen response time going down to 20ms from around 100ms. This is a good improvement!

Users will like a fast website, as well as crawlers like google or bing. So in the end, I really have nothing to lose.

How can you do this too?

Its actually quite simple, I’m really surprised that I haven’t noticed till now, there’s an option when you click in the right side of your domain, in your Cloudflare account, called “Page rules” (right in the dropdown menu).

For free Cloudflare accounts I can see you are allowed to create up to 3 page rules, but this is fine for now. What I did, was to create a page rule that would match everything from my website using the asterisk symbol “*”.

I created however 3 rules, one that would cache everything and 2 others that would bypass cache.

Warning! It is important that you have a rule for your admin section to bypass cache else you won’t be able to login anymore. 

For me it looks something like below:

Update 24 Jan:  Page rules needed updated for login and wp-admin to work as expected.

Improve website performance with page rules

Improve website performance with page rules

Since I’m trying to improve website performance on my wordpress website, as you can see, I’ve whitelisted my admin section to be able to login.

Then its just a matter of understanding that you should only make use of the browser for any programing changes, for example, you would use javascript to make any dynamic changes you need on your page.

That’s all for now, will see you again with a new tip.

Request an article ←