January 18th, 2021 at 3:48 pm
WP-Rocket – Premium and Well-rounded WordPress Plugin
18 minutes reading
Performance is a defining factor in every website. A single second delay in page load can cost you up to 7% conversion, 11% fewer page views, and a 16% decrease in customer satisfaction. Not to mention that Google detests slow websites and will give them a rough time when ranking up.
Optimization is quite a broad concept, and it convenes so many factors, such as the website’s code, theme, and content. Last but not least, a WordPress website’s performance can benefit from using caching types, commonly deployed by Caching Plugins. WP-Rocket is such a solution, and amongst the community, it is regarded and praised for being one of the best!
We doubt that there is anyone that has been in the WordPress community and has not heard of WP-Rocket. It was introduced around seven years ago and has been recommended by WordPress gurus a year after its release. The plugin’s developers had a vision of bringing everything a WordPress user needs without them having to go through an overwhelming list of configurations and manually applying tweaks to start seeing results. In this post, we are going to check how good it performs, and whether it is worth the price!
The plugin developers claim that 80% of the best performance practices are set by default upon the plugin activation. Given its popularity, we are excited to put this statement to the test! If you are a maximalist and would like to push this even further, this post will give you thoughts and recommendations regarding the settings for this plugin that we believe may give you that extra bit of performance you need!
To show WP-Rocket’s capabilities in a more objective manner, we have performed a test using a theme deployed by Avada, which is very similar to fleshed-out production websites.
How to install
As this is a premium WordPress caching solution, it is licensed, and before you can proceed with the installation, you need to purchase it from WP-Rocket’s official website. Upon successful purchase, you will see a download link inside your WP-Rocket dashboard. After downloading the archive, go to your WordPress Admin Dashboard and then go to Plugins > Add New > Upload Plugin.
Lastly, click the “Choose File” button and select the wp-rocket.zip file from your local computer. This action will cause the “Install Now” button to appear, and upon pressing it – the installation will begin!
After a brief loading period, you will be presented with a summary of the installation process, and you will be able to activate the plugin by pressing the “Activate Plugin” button.
Now that you have installed the plugin let’s go and check out its configuration options. To gain access to them, please go to Settings > WP Rocket.
Clicking on this link will redirect you to the settings page where you will most likely be shocked by the 13 available tabs! Do not worry, as everything is laid out for you in a user-friendly and understandable manner, and most of the options will give a warning or will have a tooltip letting you know what they do. Furthermore, this post aims to cover all the relevant settings which tie to performance, explain them, and provide recommendations regarding what you should enable and when. So, rest assured!
The first tab we are going to cover is the “Dashboard” tab. You will see your license, expiration date, and the status of your account under it. In addition to that, you will find useful buttons, links to “getting started” articles, and FAQs.
- Clear Cache – Pressing this button will clear all the cache files generated by WP-Rocket. We advise you to flush the cache, each time you change a setting for the plugin.
- Preload Cache – Preloading allows WP-Rocket to generate cached versions of your pages so that visitors can access them faster. The plugin deploys with this feature enabled by default, and it will immediately start preloading the cache when activated. If you want WP-Rocket to start preloading, please press this button. This feature is excellent to use, right after you have done a cache flush.
- Purge Opcache – When you execute a PHP script (for example, access your website) and if the opcache PHP extension is enabled, the code compiles into opcode that is understandable by the server. This code is stored in memory and is reused on each consecutive visit, making your website a lot faster in the process. You may use this button to clear this cache.
- Regenerate Critical CSS – When you visit a website, the first thing you see is the upper area of the site, commonly referred to as the “above-the-fold” content. This content is critical for your website as it is the first thing the visitor will observe, and it needs to make an impression, and most importantly – load quickly, thus, improving the UX. The CSS inside the “above-the-fold” area of the site is the Critical CSS(CCSS). Getting it to load inline with the rest of your scripts can improve the loading of your page and remove the “Eliminate Render-Blocking Resources” error in popular web performance testing sites, such as GTmetrix and Pingdom. Clicking on this button will generate this CSS anew and inline them with the rest of your scripts.
- Get RocketCDN – If you press this button, you will be redirected to the “CDN” tab to set up WP-Rocket’s CDN – RocketCDN. It is entirely optional, and if you do not want to use it, you can use a different one such a Cloudflare to KeyCDN.
This tab will let you disable/enable the cache, add caching for logged in users and define the cache lifespan.
- Enable Caching for mobile devices – This option is enabled by default, and it allows caching for mobile devices.
- Separate cache files for mobile devices – Unless your website does not have a responsive theme and uses a different view for mobile devices, do not check this option.
- Enable caching for logged-in WordPress users – This is an excellent option if you have a lot of clients who regularly browse your website while logged in, or you have specific user-only content which is not available for visitors unless they log in.
- Cache Lifespan – This is the time after which WP-Rocket will clear the global cache. If you are doing regular website updates, you may want to lower this to a few hours. If your website is fully-built and you do not expect to add content anytime soon, you can increase it to 24 hours. Additionally, after flushing the global cache in the designated time-frame, the plugin will preload the cache if that option is activated.
- Minify HTML – Check this box to optimize your HTML files by removing all the unnecessary characters from them. This option reduces their size and boosts the loading speed of your pages.
- Optimize Google Fonts – This is an excellent option if your site utilizes google fonts heavily. It will combine all requests to fonts.static.com, into one and it will add the “preconnect” resource hint so that the DNS zone of the font domain is preloaded. Finally, it will also add the display=swap parameter to your HTTP request, making your text load along with the font. You should enable this if you have a text on your pages that you want your visitors to read immediately – for instance, if you have a webshop and have an ad campaign going.
- Minify CSS files – This is a hazardous option which will not fair well with all website. It removes all unneeded characters from your CSS files and makes them smaller. Thus, they are delivered quickly to the visitor’s browser. Typically, this option contributed more to the actual page score than speed, and we believe that it is worth activating it when your website uses A LOT of CSS. The benefits in terms of performance would be more distinguishable.
- Combine CSS files – We strongly advise you to stay away from this setting as it often causes FAUC (Flash of Unstyled Content) issues on sites. You may have faced this before when you see a page’s text displayed in an unstyled manner, and after a few seconds (or even minutes), all the styles appear. If you are hosting your websites with HostArmada, you have an even more significant incentive to keep it disabled. We offer HTTP/2 (Start Dock, Web Warp) and HTTP/3 (Speed Reaper), which means that resources are loaded simultaneously, and having all your CSS bunched up in a single file will not bring you any performance. It will increase your page score, however, is it worth ruining your visitors’ UX by unstyled text appearing when they visit your website?
- Remove jQuery Migrate – If you activate this option, this will stop the file “wp-includes/js/jquery/jquery-migrate.min.js” from being loaded on your site. This script is outdated and was used by themes and plugins before WordPress 3.6. In 99% of the cases, this should be completely fine to activate, however, if you see any issues with your plugins and themes, you should disable it.
- Safe Mode for jQuery (recommended) – This option will only show if you activate the above. We recommend enabling this to make sure inline jQuery requests from your themes and plugins will load at the top of the document as render-blocking scripts. Sometimes it is impossible to avoid render-blocking scenarios without breaking your website’s functionality.
Under this tab, you can activate Lazyload, control emojis, embeds, and WebP support.
- Enable for Images – Lazyload is a technique, which makes your images load gradually, as you scroll down your page, instead of having them all load at once. This option is excellent if you have a lot of images, and the majority of them are “bellow the fold” area of the website.
- Enable for iframes and videos – You can use this option if you have a lot of videos. It applies the Lazyload tech on them as well.
- Replace YouTube iframes with preview images – Activating this option will replace all your YouTube embeds with preview images, which should result in speed increase if you have a lot of iframes on your pages.
- Disable Emoji – When you active this, you will disable the emojis shipped with the WordPress core. Instead, users will use the ones provided by their browser. It lowers the number of requests on pages and will result in a better score.
- Enable WebP caching – WebP provides both lossless and lossy compression for your images resulting in a smaller size, thus speeding the delivery rate to the user’s browser and increasing your website’s loading speed. If your WordPress has images with WebP format, you can also enable this to cache them. To have WebP images, they first need to be converted, and unfortunately, WP-Rocket cannot do this. You can use other WordPress plugins, such as Imagify or Shortpixel.
The setting located under this tab will help you set a preload rotation for your WP-Rocket cache.
- Activate Preloading – Activate the preloading functionality of the WP-Rocket plugin, which will preload the cache after a cache wipe or adding/changing content on your site. It is great if you regularly add material on your website, ensuring that it will be cached.
- Activate sitemap-based cache preloading – This option will be available only if the above one is. It will allow you to add a link to a custom site-map that the plugin will use to preload. If you do not have such a sitemap, but instead you have one generated from a popular SEO plugin such as Yoast, this will fetch the sitemap from there and build the cache from it.
- Prefetch DNS requests – Enabling this option lets you prefetch DNS of third-party sites allowing the browser to connect to remote domain names preemptively. Typically, you are loading various content from these sites, which will improve the time needed to load the resources. To find out the third-party domains, please open GoogleChrome and click “F12”. When the console appears, please choose “Sources” from the top menu. On the left side, you will see a list of pages, with your domain being on top and all the external ones listed underneath. To “prefetch” these domains, please insert them into this text field, having one on each line. If you are not a GoogleChrome user, that is completely fine, any up-to-date web browser should have the same functionality, accessible in a similar manner.
- Preload fonts – This is a great option to enable when you have a lot of fonts loaded from specific CSS files. Inside the content box, simply add the path to the particular file containing the URL of the font so you can take advantage of this (one per line).
You may use the configuration options under this tab to set various rules regarding the caching of specific pages that you do not want to cache.
- Never Cache URL(s) – Inside this content box, you can specify URLs that you want WP-Rocket to exclude from being cached. Really useful for login/registration/contact forms. If you are using WooCommerce, the shopping carts and checkout pages will be removed from the cache by default.
- Never Cache Cookies – You may use this content box and define cookie IDs to exclude from the cache. This option is excellent if you run into an issue with conflicting plugins that need to prevent caching of the cookies they use.
- Never Cache User Agent(s) – Include the user-agents you wish to prevent from seeing cached versions of your pages. This setting can be useful if you notice that your site’s layout appears broken on specific browsers or devices.
- Always Purge URL(s) – Inside this content box, enter the URLs you need to be cleared from the cache when an update your posts or pages.
- Cache Query String(s) – Inside this content box, you can enter Query Strings, which you want WP-Rocket to cache.
The functionalities under this tab will allow you to optimize your database from your WordPress dashboard.
- Post cleanup – By default, WordPress stores a copy of your drafts or posts inside the database while you are writing it, in case you get disconnected, or any other issue occurs. This feature guarantees that you do not need to start writing everything all over again but instead have the option to start from the place where you were last interrupted. Tick the boxes here to make WP-Rocket clears those when you finally hit the “Save Changes And Optimize” button.
- Comments Cleanup – Trashed and Spam comments are typically kept within the WordPress database as well. If there is a lot of them, this can cause its size to rise. Tick the boxes here to make WP-Rocket clears those when you finally hit the “Save Changes And Optimize” button.
- Transients Cleanup – Transients are temporary data that is being stored for a fixed amount of time in your database and then cleared. Plugins or themes usually generate this, and if you are using a lot of them, this can go out of control and grow your database. Clean this up regularly to avoid overpopulated transient tables. Tick the boxes here to make WP-Rocket clears those when you finally hit the “Save Changes And Optimize” button.
- Database Cleanup – This performs a database optimization that reduces overhead inside the tables. This optimization can be done from a few places, but WP-Rocket integrated it within its interface, making it convenient to use. Tick the box here to make WP-Rocket clear the overhead when you finally hit the “Save Changes And Optimize” button.
- Automatic Cleanup – You can optimize the above process and make it either Daily, Weekly, or Monthly. We recommend not doing this and manually go and do it when you feel it is necessary.
- Save Changes and Optimize – When you have selected your options from the page, hit this button so that WP-Rocket can work its magic!
When using a CDN, the settings under this tab will help you integrate it with WP-Rocket and your WordPress.
- Enable Content Delivery Network – If you are using proxy-based CDN providers such as Cloudflare or Sucurri, you do not need to activate this. When you use their services, all of these settings can be tweaked from their dashboards.
- ADD CNAME – Use this button to add more CNAME URLs.
- Exclude files from CDN – Inside this content box, you can include data that you wish to exclude from the CDN.
The Heartbeat API makes it possible for WordPress to receive almost instantaneous front-end or back-end updates. Sometimes this API can be taxing on server resources, thus the settings under this tab can help you control it.
- Control Heartbeat – Enable this checkbox to start using the heartbeat control functionality of WP-Rocket. Note that this is an issue that you may not face with your site, and you should make sure that heartbeat is causing problems before enabling it. An indication of this is if your WordPress seems to be spawning many processes triggered by the admin-ajax.php file.
- Behavior in backend – You should play around with this option and see what gives you the be result. You can leave it at the default “Reduce activity” level, but if it does not help, simply choose “Disable”.
- Behavior in post editor – You should play around with this option and see what gives you the be result. You can leave it at the default “Reduce activity” level, but if it does not help, simply choose “Disable”.
- Behavior in frontend – You should play around with this option and see what gives you the be result. You can leave it at the default “Reduce activity” level, but if it does not help, simply choose “Disable”.
This tab does not contain anything other than a button that will help you install “Imagify”. It is a great solution that can help you optimize your images and boost your site’s speed. Note that using Imagify is not mandatory. We have made a great post on how you can use other optimization tools for your images here.
Before Optimization Test
Finally, it is time for the exciting part. After installing the plugin and applying the recommendation, what will the performance benefits be? Well, here is a test before installing WP-Rocket.
A reasonably decent result with scores varying between 70-80% and load speed of 4 seconds and TTFB sitting at about 650 milliseconds.
After Optimization Test
Now, the picture is a lot different after the installation of the plugin and some tweaks.
The loading speed has improved almost three times and is currently standing at 1.7 seconds. The number of requests and the total page size is lower as well, and the TTFB dropped to about 100 milliseconds!
We are sure that results speak for themselves what a great addition WP-Rocket can be to your performance arsenal. The only downside to it is that it is a paid plugin, and some may argue that you may receive the same results with a free plugin. Note that this may be true, however, the hassle of fine-tuning every aspect of the free plugin can be quite time-consuming and confusing, while WP-Rocket takes matters into its own hands!
As a Web Hosting Provider that offer fully managed solutions for WordPress, we at HostArmada have always been and will always be focused on providing top-notch performance and loading speed to our customers. If you are still looking for a home to your new website or you are unsatisfied with your current host and expect nothing less than excellence, we would like to welcome you to take a look at the following comprehensive review of our hosting plans.