WP Rocket: How to Speed Up Your Website

WP Rocket is one of the best caching plugins for WordPress. It not only makes your website faster, but is also very easy to use. In this detailed guide I will explain how to get the best results quickly and easily.

Some time ago I tested some caching plugins for WordPress. And WP Rocket was not only the fastest plugin, but also the easiest to use. Unfortunately it is not free, but the investment is worth it!

Compared to the free plugins, it offers a lot of useful features. In this article we will take a closer look at all its features and how to use them to optimize your website.

WP Rocket installation

Of course, you can install the plugin only after you have purchased it. Unfortunately, there is no trial version, but there is a money-back guarantee. In addition, the price of $49,- (single license) is absolutely fair. You can find more pricing plans here.

Immediately after the purchase you can download the zip file in your account.

Then you can install the plugin on your website via Plugins > Add new > Upload Plugin.

WP Rocket settings at a glance

Make WordPress faster with just a few clicks. That’s WP Rocket’s slogan and it’s actually true. Already after plugin activation the website is noticeably faster. But to make the site really fast, you need to activate a few options.

Dashboard

You can access the dashboard via WP Rocket > Settings. Here you will find information about your license as well as links to help topics and support.

If you want, you can also support the further development of the plugin. Either as a Rocket tester or by sending anonymized usage data.

On the far right, you have direct access to the important features after plugin setup: Remove cached files, Preload Cache and Regenerate Critical CSS.

Cache

Here you can define the settings for the cache:

• Mobile Cache
  If your site is responsive, you should enable this option. This way, the cached pages will be displayed on mobile devices as well and will load faster.
• Separate Cache for mobile devices
  Allows you to have a separate caching for cell phones only. Usually you need this only if the mobile version of your website contains other special features than the desktop version.
• User Cache
  This shows logged in WordPress users a cached version of the website. This can be useful if you are using community or member features.
• Cache Lifespan
  Here you can set the duration after which the cache should be cleared automatically. The default is 10 hours.

File Optimization

In this tab you can optimize CSS and JavaScript files.

CSS Files

• Minify CSS
  Via this setting Rocket compresses the CSS files by removing unnecessary spaces and comments.
  
  Attention: this may cause errors in the display of the website. If this happens to you, you can simply deactivate this option. Or you can add the problematic files to the CSS exceptions.
  
• Combine CSS Files
  Since each WordPress theme and also each plugin loads its own CSS files, your website loads multiple CSS files. WP Rocket can combine them to a few files, which makes the site faster.
  
  If your server uses HTTP/2, this setting doesn’t make sense. Because then the individual files are loaded simultaneously and are therefore faster than a single large file.
• Excluded CSS Files
  If a certain file causes problems with CSS minification, you can enter it here. It will then neither be compressed nor merged with other CSS files.
• Optimize CSS Delivery
  This setting removes blocking CSS files. WP Rocket will generate the critical path css and load css asynchronously.
  
  With WP Rocket 3.9, you can also automatically remove unused CSS, but it’s still a beta feature. So if you should have problems with the layout of your website, it’s best to deactivate this feature again.
  

JavaScript Files

• Minify JavaScript Files
  Just like with the CSS settings, you can compress the JavaScript files here. Also here you have to check your page if this causes errors. If, for example, a plugin no longer works properly or the design looks different, you can reset the setting. Alternatively, you can try adding the affected JavaScript file as an exception.
• Combine JavaScript Files
  This allows you to bundle all the JS files into a few. Again, if you’re using HTTP/2, this usually doesn’t benefit you.
• Load JavaScript Deferred
  This causes JavaScript files to be loaded later. Depending on the website, this can improve performance. It is best to try it out.
• Delay JavaScript Execution
  As of version 3.9.5, Rocket has added a new option: Delayed execution of scripts. This works for external files such as Google Captcha as well as local ones.
• This means that scripts that are not necessary are only loaded after a user interaction (e.g. mouse movement) occurs. This has of course a very positive impact on the loading time and also the Core Web Vitals values.

If you have problems with delayed loading, you can add single files as exceptions. Or you can use the following rules for a quick solution:

(?:wp-content|wp-includes)(.*)
/jquery-?[0-9.]*(.min|.slim|.slim.min)?.js
js-(before|after)

Media

Having many and too large images or even videos will slow down your website. WP Rocket offers some useful tools for this very issue.
And starting with version 3.4, the WebP format is also supported.

LazyLoad
When activating Lazyload, images or videos are not loaded immediately when the web page is accessed. Only when the user scrolls near them, the data is loaded.

You should definitely try this option, as it makes the page faster. However, in very rare cases it can cause problems. For example, if a Masonry layout is used.

If desired, you can also exclude individual images from delayed loading.

Feature update: Since version 3.3, Rocket can now also delay loading background images.

For YouTube videos, you also have the option to display a preview image.

