If you are obsessed with performance, then this post is for you…
I overpaid for hosting because I like my managed WP with BigScoots. However, I was heading towards needing to upgrade to a more expensive plan, which would have been enough to make me change to WPX or somewhere else. I did not want to deal with that or pay someone else to deal with it for me!
This caching easily drops me below the thresholds for my image-heavy site, which gets a decent amount of traffic.
Step 1)
This first step is free and should get you to around a 90% cache hit ratio.
You can sign up for Cloudflare and have it proxy your site. As long as your server is properly setting cache headers for static files, Cloudflare will automatically start caching all your images, CSS, JS, etc. HTML, such as your homepage, posts, etc, will NOT be cached!
Step 2)
This is free and should always be enabled!
Just go to Caching > Tiered Cache and enable “Argo Tiered Cache.”
Step 3)
This costs $5/mo, or it is included if you have Cloudflare Pro. It should get you to around a 95% cache hit ratio.
After signing up for Cloudflare, you need to enable Automatic Platform Optimization (APO)
APO caches your dynamic HTML, such as your homepage and your posts
APO does not cache 301 redirects, 404 pages, or anything that is NOT HTML with a 200 response code
If you use APO, you should use the Cloudflare WordPress plugin because it will help to clear the cache when you update posts and such automatically. The plugin is not strictly required, though
Step 4)
Now, we are going to leverage a new feature by Cloudflare that was just recently released and is still in Beta to get you to a 99.5%+ cache ratio
Go to the Cache > Cache Rules page
Create a new Rule that looks like this:
Make sure you properly put the Cookie condition and set the Edge TTL to Respect Origin.
What this does is it will also cache your 301 redirects, 404 pages, etc.
Step 5)
This is optional and costs a bit more money depending on how much traffic your site gets, but it will help your cache hit ratio. At 400k monthly pageviews, I think it will cost me around $7/mo
Go to Caching > Cache Reserve and enable it. Be patient because it takes a while (like several days) for the Cache Reserve storage to fill up.
Will this magically make your website fast?
Yes and no. If your front-end is already optimized and you sometimes get slow server responses, then yes! But if you have a bloated front, then this will certainly help, but you’ll still need to deal with that.
I strongly recommend Cloudflare Pro for $20/mo. Your traffic will get higher priority than traffic on Free Cloudflare plans. Also, you get access to APO for free and Image Optimization. This means no Short Pixel or any other plugins for image optimization!
Update –
Very quick update just because it has been a few months since I posted this!
In that time, I have not tweaked performance plugins, Cloudflare settings, or anything else. Everything has just been working perfectly, and I’m continuing to get great performance.
Here is the cache hit ratio over the last 30 days…
Keep in mind this is from all requests, even random bot requests, so you can imagine that actual humans are getting closer to 99% because they aren’t scanning your site and requesting random URLs:
QUESTIONS
I have a question on step 3:
1. Caching 404s. What if a page wasn’t available before (404) but is now? I’m guessing it’ll show a cached 404 version, right? Until I manually purge the cache for that page.
301s. I’ve got a bunch of HTML redirects that redirect HTML pages without trailing slashes to the version with trailing slashes (no idea where all of those are coming from). Will this take care of it as well? Like, if 301s are being cached, does it just cache the redirect and not hit my origin anymore but redirect to the trailing slash right away?
2. What about htaccess redirects? Some of my pages are being 301 redirected in htaccess. Will these not hit my origin anymore, either? That would be awesome!
3. Most of what hits the origin for me is admin_ajax, which is dynamic. As the return is different every time, I’m guessing those can’t be cached.
Answer – With the Cloudflare plugin with APO enabled, it probably will clear the cache if you publish a page at that URL, but I haven’t tested that. If you are worried it will cache for too long you can set 404s to specifically only cache for 1 hour in the cache rule setting. Otherwise, it is based on your response’s cache headers. Personally, it hasn’t been an issue for us.
- Yes, it will cache all 301 responses, including the trailing slash redirects, as long as your server sets the appropriate cache headers. I don’t use any cache plugins on my server, and these were cached for me just fine, so I think it’s the default behavior, but you’ll want to check your responses.
- Yeah, those are probably POST requests and also don’t have any cache headers set, so likely that they won’t be cached.
I’ve always tried to run my sites lean and make sure they load fast, because when I started building sites, people were still on dialup lol. But when I tried Cloudflare – twice – by switching the nameservers to it, it was slower than my current host, and I had connectivity issues (my current host rarely has downtime). Am I not using CloudFlare properly?
NB – My speed is already very good without a CDN, except for TTFB, which I’d like to improve, but I haven’t noticed CloudFlare improving it.
Answer – Cloudflare will not cache HTML files by default. As my post mentions, you need to use APO. This could be why you didn’t see it improve TTFB since, out of the box, it will still be hitting your server with every single HTML request.
As for general site speed improvements, if your location is relatively close to your server and you activate Cloudflare (especially without APO) – then you probably won’t see an improvement if things are already optimized.
But the benefit of a CDN is that it can improve the speed globally and a lot of improvements definitely come with APO since it can improve the TTFB on the HTML file itself. Plus, it takes a load off the server itself, so if you get a traffic spike, it won’t really matter.
It wouldn’t be normal for Cloudflare to cause long-term connectivity issues; I’ve never heard of that before.
Question
Would it make sense to enable lazy load on WP Rocket in addition to using Cloudflare Pro’s image optimization option in the speed section?
Answer: Image lazy loading is not really needed anymore. It’s been built into browsers and WP for a few years now.