I’ve written more about what are cron jobs, how WordPress uses cron jobs, how to disable inbuilt cron jobs etc in the below blog post. If you haven’t read it, pls read it before going through this tutorial:

Also Read

• OOptimization

How to Setup External Cron Jobs in WordPress for Performance

• byGijo Varghese
• October 6, 2019

This tutorial is for setting up external Cron Jobs using Cloudflare Worker’s new Cron Triggers.

What is Cron Trigger and Service Worker in Cloudflare?

Service Worker – A custom script that can be deployed to their edge network (all PoPs). We can write whatever functionality in there. Code is executed in their edge servers.

Cron Trigger – In UNIX systems (like Linux), ‘crontab’ is a list of commands that you want to run on a regular schedule. Cron Trigger in Cloudflare allows us to execute a service worker on a schedule.

Pricing of Cron Trigger & Service Workers

There is no additional cost for Cron Trigger.

Every time a cron trigger happens, a service worker script is executed. Service Workers comes with a free tier of 10k requests per day.

Let’s say you run a cron job every 10 mins; it only counts 144 requests a day (60/10*24). So, it’s free!

How to Setup Cron Trigger for WordPress Cron Jobs

Goto your account Cloudflare Dashboard -> Workers

Click ‘Create a Worker’ and paste the below script:

addEventListener("scheduled", event => {
  event.waitUntil(handleScheduled(event))
})

async function handleScheduled(event) {
  await fetch("https://example.com/wp-cron.php?doing_wp_cron")
}

NOTE: Replace “example.com” with your domain name.

Click ‘Save and deploy’.

Now, go back and go to the ‘Triggers’ tab and click ‘Add Cron Trigger’.

By default, it will be ‘Every 30 minutes’. I’ve configured it to every 10 minutes.

Click ‘Save’, and you’re done!

Video Tutorial

Disable WordPress inbuilt Cron Job

Make sure to disable inbuilt Cron Job in your WordPress. Otherwise, there is no point of configuring external cron jobs!

Add the following line to wp-config.php file

define('DISABLE_WP_CRON', true);

And in GTmetrix “Add Expires headers”

Learn how to fix this browser caching errors using Cloudflare without any plugins.

What is Browser Caching?

Simple, you tell the browser to store some files in the local computer so that next request to the same URL won’t be fetched.

Browser caching works based on response header. For every HTTP request browser sends ‘request headers’ and server respond back with ‘response headers’ and the data.

Sever specify ‘cache-control’, a response header to tell the browser how long to cache the files (in seconds).

As you can see the cache files are loaded from disk or memory (RAM) instantly.

By implementing Browser caching, you can:

• Reduce server load
• Decrease page load time
• Reduce bandwidth costs

How to Leverage Browser Caching using Cloudflare?

There are plenty of tutorials on setting up browser caching using the .htaccess file or Nginx. But I prefer not to touch them :D. If you’re using Cloudflare you can add expire headers to each request in just two clicks and without any plugins.

Open your Cloudflare site dashboard and go to the ‘Caching’ tab:

Scroll down to see ‘Browser Cache Expiration’

By default, it will be set to 4 hours. Change it to something beyond 2 months and you’re done!

If you use any cache plugins and your URLs have a hash in them like wp-content/cache/min/1/4b3ef90d6.js, then you can safely set it to the maximum, 1 year. Otherwise, if you make some changes to the style.css or similar files, the changes will be visible only after the cache has expired.

Comment below if you’ve any queries or feedback. I read and reply to each of them within 8 hours!

Result?

If you’re new to Cloudflare, read my post – 10 Benefits of Integrating Cloudflare

How does it Work?

WordPress by default cache your static files like images, CSS, JavaScript etc. But it doesn’t cache HTML pages. Caching HTML pages is risky because the data change very often (I’ll cover how to handle the risks throughout this post).

However, with ‘rules’, you can explicitly tell Cloudflare to cache your HTML pages (aka WP posts, pages, etc).

Cloudflare has 155+ edge servers all around the globe. So once you cache it and when a user visits your WordPress site, the pages will be delivered from the nearest edge server of Cloudflare, not from your origin server.

Why you should Cache HTML pages?

Lower TTFB and TTLB

TTFB – Time to First Byte, TTLB – Time to Last Byte.

If it’s too technical – The first impression is the best impression!

Basically, its the time required to load the web page. Check the screenshots below:

In the first screenshot, Cloudflare is enabled but HTML cache is disabled. You can see the difference.

Here is the result of testing TTFB from 14 locations:

You can test it yourself by going to https://tools.keycdn.com/performance