Image Dimensions
Since V3.8, Rocket will add the missing dimensions for images to your website on demand. This has especially an advantage for the evaluation of the Core Web Vitals. Because this prevents Cumulative Layout Shifts (CLS).
These are caused by elements such as images changing their position or size during the loading process. By specifying the size of images, however, this effect can be minimized.

Notice:
WordPress uses emojis by default, which make your page slower.
Starting with version 3.8.1, WordPress emojis are disabled by default.

Preload Cache

A very useful feature of WP Rocket is the automatic generation of the cache. I. After the cache has expired or you have emptied it, the files are re-cached based on the sitemap. With free plugins, the cache is mostly built by the visitors of the respective page.

Preload Cache
If you’re using Yoast SEO or Rank Math, the Rocket tool can build the cache through the sitemap.

Do you use another SEO plugin? Then you can also manually enter the path to your sitemap.

Preload Links
Link preloading improves the perceived load time by downloading a page when a user hovers over the link.

Does your website use external services? If so, you can enter the respective URLs here. So these domains will be loaded faster by prefetch.

Here is an example for prefetching Google fonts: //fonts.googleapis.com

Preload Fonts
Do you use local fonts on your website? Then you can add them here, so they can be preloaded faster.

Advanced Rules

In most cases you don’t have to enter anything in the advanced rules. If you have a store page or a member page, it might be useful to exclude some areas from caching.
You can set this up here:

Never cache

• URLs
  Do you use for example WooCommerce? Then WP Rocket recognizes this and automatically inserts the appropriate URLs for the shopping cart, login, etc. here.
• Cookies
  If you don’t want certain cookies to be cached, you can enter them here.
• User Agents
  You can also exclude user agents from caching.

Always purge

When you publish a new post or a new page, WP Rocket usually detects it. And the cache of the affected pages like blog and category page will be cleared. If you want to clear the cache of other pages, you can add them here.

Cache Query Strings

Normally pages with query parameters (e.g. search results) are not cached. But if it should be necessary, you can enter this here.

Database

In the Database tab you can find useful settings that clean up and optimize your database. You should definitely use this option regularly. I prefer to use the Advanced Database Cleaner tool, which allows me to clean up the database much more thoroughly.

• Clean up posts and pages
  Here you can delete revisions and drafts of pages and posts. Also the recycle bin can be emptied.
• Clean up comments
  Also here it is worth cleaning up: Spam comments and deleted comments can be removed with one click.
• Transients cleanup
  WordPress themes and plugins like to create temporary options in the database. Often these remain even after plugin uninstallation, which unnecessarily bloats the database.
• Database cleanup
  In this process, tables of already removed plugins are deleted. Unfortunately many plugins often still leave their traces, such as Wordfence, if it has not been properly uninstalled.
• Automatic cleanup
  Should your database be optimized in regular intervals? Then all checked options will be executed automatically.
  I prefer to do this manually. So I can create a backup before.

CDN

If you are using a Content Delivery Network, you can activate the necessary settings here.
Further information can be found in the WP Rocket documentation.

Since version 3.5 WP Rocket even offers its own CDN.

Heartbeat

With version 3.2 Rocket has introduced the new tab Heartbeat. Here you can now easily reduce the query frequency of the heartbeat API or even turn it off completely. You can make the settings for backend, frontend and editor separately.

Add-Ons

Here you can activate additional tools for WP Rocket with one click.

• Varnish
  Some hosters offer a Varnish cache. If your server uses Varnish, you can use this add-on.
• WebP comptability
  Here you set whether WP Rocket should deliver your WebP images. I don’t need this option because I use Imagify. With this plugin (also from the Rocket developers) you can compress your images. Additionally, it also creates a WebP version if you wish.
• Cloudflare
  Cloudflare offers a CDN as well as a firewall for websites. Here you can connect your Cloudflare account with WP-Rocket.
• Sucuri
  If you use Sucuri, you can synchronize your cache with it.

Tools

In the Tools tab you can export your WP Rocket settings and also import them again.
The restore function can also be quite useful: If an update causes problems, you can downgrade to the previous plugin version.

Tutorials

In the last tab Tutorials you can find some videos with instructions and explanations.

WP Rocket Options for Single Pages & Posts

You want to customize the settings for a specific page or post? You can use the metabox for the respective page.

Quick Access via Toolbar

If you are logged in, you have access to the most important features via the admin bar.

This way you can clear the entire WP Rocket cache after making changes or only for individual pages. If the changes are not visible, you should also clear the browser cache.

Performance Test:

For this tutorial I used the Divi theme with a pre-built layout. The website is on a server at all-inkl that supports HTTP/2.
Although many images are loaded, the loading time without WP Rocket was only 1.66 seconds. Compared to other premium themes, Divi including PageBuilder is relatively fast.

Performance test with WP Rocket:

As you can see, WP Rocket has made the page significantly faster: from 1.66 seconds to 582 milliseconds!
You are probably wondering why the performance value is “only” 99? It’s because of the fonts. Since the web fonts are loaded via the Google server, they cannot be cached. As soon as you embed the fonts locally, the value is 100.