Best Cloudflare Cache CDN Settings for WordPress: Boost 3X Speed

Some people know Cloudflare as a free web hosting platform and for some, it is a free CDN network. However, in reality, Cloudflare serves as a bridge between your Web host and domain. It is not really like a traditional CDN network but more like a Cache CDN network. It creates multiple copies of your website’s cached web pages and hosts them from different locations around the globe, also known as Content Delivery Network.

So, what Cloudflare basically does is, it creates a whole cache of your entire website (including Images, CSS, Javascript Files) and serves them directly to your website visitors from the closest location. Currently, Cloudflare has 165 data centers around the world which are powering billions of web pages.

cloudflare cdn network

Why Would You Need Cloudflare CDN in the First Place?

Cloudflare serves cached file on Nginx Web Server which is much more faster than Apache web server (as I have mentioned on this article). So even if your WordPress site is using Apache web server, you still can use the advantages of Nginx web server (you can check your current web server from this link). It also automatically boosts your website speed by taking most of the server load from your main hosting to its own Cache CDN network. Cloudflare not only drastically improves your WordPress performance but also its security and uptime reliability. So today, I have shown the best way to use Cloudflare Cache CDN setting that will help you to increase your WordPress site’s speed and security.

cloudflare wordpress cache cdn settings

I will breakdown Cloudflare settings in four sections as

  • SSL (Encryption)
  • Speed (Compression)
  • Cache (CDN)
  • Custom Page Rules (for Aggressive Speed and Security)

I have been using Cloudflare for last three years and I know what’s up with the Cloudflare and how it can really protect your website from hackers and boost its performance. So follow these settings step by step.

Before we proceed further, I am assuming that you have successfully added your website on Cloudflare. If not, please read this easy to understand tutorial to add your website on Cloudflare.

1. Cloudflare SSL Setting

To make our website encrypted, you must enable the free SSL certificate issued by Cloudflare. You may use a custom SSL certificate provided by another issuer but honestly, it doesn’t make a much difference in a WordPress blog. You can choose Cloudflare Public SSL for your WordPress blog.

1 (a) Download SSL Plugin for WordPress

SSL insecure content fixer for cloudflare

Before performing the following settings, I want you to download the SSL Insecure Content Fixer plugin that will resolve all the HTTPS redirect loop problem that you may face later.

SSL insecure content fixer setting

Now, go to the plugin’s setting and enable the plugin by selecting “Fix insecure content” as  “Content” and “HTTPS detection” as “HTTP_CF_VISITOR” as you can see above in the screenshot. Finally, save the settings and you are ready to do changes in Cloudflare.

1 (b). Select Flexible SSL

For WordPress, SSL flexible setting is always good as it does not create any HTTPS redirect loop problem. Also, it provides SSL when it is requested

cloudflare ssl flexible setting

by the client.

1 (c). Always Use HTTPS

cloudflare always use https

This feature of Cloudflare is important to turn on because it redirects your all non-https pages to secure HTTPS.

1 (d). Enable HTTP Strict Transport Security (HSTS)

cloudflare hsts setting

Very enhance web security protocol for proper end-to-end encryption. Go to the installation process and finally attempt all settings as I’ve mentioned.

  • Status: On
  • Max-age: 1 month
  • Include subdomain: On
  • Preload: On

1 (e). Enable Authenticated Origin Pulls

cloudflare authenticated origin pull

1 (f). Enable More Crypto Settings

  • Enable Opportunistic Encryption
  • Enable Onion Routing
  • Enable Automatic HTTPS Rewrites (to transmit all files via secure HTTPS)

cloudflare ssl security enabledFinally, within 24 hours you will be able to see a green locked secure icon in your browser which is right next to your website name. It simply means that your website is fully encrypted with Cloudflare SSL. Also, do check if your all content is serving via HTTPS and no mixed non-https content is there. If everything is fine, Chrome browser will show that “All resources on this page are served securely.” To confirm this, Press F12 on your WordPress page and check it on Security tab.

https mixed content

Let us move further and find out how we can increase our WordPress blog speed.

2. Cloudflare Speed Setting