Less load to Server

By serving everything from Cloudflare, there will be very less load to the server. So you don’t need powerful servers and pay a lot of money to the hosting companies. The only load to the server is when you log in to the admin panel and when there is a new/updated post missing from Cloudflare cache.

Here is how much Cloudflare saved me:

How to Cache WordPress Pages in Cloudflare?

Before we begin, make sure the ‘Browser Cache Expiration’ in the ‘Caching’ tab is set to ‘Respect Existing Headers’. Otherwise, HTML pages will be also cached in the browser. So when you update something it won’t be seen by the user even if they reload.

Ok, let’s do it!

Go to ‘Page Rules’ section of the Cloudflare and add the following rules:

Rule 1 – Bypass caching for every request to the admin panel (wp-admin).

Rule 2 – Bypass caching if it’s a preview of post/page.

Rule 3 – Cache everything (including HTML, css, js, images etc) in the edge servers for a TTL (time to live).

Bonus Tip: Use separate CDN for static files

Sounds like a terrible idea?

Every time you update some content or clear Cloudflare cache, you’re clearing the cache of static files (images, js, css, fonts etc) too. This will result in a much lower cache-hit ratio.

What I recommend is to use a separate CDN like BunnyCDN (which is super cheap) for static files. Because static files don’t change that often. In this way, HTML pages are delivered from Cloudflare and static files from other CDN.

Also Read

• CCDN

BunnyCDN Review, Comparison & Setup Guide for WordPress

• byGijo Varghese
• June 22, 2019

Things that will BREAK and How to Fix Them

As I mentioned before caching HTML pages are risky. Many dynamic features will not work as expected because it will be already cached by Cloudflare.

Here are a few common problems and how to fix them:

Admin Bar/ Tool Bar

WordPress shows an admin/toolbar to pages if the user is logged in. But Cloudflare will cache those pages and toolbar will be shown to unknown users too.

Solution 1: Hide the toolbar for all users by going to Users -> Your Profile.

Solution 2: Use the ‘Solution 2’ mentioned in ‘WordPress Default Comments’

WordPress Default Comments

Everyone can comment, but new comments will not be visible unless you clear the cache.

Solution 1: Use 3rd party commenting plugins like Disqus or Facebook Comments.

Solution 2: Upgrade to Cloudflare paid plan a set ‘Bypass Cache on Cookie‘ rule that will ignore cache, if someone has commented (or if the user is logged in).

Search Page

Just like WordPress comments, search page is also very dynamic. Caching is not a good idea here.

Solution 1: Add an additional rule that will bypass cache on URL like https://wpspeedmatters.com/?s=*.

Solution 2: Use an Ajax powered search. Some themes come with ajax search by default.

Solution 3: Disable search page. This is what I did. I haven’t seen anyone searching directly in my blog!

WooCommerce

Woocommerce cart page, order confirmation page etc will be messed up if you cache those pages. Use the Solution 2 in ‘WordPress Default Comments’.

Understanding Cloudflare Cache

Cloudflare cache works just like any other CDN, using an HTTP proxy. Once there is a new request it checks whether the requested URL is present in the edge server. If it’s not present, the user will get the response from the origin server. Further requests will be cached by Cloudflare based on the TTL.

Cache Status

Cloudflare returns a cf-cache-status in every HTTP request. Here are the common statuses:

• MISS – Response is missing in the edge server, delivered from the origin server. Next response will be probably a HIT.
• HIT – Response delivered from Cloudflare edge server.
• EXPIRED – TTL(Time to Live) is over. Next response will be probably a HIT.

Checking Cache Status

In order to test whether caching is working or not, go to https://cf-cache-status.net and enter your URL.

If it’s working correctly you’ll see something like this:

Clearing Cache after Updating Posts/Pages

After integration, all your HTML pages will be cached by Cloudflare. If you add/update a new post/page or any other modifications, Cloudflare will not be aware of it.

Using Cloudflare official plugin

Luckily Cloudflare comes with an official WordPress plugin that will clear the cache of the corresponding URLs if there is an update.

Manually

You can also clear cache manually without a plugin by going to the ‘Cache’ setting in Cloudflare.

Conclusion

I hope that covered everything to cache HTML pages in Cloudflare. I know it’s a little hard to set up these. But once you’ve done these, you’re going to get the best performance that no cache plugin or hosting company can provide.

Comment below if you’ve any queries or feedback. I read and reply to each of them within 8 hours!

What is Cloudflare?

Cloudflare currently handles around 10% of Internet requests

There is no single word to describe what is Cloudflare. They offer various services like domain registrar, DNS, CDN, security, performance, analytics, apps and a lot more!

