The Ideal WP Rocket Settings 2022 + Tips For Core Web Vitals, Cloudflare, CDNs, Fonts, Cumulative Layout Shift — Version 3.10

Ready to setup the latest, best WP Rocket settings?

WP Rocket was rated the #1 cache plugin in numerous Facebook polls because it comes with more speed features than most other cache plugins. That’s why it usually gives you better results in Lighthouse and GTmetrix. It also means you don’t need to install a bunch of extra speed plugins to preload fonts, clean your database, disable Heartbeat, and delay JavaScript.

This guide goes beyond configuring the WP Rocket settings. I explain how disabling “optimize CSS delivery” can fix cumulative layout shift issues, how to prefetch third-party code, delay JavaScript, preload fonts, and why I recommend Cloudflare or BunnyCDN over RocketCDN.

Update: I switched from WP Rocket to FlyingPress (by Gijo from WP Speed Matters) and noticed a big improvement when clicking through posts, likely because it uses more aggressive caching. I’m using Cloudways Vultr HF for hosting (you can check my GTmetrix report or CWV).

  1. Dashboard
  2. Cache
  3. File Optimization
  4. Media
  5. Preload
  6. Advanced Rules
  7. Database
  8. CDN
  9. Heartbeat
  10. Add-Ons
  11. Cloudflare
  12. Image Optimization

If you haven’t bought WP Rocket, I’d appreciate you using my affiliate link. Many people have copied this content (Jake Pfohl, and there’s even YouTube videos with voice overs of me). Please support the original author. It took a lot of time. Thanks :)

WP Rocket Coupon
Get 10% off WP Rocket by signing up for their email list on their coupons page

 

1. Dashboard

Leave both options off unless you want to be a beta tester or let WP Rocket collect your data anonymously which results in a (very small) performance decrease. I recommend BunnyCDN or Cloudflare over RocketCDN/StackPath (covered in the CDN section). You can clear the cache or regenerate critical CSS if you make design/plugin changes but they don’t appear on your site.

WP Rocket Dashboard

 

2. Cache

These are good cache settings as long as you don’t use a plugin for your mobile website and don’t allow multiple users to login to your site (i.e. bbPress). I increased cache lifespan from 10 to 24 so the cache doesn’t have to refresh as often which saves a little bit on server resources.

WP-Rocket-Cache-Settings

Mobile Cache – enables caching for mobile devices. Only enable “separate cache files for mobile devices” if you use a plugin for your mobile website (like the free version of WP Touch).

User Cache – leave disabled unless you have multiple users logging into your website (bbPress for example) where there is user-specific content. It gives each user their own cached version.

Cache Lifespan – a lower number means the cache will refresh more frequently, but it consumes more resources. A cache lifespan with a higher number means it won’t refresh as frequently, but saves resources. Do you care more about your cache building frequently or saving server resources? Since I only publish a couple posts a week, I increased it to 24 hours.

 

3. File Optimization

In the WP Rocket file optimization settings, minify CSS/JS should be enabled, but combine CSS/JS should only be enabled for websites with small CSS/JS file sizes. Optimize CSS delivery can cause layout shifts (you will need to test this) and everything else should be enabled including remove unused CSS, load JavaScript deferred, and delay JavaScript execution. You should ideally test each setting individually while measuring results in Lighthouse or GTmetrix.

WP Rocket File Optimization Settings

Minify CSS/JS Files – enables minification which removes whitespace from the code. If you’re using a CDN that supports minification, it’s faster to minify with it and disable it in WP Rocket.

Combine CSS/JS Files – according to WP Johnny, websites with a smaller CSS/JS (under 10KB) should combine while sites with larger CSS/JS sizes should not. Check your GTmetrix Waterfall chart. If your CSS/JS is under 10KB, you should usually combine. If it’s over 10KB, you shouldn’t. Combining CSS + JavaScript files can also cause issues when using HTTP/2 and HTTP/3 servers.

CSS Size

Exclude CSS/JS Files – if a minification breaks your website layout, view your source code, locate the problematic file, and add it. See WP Rocket’s post on resolving minification issues.

Optimize CSS Delivery – your page will start loading without CSS styles. Sometimes, this doesn’t work properly and can cause layout shifts (a worse CLS score in web vitals) and FOUC. To prevent this, try setting a fallback critical CSS using a critical CSS generator, then make sure Optimize CSS Delivery is working. If this is still causing layout shift, I would disable completely.

  • Search “rocket-critical-css” in your source code to make sure it’s working.
  • If it doesn’t appear, regenerate critical CSS in WP Rocket and page builders (if applicable).
  • Run your site through a critical CSS generator.
  • Paste CSS code in the “fallback critical CSS” field (image below).
  • Disable optimize CSS delivery on individual pages/posts if needed.
  • Exclude problematic files from CSS delivery using WP Rocket’s helper plugin.