Speed is another advanced feature of Cloudflare. To make this effective, you need to follow these settings. I am telling you, you will see a great improvement of your web speed after you implement these settings.

2 (a). Enable Auto Minify

Tick all minification of JavaScript, CSS, and HTML to turn on overall minification.

cloudflare minify setting

Well, Minification is important for any website. Even, Google recommends minification of a webpage. What minification does is that it decrease overall webpage weight by reducing the size of your CSS, JS and overall HTML file. Basically, minify process includes removing spaces and unnecessary codes from a page file. As a result, the webpage loads faster for your visitors.

2 (b). Enable Brotli Compression

cloudflare brotli compression

Brotli is a compressed data format that compresses your webpage files 14% to 21% as compared to conventional Gzip compression. Developed by Google back in 2013, Brotli is an advanced compression technique used by today’s modern websites.

2 (c). Enable Rocket Loader

cloudflare rocket loader setting

Rocker Loader is a technology by Cloudflare which optimized paint time so that the above the folder section of your webpage loads faster. If your webpage has a lot of Javascript files, this feature is really important for your WordPress blog.

You may leave all the other settings as it is in the Speed tab.

3. Cloudflare Cache Setting

Cache are a great way to improve your website speed. I have already explained how proper W3 Total Cache settings can improve WordPress reliability drastically. Cloudflare is no exception.

However, the Cloudflare serve your Cache files via its CDN network around the globe to reduce latency. As you know by far that Cloudflare has 165 datacenters worldwide which serve cache files of different websites from the closest location to the internet users. This makes your WordPress site’s response time fast.

cloudflare cache settings

3 (a). Define Caching Level

Make your Cache Level as the “standard” for almost all WordPress or Woocommerce blog.

3 (b). Define Browser Cache Expiration

Browser Cache Expiration defines how long a web browser should keep the files in its cache database. As per my experience, you should keep it to the maximum for static as well as for some dynamic WordPress sites.

3 (c). Enable Always Online Mode

I absolutely love this mode. It helps you to keep your website up even if your web host is down for some reason. Cloudflare will keep serving your website’s static pages from its cache CDN.

4. Cloudflare Page Rules Settings

Page rules define how a set of pages should respond when it is requested by an internet user. Custom page rule is one of the great tools of Cloudflare to enhance web security and performance as per custom page rule. So here is how you can set a page rule of your website to the optimal level.

Note: Please replace yourdomain.com with your own domain name. Cloudflare gives only three-page rules for a free account and we have to make use of all of them.

4 (a). First Page Rule to Avoid Security Attack on WordPress

cloudflare page rule security setting

We can improve security by adding above setting in page rule. This page rule is important to avoid invalid login attempt on WordPress. Here is the setting you need to apply on below link.

*.yourdomain.com/wp-login.php*
  1. Security Level: I’m Under Attack

4 (b). Second Page Rule to Cache Images, CSS and JS

cloudflare page rule cache setting

Here in this second-page rule, We are building aggressive cache so that our static files serve faster. You need to apply these settings on the below link.

*.yourdomain.com/wp-content/uploads*
  1. Browser Cache TTL: a year
  2. Always Online: On
  3. Cache Level: Cache Everything
  4. Edge Cache TTL: a month

4 (c). Third Page Rule for Reliability and Speed

cloudflare page rule speed setting

This one is also important as it defines how your overall WordPress blog should perform. You need to apply these settings on the below link.

*.yourdomain.com/*

Here are some of the main settings.

  1. Auto Minify: Select all
  2. Rocket Loader: On
  3. Cache Deception Armor: On
  4. Origin Cache Control: On
  5. Security Level: Medium

So overall, you have three-page rules and you should sort them as per priority order as I have shown below.

cloudflare page rules

So, guys, that is it. Now all you need to do is to wait for 24 hours and thereafter change your WordPress site address from “HTTP” to”HTTPS”. Just log in to your Worpdress and go to SettingsGeneral – Apply these settings. Change your website name accordingly.

https://yourdomain.com or https://www.yourdomain.com

Wordpress change of address to https

These Cloudflare settings are very helpful for WordPress and you can use these setting with W3 Total Cache to make your webpages load faster than your competitors.

 

Leave a Reply