All of the above, Cloudflare is free with most of the features you want.

Cheapest Domain Registrar NEW

At-cost pricing for registration and renewal. Cloudflare Registrar securely registers and manages your domain names with transparent, no-markup pricing that eliminates surprise renewal fees and hidden add-on charges

Cloudflare Registrar

Cloudflare recently launched ‘Domain Registrar’. Unlike other providers like GoDaddy or Namecheap, they don’t charge any extra commissions or surcharge on domain renewal.

I recently transferred 2 domains from GoDaddy and it saved me $30!

Handle High Traffic

Quite recently one of my blog posts got featured on Hacker News and this is was the real-time users I got.

By caching pages at Cloudflare edge servers, only a very few requests reached my server. All the load was handled by Cloudflare smoothly.

Also Read

• CCloudflare

Caching WordPress Pages using Cloudflare Page Rules

• byGijo Varghese
• April 19, 2019

Later I did a load test and found that Cloudflare can easily handle 10k users per second! Yes, that’s huge!!!

Also Read

• HHosting

How to Load Test a WordPress Website

• byGijo Varghese
• April 22, 2019

Faster DNS

DNS or Domain Name Server is responsible for converting your domain like “google.com” to an IP address “172.217.160.46” so that your browser could download the site.

The faster DNS servers are, more speed to your website!

Once you buy a domain, by default the domain registrar will handle the DNS. You can easily transfer it to Cloudflare.

Here is a performance comparison of Cloudflare with popular domain registrars and other DNS providers.

Source: DNSPerf

Free & Fast CDN

CDN or Content Delivery Network store your static files in multiple data centres (edge servers) all around the world. Result? Your assets will be loaded within milliseconds and less load to your server.

Cloudflare has edge servers in almost all countries. Here are their locations:

Based on the performance reports, Cloudflare CDN is faster than paid ones like KeyCDN, CDN77, BunnyCDN etc.

Also Read

• CCDN

Top 5 CDN Providers for WordPress (Free & Paid)

• byGijo Varghese
• May 12, 2019

Here is how much Cloudflare saved for one my WordPress site:

As you can see 81% of the requests never hit my server! High performance and lower server costs.

Free SSL

Effective July 2018, Google’s Chrome browser will mark non-HTTPS sites as ‘not secure’

Google

After Google announced this, everyone has been running to get SSL and make their website HTTPS. Thanks to Cloudflare, it’s just one click!

Built-in Optimizations

If you’re running I’m sure you’ve heard about JS/CSS minification using several plugins. Be aware that any resource-intensive tasks like this will eat your RAM and CPU. What if Cloudflare could do it for you?

Cloudflare comes with many optimizations like:

• Auto minify HTML/CSS/JavaScript
• Brotli compression
• Gzip
• Rocket Loader (for further optimizing JS)
• WebP and image optimization (paid plan only)

Security

Ever wondered what will you do if you’re under a DDoS attack? Or what happens if someone writes a bot that will try brute force to login to your WP admin? Unless you’re on a really good managed hosting, your still will be down!

Cloudflare is top-notch in security as well as DDoS prevention. It will automatically block threats. If you find something is going wrong, just press “Under Attack Mode”, Cloudflare will make sure the client is a valid user and allow access.

You can also write custom Firewall rules to block traffic. For example, block traffic from a specific country or IP/network, referrer website etc.

Page Rules

If you’ve been into server configs, you know the pain of configuring Apache/Nginx to redirect non-https to https, www to non-www, setup cache headers, etc. It’s much easier to configure these through Cloudflare UI so that you don’t have to touch anything in Server.

Here are some samples:

Also Read

• CCloudflare

Caching WordPress Pages using Cloudflare Page Rules

• byGijo Varghese
• April 19, 2019

Cloudflare Apps

Struggling to add new apps or 3rd party scripts to your website? If you’re a developer that would be ok. For others, touching source code might be a little tricky.

Cloudflare Apps is a collection of various 3rd party scripts/plugins that can be easily installed on your site without touching any source code.

Accurate Analytics

Yes, Google Analytics is great. But, it’s blocked in some countries and there are several privacy extensions that block reports to Google Analytics.

Without injecting any script Cloudflare can exactly tell you how many people have visited, their location and everything. This can’t be blocked by anything!

Conclusion

What we just saw is some of the best and useful tools given by Cloudflare free plan. There are much more. Signup and give it a try. I’m 100% sure you won’t be disappointed.

Comment below if you’ve any queries or feedback. I read and reply to each of them within 8 hours!