WP Rocket fallback critical CSS

 
Remove Unused CSS – this isn’t a magical feature. Heavy CSS and JavaScript is usually caused by page builders (specifically Elementor and Divi) and plugins. While this can help you solve reduce unused CSS in Lighthouse, you should really optimize it at the source. One thing you can do is code your header, menu, footer, and sidebar in CSS so they don’t rely on page builder code. You should also be using a plugin like Asset CleanUp or Perfmatters to remove unused CSS + JS.

Remove unsued CSS WP Rocket

Load JavaScript Deferred – loads JavaScript after the page has finished parsing. It’s one of the best ways to eliminate render-blocking resources (in PSI), but I found WP Rocket doesn’t always do a great job. If you still see render-blocking issues, try installing Autoptimize and Async JavaScript on top of WP Rocket which do a better job optimizing CSS and JavaScript. If you optimize CSS and JS in Autoptimize, it will turn off minify/combine CSS + JS in WP Rocket and lets Autoptimize handle it. This is how I went from 7 render-blocking resources to only 1.

Eliminate Render-Blocking Resources WordPress - Passed Audit

Async JavaScript Apply Defer
I recommend trying Async JavaScript with WP Rocket (install and click “apply defer”)

Using Autoptimize With WP Rocket – I also recommend testing Autoptimize on top of WP Rocket which gives you better control of how CSS/JS files are optimized. Below are the settings I use. If you use it, some WP Rocket settings will be grayed out since Autoptimize will handle it.

Autoptimize Eliminate Render-Blocking

Delay JavaScript Execution – delays loading JavaScript until user interaction (i.e. scrolling or touching the screen on mobile). This feature alone reduced my blog’s load time by about 3s by delaying wpDiscuz comments and Gravatars. Here is the list of scripts automatically excluded by WP Rocket, but you may be able to delay other files (i.e. third-party code in your Lighthouse report). If you do this with ads or tracking scripts, make sure revenue/analytics aren’t affected. Note that WP Rocket removed Facebook Pixel from the “add-ons” tab and added here instead. If you want to add additional JavaScript files to delay, you would need to use a separate plugin like Flying Scripts or Perfmatters since WP Rocket no longer lets you add JavaScript manually.


