Starting from this week, we will test popular themes/frameworks and how they perform with WP Rocket. We will publish the results, as well as our recommendations about optimal settings that would maximize the benefits of both products.
We’re using Pingdom Tools for speed testing in this example. Lucy, a member of the WP Rocket team has written a great guide on How to correctly measure website page load time, don’t miss that one, it’s really useful.
We decided to test multiple pages/posts with the Avada theme activated, including plugins recommended/included in installation, with the imported original demo content.
First, we tested pages/posts without WP Rocket installed. After that, we activated WP Rocket with only the HTML and Google Fonts files optimization options turned on (these two options almost never create problems, so it’s ok to turn them on in over 95% of sites).
Comparison of Results
Here are the results we get.
Avada Theme – No WP Rocket installed
1. Homepage – 76/100 – 54 requests – 1.18s loadtime, 2.6MB Page Size
2. Shop Page – 74/100 – 43 requests – 992ms loadtime, 2.2MB Page Size
4. Portfolio Grid 2 Columns – 74/100 – 42 requests – 1.13s loadtime, 2.1MB Page Size
– Blog TimeLine – 74/100 – 50 requests – 1.07s loadtime, 2.6MB Page Size
– Blog Grid – 74/100 – 46 requests – 1.10s loadtime, 2.2MB Page Size
6. Blog Single – 75/100 – 52 requests – 1.09s loadtime, 2.5MB Page Size
7. Revolution Slider – 72/100 – 87 requests – 1.10s loadtime, 958.0kB Page Size
8. Layer Slider – 74/100 – 58 requests – 1.08s loadtime, 2.3MB Page Size
9. Fusion Slider – Full Width – 75/100 – 55 requests – 1.75s loadtime, 5MB Page Size
10. Elastic Slider – 74/100 – 44 requests – 965ms loadtime, 2.2MB Page Size
11. Page/Post Sliders – 74/100 – 46 requests – 1.01s loadtime, 2.2MB Page Size
Avada Theme – WP Rocket installed and activated
1. Homepage – 71/100 – 54 requests – 820ms loadtime, 1.2MB Page Size
2. Shop Page – 67/100 – 43 requests – 833ms loadtime, 798.7kB Page Size
4. Portfolio Grid 2 Columns – 67/100 – 42 requests – 635ms loadtime, 728.1kB Page Size
– Blog TimeLine – 69/100 – 50 requests – 714ms loadtime, 926.4kB Page Size
– Blog Grid – 68/100 – 46 requests – 701ms loadtime, 811.2kB Page Size
6. Blog Single – 69/100 – 52 requests – 794ms loadtime, 1.1MB Page Size
7. Revolution Slider – 72/100 – 57 requests – 664ms loadtime, 964.0kB Page Size
8. Layer Slider – 71/100 – 58 requests – 626ms loadtime, 963.1kB Page Size
9. Fusion Slider – Full Width – 68/100 – 55 requests – 1.50s loadtime, 3.7MB Page Size
10. Elastic Slider – 68/100 – 44 requests – 630ms loadtime, 818.4kB Page Size
11. Page/post Sliders – 68/100 – 46 requests – 751ms loadtime, 879.7kB Page Size
Note: It’s not recommended to use all of these sliders on one site. Test all of them and try to use the one that fits your needs.
By installing and activating WP Rocket, we got significant page speed improvements.
Performance Grade vs Page Speed
Although page speed increased, you can probably notice there is difference in perf. grade results, where you get better results for non-cached versions of page. It’s much more important to focus on your page loading time and not on your performance grade – this is true no matter which tool you use (PageSpeed, GTMetrix, Pingdom etc). For SEO, Google doesn’t care about your grade, it only considers your website load time.
If you want to have a better perf. grade for some reason, you can increase it by making some changes in the WP Rocket Settings.
Let’s perform one test as an example:
This is the initial Homepage speed test result we got:
Homepage – 71/100 – 54 requests – 820ms loadtime, 1.2MB Page Size
I went to WP Rocket Settings page (which can be found in Settings –> WP Rocket), and turned on all options in the Basic Options Tab. Next, I went to the Advanced Tab and checked CSS and JS in the option: Reducing the number of minified files in one file.
However you can force the minification to create only 1 file by activating this option.
But it’s not recommended to do this because you won’t take advantage of the parallelization of the download: it’s faster to download 4 files in parallel rather than one big file.
Here are the new results:
Homepage – 88/100 – 93 requests – 867ms loadtime, 781.1kB Page Size
You can see that the performance grade is higher, but the load time is slower!
Then I turned off the LazyLoad feature in Basic Options (since this creates more requests, although they are of 0 bytes) and here is the result:
Homepage – 92/100 – 35 requests – 866ms loadtime, 1.1MB Page Size
The performance grade is even higher, but the page is still slower than the original result.
Additional Options in WP Rocket
Users haven’t reported issues in Support Tickets regarding WP Rocket + Avada functionality, but with a theme like Avada (or any other multi-purpose WordPress theme) which has multiple JS and CSS files, one should definitely pay attention when activating further options.
The next step we took was to turn on all optional settings – LazyLoad, CSS and JS Minification.
JS Minification issues
The first thing I noticed here were errors with two js files, admin-bar.min.js and comment-reply.min.js (both are WP core files and can be found in wp-includes/js folder of your WordPress installation) :
The solution for this and similar issues related to minification can be found in our Knowledge Base.
So, I visited Settings –> WP Rocket –> Advanced tab and pasted the following addresses in JS files to exclude from minification field:
On this page I noticed an issue when WP Rocket’s LazyLoad option is turned on :
Carousel images that are visible at first are not fully loaded. Fortunately, WP Rocket has an option to turn off LazyLoad for specific pages and even for specific images only.
That’s exactly what I did on this page. I turned it off as shown below and the page loaded normally, without any issues:
Pros & Cons of using Avada
Although this post’s intention is to analyze and present how these two powerful product work, we have decided to provide our opinion of Avada, so here are the pros and cons of using it.
- Avada comes with many different options that can help you add almost any element you can imagine to your site, without any coding knowledge.
- It is coded very well. It’s not easy to create a powerful theme like this and make it load fast and work without issues on all modern browsers
- If a problem arises, the ThemeFusion team has a pretty good Support Center, including a Knowledge Base, Documentation, Video Tutorials and Community Forum, which is, per my previous experience, really good.
- Different demo pages are available with a one-click installation
- Although I mentioned the multi-purpose nature of Avada as a positive feature, it can be painful to work with this kind of theme in some cases.
- If you want to a create simple blog or small static websites, you will end up not using most of the features Avada offers, so it could be overkill to use it.
- This number of features and options can lead you into an endless process of site building. If you build a website and decide to try all features Avada offers, you can get lost and add superfluous elements or even never complete the project.
- Memory usage can be a problem with some hosting providers. Based on my previous experience, this kind of premium theme require stable and good servers, so choosing a good hosting company would definitely be a good idea if you decide to use Avada.
Personally, I am not huge fan of multipurpose/all-in-one WordPress themes, especially because there are many badly written themes of that kind on the market. However, the results I get in this test, as well as the ease of use of this theme convinced me it is a really useful WordPress template.
This test process has been made on Europe-based shared hosting, one of many that can be found on the market these days. You can gain even better results by using services from some of the best hosting providers. Have you heard about WP Rocket’s partnership with Siteground?
Have you have a chance to use Avada in combination with WP Rocket? Or do you have additional questions? Feel free to leave a comment.