WP Rocket Settings 2024 – Ultimate Guide to Website Speed
Disclosure: WPrBlogger content is reader-supported. This means we may receive financial compensation if you purchase products or services on the merchant website, but at no additional cost to you.
There are no universal settings for the WP Rocket plugin.
Because each site has different active plugins, themes, third-party scripts, file exclusion lists, server setup, etc., it is important to find the ideal WP Rocket settings for your site.
This article guides you through the recommended WP Rocket configuration, best practices, and common troubleshooting tips.
I walk you through the WP Rocket default setup to explore other settings and optimize your site for maximum speed and performance.
After reading through it, you’ll be able to optimize your site with the WP Rocket setting for WordPress. You should see significant improvement in speed and performance, as well as better Core Web Vitals scores across all metrics.
Let’s dive in.
Best WP Rocket Configuration Practices
Many website speed and performance optimization solutions often come with CSS and JavaScript functionality risks. It is common for a website to have design or functionality issues due to script incompatibility.
Before using WP Rocket, here are some best practices to keep in mind.
First, aside from the default or automatic features, don’t enable other settings at once. Do it one at a time.
Especially the WP Rocket optimization settings for CSS and JavaScript files. Enabling CSS Minify, JS defer, and removing unused CSS and JS Minify at once is a bad idea.
After enabling an option, test your site in a browser you’re not logged into as your site admin. It’s best to access your site via incognito mode or use a different device that is not your own.
The idea is to visit your site as a regular user and see if everything is okay or if something is broken or not working as expected.
Watch out for inconsistent design displays, broken text, weird large images, missing elements, etc.
If you notice something doesn’t look as expected, the easiest thing to do is to disable the last option you turned on.
Note: WP Rocket automatically clears its cache, so you don’t have to worry about seeing a cached version of the page.
Next, always keep the plugin up to date.
WP Rocket is regularly updating the plugin. Ensure you’re using the latest version to keep the plugin performance, security patches, bug fixes, and website speed at best.
Still, after each plugin update, test your site again as described above.
Sometimes, new plugin features might introduce bloat or performance issues that are not detected during development.
You can roll back to the WP Rocket plugin’s previous version from the tools tab if the issue can’t be resolved timely.
Then, reach out to WP Rocket support for further guidance.
Troubleshooting Common Performance Issues in WP Rocket
There are many WP Rocket performance issues you can independently fix without seeking support. This type of issue mostly requires disabling or excluding assets from loading on your site.
In some cases, it may need to turn off a function completely sitewide or only on the affected pages.
For instance, let’s say you have a JavaScript web form on your site. Often, the JS delay or Load JS deferred options might interfere with loading the web form, blocking the script from being executed on the page.
What you need to do is add the web forms JS script, tag, or URL to the exclusion JS files list in WP Rocket. WP Rocket will exclude the web form script from optimization.
Using the exclude files list option works best if the issue is sitewide and you need to execute the command on all pages.
What if the problem is an isolated one? I mean, does it affect a single page or a subset of pages/posts?
WP Rocket made it easy to disable its function on individual pages/posts.
If you know the exact page or post that has the problem after activating a particular WP Rocket function, open the post in the WordPress Gutenberg editor.
Now, look for the WP Rocket meta box on the Gutenberg edit screen. Check the image below.
Simply uncheck the function responsible for causing the performance problem on that particular page or post. You can do this for any affected posts or pages on your site instead of disabling the function across the whole site.
As you can see in the image, you can even exclude individual pages from the WP Rocket cache. This option is good for excluding dynamic pages like cart and checkout pages from being cached.
You will find more WP Rocket troubleshooting guides in this post.
How to Configure WP Rocket
The configuration described in this post is taken after WP Rocket 3.16, which removes the page cache setting from the dashboard. But introduce WP Rocket Optimize Critical Images loading above the fold area.
The WP Rocket Critical images optimization feature tends to optimize for the Largest Contentful Paint automatically. A Google Core web vitals metrics for measuring how quickly the largest elements (images or text block) on the page load and become visible within the user viewport.
WP Rocket page cache, including mobile cache, is enabled by default in the background starting from version 3.1. And there are no options for fine-tuning its setting.
If you need to edit the WP Rocket page cache settings, use the helper plugins found on this page.
So, if you have an older version of the WP Rocket plugin, you may find some settings you’re not familiar with here. In that case, you should renew your license today.
Now, let’s go into the WP Rocket plugin settings and find what works best for most WordPress sites.
Dashboard
There is nothing related to setting up the plugin here.
What you have on the WP Rocket dashboard are the plugin license details, expiration date, and subscription link to RocketCDN. You also have quick access to clear and preload cache and clear critical image cache.
If you need to access the getting started video tutorial and frequently asked questions concerning the use of WP Rocket, you’ll find them on the dashboard.
Other than this, you have little attention here.
File Optimization Tab
The WP Rocket File Optimization Tab contains features to optimize CSS and JS assets on your site. You should configure the options here to work with your site.
You will get the best performance benefits from what you do in this tab. So, pay close attention to it.
Minify CSS files and Minify JS files should not cause any performance issues. The WP Rocket file minification settings remove whitespace, comments, and semicolons from scripts, reducing file size and improving loading time.
Therefore, check the Minify CSS files and JS files options.
Next, enable the Optimize CSS delivery option. When you check this option, WP Rocket gives you two CSS optimization options to choose from – Removed Unused CSS or Load CSS Asynchronously.
Removed Unused CSS will delete the unused cascading stylesheet not used on that page from the core files, while Load CSS Asynchronously will load the unused CSS files in the background or delay it loading till the core (Used CSS) file finishes loading.
Both techniques have advantages and disadvantages. However, it is widely recommended to use Remove Unused CSS instead of Load CSS Asynchronously. And that’s what WP Rocket advises.
If after activating Removed Unused CSS, you notice your site design element isn’t displaying as expected, check this article for further troubleshooting guide.
Still, on the File Optimization tab, you should enable the Load JavaScript Deferred and Delay JavaScript Execution options.
Load JavaScript Deferred helps resolve the render-blocking JS file errors. At the same time, Delay JS execution delays the loading of JS file elements on a page till user interactions, such as mouse clicks, on-screen movements, scrolling, etc.
Both options are the most powerful JS file optimization feature in WP Rocket.
However, when the Delay JavaScript file is active, WP Rocket automatically disabled the Combine JavaScript file option for compatibility issues.
If there are JavaScript elements, such as Google Analytics codes and Ads scripts, on the site that need to load and appear quickly in the user viewport, use the one-click JS exclusion option to remove them from the delay JS file execution function.
Media Tab
WP Rocket Media Tab contains options to set missing image dimensions and optimize image and iframe loading. Don’t confuse this option with image optimization techniques like compressions and support for other image formats like AVIF and WebP converter.
WP Rocket does not compress images to reduce their size or load images from CDN services. You need another solution, such as Imagify or JetPack image CDN, to do that.
Here is what you can configure in the WP Rocket Media Tab.
Enable Lazy Load for images, CSS background images, iframes and videos. Also, enable the replacement of the YouTube iframe with a preview image.
As mentioned earlier in this post, turn on one option after the other.
Test your site thoroughly after each function activation. If everything is okay, check the next option to enable it.
Lazy Load improves the perceived loading time, reduces HTTP requests, and enhances the user experience. It delays the loading of videos and image files on the page until the user actually scrolls to the viewport.
This technique is great for making your site load faster, reducing third-party domain requests and saving mobile user bandwidth.
And lastly, turn on the Image Dimension option. This feature automatically adds missing image width and height attributes, which help prevent Layout Shift, another Core Web Vitals metric.
If you’re getting the add explicit width and height to images error warning in GTmetrix, then this function should help fix that.
Learn more about how WP Rocket handles missing image width and height attributes to provide an automatic fix on the fly. Plus, its limitations and non-qualified images.
Preload Tab
The Preload Tab has some optimization features worth looking into.
However, when you enable an option here, make sure to monitor your hosting server resource usage. Some users have reported that WP Rocket Preloading features use too much of server resources.
However, I have never experienced this since I’ve been using WP Rocket.
Anyway, here is what you need to do here.
Enable Preload Cache to allow WP Rocket to detect your sitemap and save it to the database automatically. It ensures your site cache is always preloaded to improve user experience, performance, and fast loading.
Next, turn on the Preload Links feature.
This function downloads a page’s HTML files in the background when the user hovers over the link. So, when the user actually clicks it, the page appears to load instantly.
You must have experienced this on sites you visit. Link Preloading is what makes it happen.
If there are external files that need to be requested and loaded early on the page, enter their URLs in the Prefetch DNS Request list.
WP Rocket lets you preload fonts in a CSS stylesheet so browsers can load them as early as possible. However, WP Rocket does not host Google font locally.
So, the font files must be hosted on your server for this function to work. Alternatively, you should specify the font files in the CDN tab.
Another thing is that Preload Fonts won’t work if the Removed Unused CSS function is active.
In this case, WP Rocket will preload all the needed fonts into the Used CSS core block. What you can do is to stop or prevent specific font files from loading when removed unused CSS is active.
This might help improve perceived page loading time and fix the Preload key request errors in PSI and other testing tools.
Advances Rules Tab
The Advanced rules tab has additional WP Rocket configurations such as Cache Lifespan, cache exclusion list, purge URLs, and cache query strings.
The default Cache Lifespan is set to 24 hours. You can change this setting depending on how often you update your blog content.
WP Rocket automatically rebuilds its global cache after its expiration time. Ensure Cache Preloading is set to on in the Preload Tab for this feature to work.
In the Never Cache URL field, enter the address of pages you don’t need to cache. For example, login page, WooCommerce checkout pages, and other dynamic pages.
If you have specific web cookies that, when set on the user browsers, the page should never cache, enter their IDs in the appropriate box. This WP Rocket tweak might be helpful for Woocommerce stores with an international audience.
You can also specify user agents that are not allowed to visit cached pages. If you have a reason for this, enter the user agent in the text field.
Next, is there a page that must be purged from the cache whenever you update your website? Specify their URLs in the box.
Lastly, WP Rocket doesn’t cache pages with Query strings by default.
Pages with URL parameters are not cached, but if you want to cache such pages, you should enter their parameters here.
If there are several instances of these pages, enter one parameter per line without the value.
However, WP Rocket will still serve the cached page from the main URL address. Something like this:
example.com/contact-us/?utm_source=something
example.com/my-new-poat/?utm_source=somethingelse
Will receive the cache file from
example.com/contact-us/ and example.com/my-new-post/, respectively.
If you want to learn more about how this function works, consider reading this in-depth article.
Database Tab
WP Rocket helps optimize the WordPress database by cleaning up its tables and removing trash posts, comments, transients, spam comments, leftovers, post revisions, etc.
The best part is that you can set it and forget it. WP Rocket auto-schedules the database maintenance routine.
Just enable all the options and set the Automatic Clean-up option to your preference – Daily, Weekly, or Monthly.
That’s it.
CDN Tab
RocketCDN is a WP Rocket content delivery network solution. BunnyCDN powers it, which has over 120 POPs global edge locations. It costs $7.99 per month to use RocketCDN.
If you’re using Cloudflare CDN, you don’t need to bother about this section. Otherwise, enter your CDN CNAME record in the required field.
WP Rocket is compatible with the Cloudflare content delivery network; no configuration is required. The other setting you should look into on this page is excluding some files from the CDN server.
But why would you want to do this? Whatever, there is an option for you.
HeartBeat Tab
Reduce or disable the WordPress heartbeat APIs to save server resources.
I don’t recommend disabling it entirely because some plugins or themes might depend on it to function properly.
Instead, reduce its frequency and activity in the WordPress backend, post editor and frontend to one hit every two minutes.
Addon Tab
This tab lists WP Rocket-compatible add-ons without any configuration needed. You can toggle on addons listed on this page if it extend the plugin’s functionality and performance for your site.
Here is a quick rundown of the available add-ons.
- User Cache – This lets you create a dedicated cache for logged-in WordPress users.
- Varnish – Auto detect Varnish on your web host server and purge its cache whenever WP Rocket purges its own cache to ensure content is always up to date.
- WebP Compatibility – Provide support for WebP-compatible image optimization plugins on your site. If you have one, this addon auto-detects it and provides support for compatible browsers.
- Cloudflare – Use this addon to enable WP Rocket compatibility with Cloudflare Automatic Platform Optimization (APO) features.
- Sucuri – Clear the Sucuri cache when WP Rocket does the same.
Image Optimization Tab
Nothing to do on the image optimization tab. WP Rocket promotes its Imagify image optimization plugin here.
You can download its free version if you want to learn how the plugin helps optimize WordPress images – compress and resize images without sacrificing quality.
Other Tabs
The Tools and Tutorials Tabs are the least important for many Rocketeers.
The tool tab has the option to import or export plugin settings, roll back to a previous major WP Rocket version, enable Google font optimization, and update the file inclusion/exclusion list.
In the Tutorials tab, there’s a list of video tutorials to help you get the best WP Rocket settings, as well as performance and troubleshooting tips for your site.
Except for the first time I installed the plugin, I’ve never checked these tabs again.
Conclusion
WP Rocket is a powerful and popular WordPress cache plugin. It’s been around for over a decade and boasts an active installation of over 4 million sites.
For most WordPress sites, these WP Rocket settings should work and help improve performance, speed, and user experience, as well as fix many errors in the PageSpeed Insights tool.
If you encounter any issues while implementing this advice on this page, don’t hesitate to reach out to the help guide found on this page.