addtoany
cookie-law-info
apps.elfsight.com/p/platform.js
xfbml.customerchat.js
fbevents.js 
fbq(
/busting/facebook-tracking/
/sdk.js#xfbml
feedbackcompany.com/includes/widgets/feedback-company-widget.min.js
ft.sdk.min.js
getbutton.io
adsbygoogle.js
google-analytics.com/analytics.js
ga( ' 
ga('
/gtag/js 
gtag(
/gtm.js
/gtm-
translate.google.com/translate_a/element.js
static.hotjar.com/c/hotjar-
static.leadpages.net/leadbars/current/embed.js
snap.licdn.com/li.lms-analytics/insight.min.js
livechatinc.com/tracking.js
LiveChatWidget
widget.manychat.com
olark
//a.omappapi.com/app/js/api.min.js
pinit.js
pixel-caffeine/build/frontend.js
shareaholic
ShopifyBuy
sharethis
simple-share-buttons-adder
smartsuppchat.com/loader.js
Tawk_API
widget.trustpilot.com/bootstrap
static.ads-twitter.com/uwt.js
twq(
platform.twitter.com/widgets.js
wpdiscuz

 

4. Media

Enable everything except for WebP caching. If you’re using a WebP plugin, it will generally serve WebP images already. If you embed YouTube videos, replacing YouTube iframes with a preview image can often cut your video’s load times in half since they’re a very large element.

WP Rocket Media Settings 2021

Lazy Load – delays loading of images, iframes, and videos until you scroll down the page and they become visible. This significantly reduces initial load times and HTTP requests, but constantly loading images as you scroll can be annoying (test it out for yourself). Always lazy load videos and replace iframes with a preview image since embedded videos are very heavy.

Pro tip on lazy loading videos in Elementor – Adam from WP Crafter made a YouTube video on using Elementor to load videos faster. When I tested it, the results were great. Not only was I able to embed videos with 0 GTmetrix errors, but I could also customize colors, play buttons, and overall branding of videos. Unfortunately my blog doesn’t use Elementor (only my pages), but I recommend following his video if yours does – especially if you see GTmetrix errors when enabling WP Rocket’s lazy loading.

Add Missing Image Dimensions – WP Rocket will add missing width + height attributes to HTML images which should fix use explicit width and height on image elements in Lighthouse.

Disable WordPress Embeds – similar to Cloudflare’s hotlink prevention, it prevents other sites from embedding your content on their site which sucks up bandwidth and stresses your server.

WebP Caching – leave disabled. WP Rocket does not create WebP images (it can only serve them) in which case your WebP plugin would already do this. Using WebP images will fix the serve images in next-gen format item in Lighthouse. They can be created using plugins like ShortPixel or WebP Converter For Media. You can convert JPEG/PNGs to WebP manually using tools such as CloudConvert, but you may run into issues on Safari. Using a plugin is safer.

 

5. Preload

Activate preloading, then preload links which loads a page in the background when users hover over a link. Prefetch DNS requests and preloading fonts are types of browser resource hints. Prefetching is done with items found in your reduce impact of third-party code Lighthouse report. Preloading can be done with fonts which you can find in your GTmetrix Waterfall chart.

WP-Rocket-Preload-Settings

Preloading – tells browsers to start fetching resources that will be needed soon.

Preload Links – according to WP Rocket’s documentation, this feature makes it so if a user hovers over, or touches, a link for 100ms or more, the HTML of that page will be fetched in the background, so that when they actually click the link, the page appears to load nearly instantly.

Prefetch DNS Requests – view your third-party code report in Lighthouse or in Chrome Dev Tools → Sources → Coverage. These can be Google Fonts, Tag Manager, AdSense, Analytics, YouTube, Maps, or even Facebook/Twitter from social sharing buttons or embedded widgets.

Third-Party-Code-Chrome-Dev-Tools

Grab all those URLs from your report and paste them into the Prefetch DNS Requests section of WP Rocket. This will help browsers anticipate those external requests and load them faster.

//maps.googleapis.com
//maps.gstatic.com
//fonts.googleapis.com
//fonts.gstatic.com
//use.fontawesome.com
//ajax.googleapis.com
//apis.google.com
//google-analytics.com
//www.google-analytics.com
//ssl.google-analytics.com
//www.googletagmanager.com
//www.googletagservices.com
//googleads.g.doubleclick.net
//adservice.google.com
//pagead2.googlesyndication.com
//tpc.googlesyndication.com
//youtube.com
//i.ytimg.com
//player.vimeo.com
//api.pinterest.com
//assets.pinterest.com
//connect.facebook.net
//platform.twitter.com
//syndication.twitter.com
//platform.instagram.com
//referrer.disqus.com
//c.disquscdn.com
//cdnjs.cloudflare.com
//cdn.ampproject.org
//pixel.wp.com
//disqus.com
//s.gravatar.com
//0.gravatar.com
//2.gravatar.com
//1.gravatar.com
//sitename.disqus.com
//s7.addthis.com
//platform.linkedin.com
//w.sharethis.com
//s0.wp.com
//s1.wp.com
//s2.wp.com
//stats.wp.com
//ajax.microsoft.com
//ajax.aspnetcdn.com
//s3.amazonaws.com
//code.jquery.com
//stackpath.bootstrapcdn.com
//github.githubassets.com
//ad.doubleclick.net
//stats.g.doubleclick.net
//cm.g.doubleclick.net
//stats.buysellads.com
//s3.buysellads.com

Preload Fonts – copy your font files from GTmetrix Waterfall (they have a tab for font files) and paste them in WP Rocket’s preload fonts field. Retest your website and they should load faster.

Google-Fonts-Waterfall

Preload your largest contentful paint image – WP Rocket doesn’t let you preload other files (you may see a recommendation in PSI to preload your first contentful paint image). To do this, you can add the following code to your header or use Pre* Party Resource Hints or Perfmatters.

<link rel='preload' href='https://onlinemediamasters.b-cdn.net/wp-content/
uploads/2020/03/about-banner.png' as='image'>

What about preconnect? – WP Rocket automatically preconnects your CDN URL (in the CNAME field of your CDN settings) and fonts.gstatic.com if you’re using a CDN URL and Google Fonts. WP Rocket does not let you add other domains to preconnect (these should be used sparingly anyway), but if you want use preconnect to establish early connections to other third-party sites, use Pre* Party Resource Hints, Perfmatters, or add this code to your header.

<link rel="preconnect," href="https://cdn.domain.com">
<link rel="preconnect," href="https://fonts.gstatic.com">

 

6. Advanced Rules

Advanced Rules are mainly for eCommerce sites, however WP Rocket is already compatible with most solutions like WooCommerce and BigCommerce. But if you’re having issues with cart widgets, caching, or something related to eCommerce, WP Rocket has documentation for that.

Otherwise, leave this blank.

WP-Rocket-Advanced-Rules

Never Cache URLs – if you’re using an eCommerce shopping cart that is not supported by WP Rocket, add your cart and checkout pages here which will exclude these pages from the cache.

Never Cache Cookies – same principle as previous option only based on cookies.

Never Cache User Agents – prevent Googlebot or other user agents from caching pages.

Always Purge URLs – let’s say you have a blogroll on your homepage. If you create a new post, you want that homepage blogroll updated immediately by emptying the homepage cache. That’s what this setting does, however WP Rocket automatically clears the cache for your homepage, categories and tags once new content is created… so there is usually no need for this. But if there are other page’s cache you want cleared when new content is posted, add it.

Cache Query Strings – mainly used to cache search result pages + price filters on eCommerce.

 

7. Database

Scheduling database cleanups keeps your site and admin fast, just know what you’re deleting!

WP Rocket Database Settings

  • Revisions – old versions of your posts saved when you hit “Publish.”
  • Auto Drafts – automatically saved versions of your post if you don’t hit “Publish.”
  • Trashed Posts – posts and drafts you deleted.
  • Spam Comments – comments marked as spam.
  • Trashed Comments – comments marked as trash.
  • Expired Transients – transients that have expired and are still in your database.
  • All Transients – stores data that takes a long time to retrieve (i.e. social counts on blogs).
  • Optimize Tables – optimizes database tables to run more efficiently.
  • Automatic Cleanup – how often you want WP Rocket to clean your database.

Delete Unused Plugin Tables (Not With WP Rocket) – one thing WP Rocket doesn’t do is let you go through your individual database tables and delete tables left behind by old plugins that aren’t installed anymore. I recommend installing WP-Optimize and going through your tables every so often, especially if you deleted plugins (plus it shows you the actual size of the tables). The tables that say “not installed” are the ones that were left behind by old, uninstalled plugins.

WP-Optimize-Tables

 

8. CDN

CDNs are great if you have visitors far away from your origin server. They mirror your site on multiple data centers which reduces the geographic distance between your server and visitors.

Which CDN Is Best?

  • BunnyCDN – higher performance CDN highly recommended in multiple Facebook Groups (see this thread, this thread, and this thread). Instructions require creating a pull zone then copy/paste your CDN URL into WP Rocket. Or just use the BunnyCDN plugin.
  • Cloudflare – free, but not a true CDN since Cloudflare doesn’t serve assets from a CDN URL. Great for small sites, however there are higher performant CDNs out there. As of writing this, their APO doesn’t work with WP Rocket. Be sure to add a cache everything page rule, enable WAF, hotlink protection, and set the browser cache expiration to 1 year.
  • RocketCDN – paid CDN, easiest to setup through WP Rocket, uses StackPath’s data centers, but RocketCDN doesn’t always perform well and can actually increase TTFBs.
  • Check Their Data Centers – CDNs have data centers all over the world. If one has data centers heavily concentrated in the area you want, that is something worth considering.

The CDN tab is for RocketCDN, BunnyCDN, and CDNs that use a CDN URL. It’s not for Cloudflare which requires changing nameservers then using the Cloudflare tab.

Step 1: Sign up for a CDN (BunnyCDN is fast/cheap/reliable shown on cdnperf.com).

CDN Feedback

Step 2: Create a pull zone and choose the locations you want.

BunnyCDN Add Pull Zone

Step 3: Copy your CDN URL.

BunnyCDN Hostname

Step 4: Paste the CDN URL in WP Rocket’s CDN CNAME(s) field.

WP Rocket CDN Settings 2021

Step 5: BunnyCDN’s support recommended to also install and setup their BunnyCDN plugin, then adding your BunnyCDN pull zone name. This can serve even more assets from your CDN.

BunnyCDN Plugin

Testing CDNs – since Cloudflare is set up differently and requires changing nameservers, the “content delivery network” in GTmetrix will still be red (but it will be green for other CDNs).  That doesn’t mean Cloudflare isn’t working; use the Claire Chrome Extension to make sure it is.

Exclude Files From CDN – lets you serve files locally instead of the CDN. Usually, these files come from plugins designed to disregard cross domain load. In most cases, there is no need.

Example:

  • {uploads_dir}/wpcf7_captcha/*
  • {uploads_dir}/imagerotator.swf
  • {plugins_dir}/wp-fb-autoconnect/facebook-platform/channel.html

 

9. Heartbeat

The WordPress Heartbeat API tells you when other users are editing a page/post and shows you real-time plugin notifications. You usually want to disable this completely, or at least limit it’s frequency to prevent it from consuming server resources and contributing to CPU overages.

WP-Rocket-Heartbeat 2021

 

10. Add-Ons

Google Tracking and Facebook Pixel are now integrated into “delay JavaScript execution.” Otherwise, if you use Varnish (not recommended), Cloudflare, or Suruci, activate it’s add-on.

WP Rocket Add-ons Settings

Varnish – leave disabled unless you use Varnish. I don’t use it even though it’s available with my hosting (Cloudways). Many people say you’ll get faster speeds without Varnish which I also find true. If you decide to use Varnish, activate it in your hosting account and enable it in WP Rocket.

Cloudflare – enable if using Cloudflare.

Synchronize Sucuri Cache – enable if using Sucuri. This automatically clears Sucuri’s cache whenever you clear WP Rocket’s cache which helps keep your content synchronized. For the Sucuri Firewall API Key (For Plugin), login to Sucuri here, select your website, go to the API tab, then copy your API Key (For Plugin) and paste in WP Rocket when you expand the Sucuri field.

 

11. Cloudflare

This section is only if you’re using Cloudflare instead of another CDN.

Cloudflare-Bandwidth-Savings

Sign up for Cloudflare and you will come to a page where they assign you 2 nameservers.

Cloudflare-GoDaddy-Nameservers

Change nameservers in your domain registrar to the one’s Cloudflare gave you.

SiteGround-DNS-Records

In Cloudflare’s DNS settings, change your website from DNS Only to Proxied to use the CDN.

Activate Cloudflare CDN

Add your Cloudflare information to WP Rocket.

WP-Rocket-Cloudflare-2021

Global API Key and Zone ID are found in your Cloudflare dashboard.

Cloudflare Global API Key

  • Global API Key – found in your Cloudflare dashboard.
  • Account Email – same email you used to sign up for Cloudflare.
  • Zone ID – found in your Cloudflare dashboard.
  • Domain – your website’s domain name.
  • Development Mode – use when making a lot of code changes to your site.
  • Optimal Settings – activates WP Rocket’s recommended Cloudflare settings: minify, aggressive caching, and deactivates Rocket Loader for better compatibility. It also turns on email decoding which may hurt your Lighthouse report since it loads an extra request. If you know what you’re doing, turn this off and configure the Cloudflare settings yourself.
  • Relative Protocol – sometimes if people download files from your site, there are no contents in them. Leaving relative protocol OFF will prevent this from happening.
  • Clear All Cloudflare Cache Files – do this after you’re done configuring WP Rocket.

Configure Cloudflare Settings In The Dashboard – a lot of people have been asking about Cloudflare’s dashboard and how to configure it. Here are the things I recommend you do.

  • Enable Brotli (speed settings)
  • Enable early hints (speed settings)
  • Enable and test Railgun (speed settings)
  • Test Rocket Loader (speed settings) but it can break sites
  • Enable hotlink protection (scrape shield settings)
  • Setup page rules for WordPress (below are 3 I recommend)

Page Rule 1: Cache Everything And Force HTTPS – cache your website aggressively.

https://*yourwebsite.com/*

Always-Use-HTTPS-Page-Rule

Page Rule 2: Secure The WordPress Admin And Bypass Cache – sets security level of the admin to high and bypasses Cloudflare’s cache in the admin, since you don’t want CDNs (or apps + performance features like Rocket Loader) running inside the admin.

yourwebsite.com/wp-admin*

WordPress-Admin-Page-Rule

Page Rule 3: Decrease Bandwidth Of WP Uploads – since the content in your WP Uploads folder does not change frequently, increasing Edge Cache TTL to a month can save on bandwidth, since the WP Uploads folder cache won’t be refreshed as often.

yourwebsite.com/wp-content/uploads*

WP-Uploads-Page-Rule

 

12. Image Optimization

WP Rocket recommends Imagify because it’s their plugin.

But even when you select lossless compression, it’s definitely not lossless and neither is ShortPixel. I used both for many months and switched to TinyPNG which I’m very happy with. The only thing about TinyPNG is it doesn’t support WebP in which case you will need a plugin like WebP Converter For Media. But I find the quality is better than Imagify or ShortPixel. Test them yourself and remember, Lighthouse uses an 85% compression level to test your images.

WP-Rocket-Image-Optimization

 

13. Tools

Import or export your WP Rocket settings, or rollback to the previous version.

WP-Rocket-Tools-2020

Export Settings – export your settings to use on multiple sites.

Import Settings – import your pre-configured WP Rocket settings.

Rollback – if you updated WP Rocket and it caused issues, fall back to the previous version.

Enable Google Font Optimization – combines fonts into 1 single file, ensures text remains visible while loading fonts, and preconnects fonts (tells browsers you intend to load Google Fonts). Remember to prefetch and preload fonts in the Preload tab and be minimal with the number of fonts, weights, and font icons. All these have an impact on your font’s load times.

 

Tip For “Serving Static Assets With An Efficient Cache Policy”

If you’re using WP Rocket and see “serve static assets with an efficient cache policy” in PageSpeed Insights, this means you need to set your browser cache expiration to 180 days.

If you view the code WP Rocket adds to your .htaccess, the cache expiration for images and fonts is only 4 months (about 2 months short of Google’s 180 day requirement). If you see this recommendation in PSI, you simply need to change the expiration to 180 days (about 6 months).

# Expires headers (for better cache control)

ExpiresActive on
    ExpiresDefault                              "access plus 1 month"
    # cache.appcache needs re-requests in FF 3.6 (~Introducing HTML5)
    ExpiresByType text/cache-manifest           "access plus 0 seconds"
    # Your document html
    ExpiresByType text/html                     "access plus 0 seconds"
    # Data
    ExpiresByType text/xml                      "access plus 0 seconds"
    ExpiresByType application/xml               "access plus 0 seconds"
    ExpiresByType application/json              "access plus 0 seconds"
    # Feed
    ExpiresByType application/rss+xml           "access plus 1 hour"
    ExpiresByType application/atom+xml          "access plus 1 hour"
    # Favicon (cannot be renamed)
    ExpiresByType image/x-icon                  "access plus 1 week"
    # Media: images, video, audio
    ExpiresByType image/gif                     "access plus 4 months"
    ExpiresByType image/png                     "access plus 4 months"
    ExpiresByType image/jpeg                    "access plus 4 months"
    ExpiresByType image/webp                    "access plus 4 months"
    ExpiresByType video/ogg                     "access plus 4 months"
    ExpiresByType audio/ogg                     "access plus 4 months"
    ExpiresByType video/mp4                     "access plus 4 months"
    ExpiresByType video/webm                    "access plus 4 months"
    # HTC files  (css3pie)
    ExpiresByType text/x-component              "access plus 1 month"
    # Webfonts
    ExpiresByType font/ttf    "access plus 4 months"
    ExpiresByType font/otf    "access plus 4 months"
    ExpiresByType font/woff   "access plus 4 months"
    ExpiresByType font/woff2  "access plus 4 months"
    ExpiresByType image/svg+xml                 "access plus 1 month"
    ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
    # CSS and JavaScript
    ExpiresByType text/css                      "access plus 1 year"
    ExpiresByType application/javascript        "access plus 1 year"

Edit your .htaccess (you can use Htaccess File Editor if you don’t know how). Change the expiration from 4 months to 180 days. You may only want to do this for file types being flagged.

WP Rocket Cache Policy

Remember, you can only set a browser cache expiration for resources hosted on your site (images, fonts, etc). You cannot control the browser cache expiration for third-party code.

 

Is WP Rocket The #1 Cache Plugin Anymore?

WP Rocket used to be the #1 cache plugin in most Facebook polls, but I’ll argue LiteSpeed Cache (used on LiteSpeed servers) and Gijo Varghese’s FlyingPress plugin (can use with any hosting) are faster. LiteSpeed Cache uses faster server-side caching among other features like Redis, image optimization, Guest Mode, and better APO compatibility. FlyingPress uses more aggressive caching than WP Rocket with better APO compatibility (what I’m currently using).

WP Rocket comes with many features most cache plugins don’t (see below). That means if you were to use other cache plugins, you would need to install about 5-10 extra plugins to get these features when WP Rocket already has them built-in (more features, yet less plugins on your site). That’s also why WP Rocket yields better results in Lighthouse/GTmetrix and is what I use.

WP Rocket includes:

 

Hosting Recommendations For A Faster TTFB

WP Rocket doesn’t fix slow TTFBs and most hosting recommendations are garbage.

Join the WP Speed Matters Facebook Group (by Gijo Varghese) to get unbiased feedback (especially since SiteGround’s community manager/affiliates are admins for several groups). I would stay clear of SiteGround’s slow TTFB and CPU limits, EIG/Bluehost, GoDaddy, and other hosts who use slower servers, SSD storage, and throttle bandwidth which can cause 503 errors.

SiteGround-Slow-TTFB

SiteGround Slow TTFB Gijo

Bluehost HostGator GoDaddy Feedback

I use Cloudways Vultr HF which is a popular choice in Facebook Groups. You can check my GTmetrix report, TTFB, core web vitals, or click through my site if you want to test it yourself. Moving from SiteGround to Cloudways cut load times in half and instantly fixed my CPU issues.

Vultr HF is cloud hosting with fast CPU clock speeds + NVMe storage compared to shared hosting + slower SSDs. Cloudways supports Redis which uses memory more efficiently than memcached. It’s monthly pricing with no high renewals and 22 Vultr data centers. Main cons are no file manager or email hosting, and their Breeze plugin + CloudwaysCDN aren’t great. I suggest WP Rocket or FlyingPress, Cloudflare or BunnyCDN, and Google Workspace. They do 3-day trials, a free migration, and a promo code for 30% off 3 months. Some people say they’re techie since you have to launch a Vultr server and connect your domain name, but it’s not hard:

Cloudways Launch Server

SiteGround Slow TTFB

SiteGround Cloudways CPU Usage

SiteGround vs Cloudways Pricing

 
Spend 5 minutes looking at recent Facebook polls on “the best hosting,” migration results of people who switched, and unbiased feedback in Facebook groups (click thumbnails to enlarge).

Favorite-Cloudways-Server

Moving away from SiteGround

Cloudways Vultr High Frequency starts at $13/mo and is cloud hosting with NVMe. I recommend a 2GB+ server for WooCommerce. You can buy Vultr HF directly from their website for cheaper, but you’ll need a control panel like RunCloud or CyberPanel.

LiteSpeed servers are also a solid choice.

They’re a newer/faster server and more efficient than Apache + Nginx (what SiteGround, Bluehost, and most hosts use). This also means you can use the LiteSpeed Cache plugin which is faster than WP Rocket with server-side caching, QUIC, and HTTP/3. Since this setup is free on LiteSpeed, you would be able to cancel your WP Rocket subscription and replace it with the LSC plugin. You can use WP Johnny’s LSC guide (who also use LiteSpeed) or my own LSC guide. The only catch is that to use LiteSpeed’s exclusive features, you need to be on a LiteSpeed host.

Apache vs LiteSpeed NameHero Test

Web server poll

Web server poll Oxygen

I recommend NameHero (not Hostinger or A2) for LiteSpeed.

If you look at NameHero’s specs page and compare it with Hostinger’s or A2’s, you get more CPU cores/RAM for cheaper on NameHero. They use NVMe on higher plans (unlike Hostinger) and LiteSpeed on all plans (unlike A2). Hostinger and A2 also have terrible uptimes and support compared to NameHero’s uptime status page and TrustPilot reviews. I generally recommend the Turbo Cloud plan with 3 CPU cores, 3GB RAM, NVMe, and LiteSpeed for $8/mo. The main con is their data centers are only in the US/Netherlands. NameHero does a free migration, has a 30-day refund period, and Ryan is a genuinely awesome dude if you watch his YouTube channel.

NameHero Plans Resources
NameHero specs: 1-4 CPU cores, 1-4 GB RAM, LiteSpeed (all plans), NVMe (higher plans)

SiteGround vs Cloudways vs NameHero

NameHero vs SiteGround Feedback

SiteGround to NameHero

NameHero Facebook Feedback

Sata vs Sata SSD vs NVMe
SATA SSD vs. NVMe SSD performance (source: PCWorld)

Cloudways TrustPilot Review

NameHero TrustPilot Review

Affiliate Disclaimer: I use aff links to Cloudways + NameHero and appreciate your support.

 

FAQs / Documentation

I spent many hours digging through their documentation to make sure this tutorial uses the best WP Rocket settings, but they are still extremely helpful if you haven’t checked them out.

wp rocket documentation

There are also video tutorials in the Tutorials tab to help configure your WP Rocket settings.

wp rocket video tutorials

Tutorials I found the most helpful:

How do I setup WP Rocket settings?

Head to WP Rocket's file optimization settings and minify CSS/JS, don't always combine, disable optimize CSS delivery (or set a fallback) if it's causing CLS issues, defer JavaScript, and delay third-party code. In the media settings, exclude above the fold images from lazy load and add missing image dimensions. In the preload settings, prefetch third-party domains and preload key requests like fonts. Clean your database, setup a CDN, and disable heartbeat.

How do I use a CDN with WP Rocket?

Choose a CDN like RocketCDN (StackPath), Cloudflare, or BunnyCDN. The setup process is different for each CDN; you will either use a CDN URL or change nameservers for Cloudflare, then activate Cloudflare's CDN in the DNS settings by changing your website from DNS Only to Proxied.

How do I eliminate render-blocking resources in WP Rocket?

Enable Optimize CSS Delivery and Load JavaScript Deferred in WP Rocket's file optimization settings. If that doesn't work, try the Autoptimize or Async JavaScript plugin.

How do I remove unused CSS and JavaScript in WP Rocket?

Enable remove unused CSS under Optimize CSS Delivery. Minify CSS + JavaScrip. However, the underlying problem is likely due to plugins, third-party code, and page builders.

How do I fix CLS issues in WP Rocekt?

Disabling Optimize CSS Delivery or setting a fallback critical CSS can fix CLS (cumulative layout shift) issues when using WP Rocket.

Which other speed plugins do you need besides WP Rocket?

ShortPixel, Autoptimize, Async JavaScript, OMGF, and Asset CleanUp or Perfmatters are plugins you should consider on top of WP Rocket.

What's the best free alternative to WP Rocket?

LiteSpeed Cache is the best free WP Rocket alternative but requires a LiteSpeed server. Otherwise, W3 Total Cache is free but is difficult to configure and you may not see great results.

What is WP Rocket's pricing?

$49/year for 1 site, $99/year for 3 sites, and $249 for unlimited sites. You can get a 10% discount by signing up for their email list on their coupons page.

If you found this helpful, share your new Lighthouse/GTmetrix scores in the comments :)

See Also: My full WordPress speed guide (it’s good, I promise).

Cheers,
Tom

About Tom Dupuis

Tom Dupuis 2017Tom Dupuis writes WordPress speed and SEO tutorials out of his apartment in Denver, Colorado. In his spare time, he plays Rocket League and watches murder documentaries. Read his bio to learn 50 random and disturbing things about him.

235 thoughts on “The Ideal WP Rocket Settings 2022 + Tips For Core Web Vitals, Cloudflare, CDNs, Fonts, Cumulative Layout Shift — Version 3.10

  1. Thanks for this wonderful article. It gave me great advice to optimize my wp-rocket plugin. Great because it worked! thanks a lot for sharing.

  2. Hands down this is one of the best guide I have seen for wordpress website optimization! It is very clear and on point! Thanks for sharing Tom.

  3. Hello, Tom!
    First of all thank you so much for this useful website. My site is hosted at A2 hosting, in which Memcached is installed. The point is that Wp-rocket does not have any option concerning object cache.

    Do you suggest using Wp-rocket or Litespeed cache to me for maximum page speed?

    1. Both are great, you would need to configure each separately and compare results to see which is better for your site. Don’t think you can go wrong with either though. With A2, I would probably use LiteSpeed.

      1. And one more question if you could answer please: Which one would you choose to use, LSCache Instant Click or Flying Pages plugin?

        1. I like Flying Pages, seems a little more advanced and stops preloading if it overloads the server, but both can also break things on your site (including analytics) so I would be careful when testing this.

  4. Hey Tom, this tutorial ist extremely helpful. Been using WProcket for a couple of years now and your explanation nails it better than the support library of wp rocket. Gtmetrix scores sored up by 30% only by applying your settings. Big Kudos!

  5. Hi Tom,

    Thanks for this great tutorial !

    If I used WP Rocket and activate optimize caching of Google Analitycs in options tools. I can / need use plugin like CAOS or Flying Analytics or it’s do same results ?

    Thanks

    1. If you still see an error in GTmetrix under leverage browsing caching for Google Analytics when using WP Rocket, then you can trying Flying Analytics instead. If you don’t see this error, no need to use it. I just know sometimes WP Rocket’s Google Analytics option doesn’t fix the issue in GTmetrix, that’s why I suggested other plugins just in case. Either way, it’s a very small thing and should have little if any affect on speed.

  6. Thank you for this tutorial. It was indeed helpful in optimizing my blog speed. However, I notice a drop in my page speed after porting to cloudflare. What could be the problem?

  7. After looking through this post, I was hopeful to improve our scores and load time, but I just implemented many of the recommended configuration settings and our scores got WORSE. I need to review exactly where and reset things – very disappointing

      1. File Optimization was the one section where I DID NOT make changes (site uses HTTP/2). Prefetch DNS doesn’t seem to work (we have AMP) and new Cloudflare settings in WP Rocket seem to have made performance of the Magento 2 e-commerce portion of our site worse

  8. Great thanks for sharing this article, really a great help,I am searching for best setting, and Its amazing for me. I am using Hostgator VSP, but still facing speed issue.

    1. The difference between HostGator and DigitalOcean On Cloudways is night and day. You would be going from bottom of the barrel to one of the fastest hosts. Even A2 would be a big improvement over HostGator and is similar pricing. I would personally leave HostGator for almost anyone else.

  9. Thank You So Much, Thanks for informatic details configurations, I really enjoy your Post and in 4 minutes I would setup of my WP Rocket setting. Thanks again. Love You.

  10. Nice tutorial sir,
    6-7 plugins cannot do that only 1 plugin WP Rocket can do.

    As you said you are using Cloudflare & Stackpath both at same time, is it possible or how to use both without changing the name server of cloudflare??
    And which plan you are using for Stackpath??

  11. Thanks for your great article on WP rocket.
    I have installed it and its improved the site.
    I am having issues with GTM, fb, and live chat (Gtmetric)
    I am using Cloudflare, do you think installing maxcdn will assist with this issue?
    Or do you have any suggestions to reduce these scripts issues?

    Thanks

  12. Thank you so much for this extremely useful guide. I’ve just installed WP Rocket with Cloudflare and everything works great. Still lots of things to fix, but on a good track :)

    1. They’re a great combination. Took a quick look at your site/GTmetrix report. Add SSL, resize large images, and compress them with a plugin like ShortPixel (but backup your images beforehand just in case) would help a lot. Then try to eliminate unnecessary plugins like your stats plugin (might be JetPack which will slow it down) and just rely on Google Search Console + Google Analytics for stats. Let me know how it goes and if you have questions!

      1. Tom, just did all settings for WP Rocket on my website, could you please say something what else to do. Can not do anything else :(. code2cook.com

  13. Hi Tom,

    Have you a rough idea of how often the plug-in is updated?

    For someone writing a small blog as a hobby it would be handy to keep costs to a minimum. Buying as a ‘one off’ I can probably justify but having to re-buy it every year probably not (unless I start getting some affiliate income to offset costs but that is some way off yet).

    Thanks,
    Richie

    1. Hey Richie,

      Changelog is here – it’s usually about every week.

      In that case I would test a couple free plugins first like Swift Performance and WP Fastest Cache, and see if you can get good results with them. Certain cache plugins yield different results across multiple websites, so it’s worth a try.

  14. I personally use wp-rocket and it really is the best all-in-one caching plugin out there. I am definitely going to give a short pixel a try.

Leave a Reply

Your email address will not be published.