WPRocket / Google PageSpeed help

Joined
Jan 25, 2021
Messages
28
Reaction score
9
Hi,

I have recently been attempting to improve website page speed performance so took to Google PageSpeed to check out what my current page performance was like.
It's absolutely terrible on mobile and not great on desktop, so I really need to improve it especially on mobile.
You can see the results here: -

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwebdesignsolutionswales.com%2F&tab=mobile
What's odd, is that after purchasing WPRocket and enabling the recommended settings (Minimize CSS files, Remove unused CSS, minify JS files and Load JS deferred) my page speed score is actually worse? See here: -

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwebdesignsolutionswales.com%2F%3Fnowprocket&tab=mobile
Can anyone recommend what I do from here? I'm currently on a shared hosting plan with InterServer, so I am in the process of upgrading to their VPS plan.

Any other recommendations? (Which doesn't involve changing my theme, as I quite like my current one)

Thanks
 
See hacks, tips and tricks about the Rocket. Its not just plug&play. Also your server seems quite slow.
For fine tuning I'm using Asset CleanUp Pro also.
 
Personally, if I am going to invest in a performance optimization plugin I would go with Flying Press instead of WP Rocket.

I am an active member of many WP page speed and performance optimization groups on Facebook as well on WP Rocket FB group and there are a lot of complaints regarding the effectiveness of WP Rocket.

Especially when it comes to CSS and JS delivery optimization as well as image optimization and, as you can imagine, these components are CRITICAL when it comes to improving a site´s performance or page loading speed.

Now, I took the liberty of checking your site´s Google PageSpeed Insights (GPSI )results and this is what I can see...

THEME

I have never heard of EasyWeb theme and it looks like it´s no longer available on ThemeForest...

https://themeforest.net/item/easywe...-and-webdesign-agencies/14881144?ref=Datasata
The theme is loading an awfully large number of resources (CSS and JS) that are not even being used...

6d913f832133f6ec5eff4913939f10b5.png

1.4 MB of unused resources JUST coming from the theme it´s a clear sign (at least to me) this is a poorly coded theme so, I would suggest changing themes to a more light-weight, fast-loading, fully customizable one.

In fact, most of the issues triggered inside GPSI when it comes to Remove Unused CSS are related to the theme...
175445935ba5d20be511e41abb2bb52a.png

These are my top choices...​
  • GeneratePress​
  • Astra​
  • Neve​
  • OceanWP​
PLUGINS
  • Visual Composer
This wouldn´t be my top choice when it comes to page builders. I prefer Elementor and even Divi before using VC.

According to Chrome DevTools, VC is loading a bit more than 500 KiB of unused resources to the page.
  • Slider Revolution
I am often against using sliders anywhere in the above-the-fold content (hero header section) as it creates too much stress especially for mobile devices and, one of the slider plugins that negatively affects performance the most is RevSlider by far.

I know it creates stunning animations that jump in the eye but that often comes with a trade-off and its usual performance.

Personally, I would use them below the fold.

According to GPSI, one of the biggest issues is Render-Blocking Resources and the biggest responsible for this are precisely Visual Composer and RevSlider...

fcf2e381b166cc2e133d3f279641e492.png

In fact, looking at the Reduce JavaScript execution time tab inside the diagnosis section on GPSI we can see more issues related to how the RevSlider and the theme deliver resources on page load...

76743218028f8a3f7f36f621cab671d1.png


EXTERNAL SCRIPTS

Your site is also executing a decent amount of scripts being downloaded from external domains...​
  • Tidio - This is a messaging app responsible for 7x HTTP requests and 271 KiB transferred during the page initial load.​
  • Google Tag Manager​
  • Google Analytics​
The last two are commonly used in most websites but, the first one, it´s not.

My recommendation is to just delay the execution of the Tidio scripts as it's not required for your site´s HTML to render properly.

This is something WP Rocket is also lacking as it´s not delaying the execution of this external script.

I advise you to try Flying Scripts which is a free plugin you can download directly from the WP repository and just input tidio and set a delay of 2 or 3 seconds.

As a side note, Flying Script was developed by the same guy of Flying Press (#justsaying)​

IMAGES

Some images loading on your homepage are NOT optimized for mobile users. Take a look at this one for example...

https://webdesignsolutionswales.com/wp-content/uploads/2021/08/webdesignsolutionswales-scaled.jpg
That image is 2560 x 1709 pixels and close to 200 KiB...That is just massive for any mobile device on a mobile connection to handle.

And, to make things even worse, that image is being displayed in the above-the-fold portion of the page which obviously triggers some LCP issues.

Another image-related issue is some of them don´t have any dimension specified in the HTML doc and, again, this is something WP Rocket should have handled.

If WP Rocket is not handling this issue, make sure this feature is enabled in the image optimization plugin (Smushit) your site is using and re-test.

FONTS

Another common issue with websites is to serve fonts from Google Fonts (external source) which also creates small performance issues as browsers need to make a DNS lookup for these resources.

Fonts are a static resource that rarely changes over time so, the best practice is to just download and host them locally.

Also, make sure to add a "fallback" attribute to fonts to avoid or prevent any FOIT issues as displayed on GPSI...

b8a9a491666515917135f873a8da4a42.png

The easiest way to do it is by using the Swap Font Display plugin. Also free and developed by Gijo (same guy from Flying Press).

And that´s pretty much it!

I hope this helps and points you in the right direction.

Cheers and stay safe!!​
 
The score is terrible indeed. You use a lot of CSS, a lot of different fonts (8!) (poppins is bad), your images are not optimized (save them as WebP). The plugins, the grid, js composer are taking up a lot of resources. Your theme is not fast.

WP Rocket is not gonne work here. I am afraid you need to start all over again (if you want a fast website that is). Use a light theme (Generatepress premium and plugin Generateblocks). Don't install unnecessary plugins. Use Generatepress together with WP Rocket and you will get a 100/100 score (with decent hosting that is).

You can make it even faster by using Cloudflare, but only the DNS (nameservers).

Check it out for your self on gtmetrix.com, and check 'waterfall'.
 
Don't you sell web development? Surely you should know this before selling a service?
 
Don't you sell web development? Surely you should know this before selling a service?
Probably, but I know absolutely nothing about Google PageSpeed, infact this is probably only my third time even using it.

But yes you are correct, I am still trying to learn a lot more though. Including my SEO knowledge which I was initially going to outsource.

I guess my main questions were WHY WPRocket was actually making the PageSpeed score worse, when I'm using optimising settings.
 
Personally, if I am going to invest in a performance optimization plugin I would go with Flying Press instead of WP Rocket.

I am an active member of many WP page speed and performance optimization groups on Facebook as well on WP Rocket FB group and there are a lot of complaints regarding the effectiveness of WP Rocket.

Especially when it comes to CSS and JS delivery optimization as well as image optimization and, as you can imagine, these components are CRITICAL when it comes to improving a site´s performance or page loading speed.

Now, I took the liberty of checking your site´s Google PageSpeed Insights (GPSI )results and this is what I can see...

THEME

I have never heard of EasyWeb theme and it looks like it´s no longer available on ThemeForest...

https://themeforest.net/item/easyweb-wp-theme-for-hosting-seo-and-webdesign-agencies/14881144?ref=Datasata
The theme is loading an awfully large number of resources (CSS and JS) that are not even being used...

6d913f832133f6ec5eff4913939f10b5.png

1.4 MB of unused resources JUST coming from the theme it´s a clear sign (at least to me) this is a poorly coded theme so, I would suggest changing themes to a more light-weight, fast-loading, fully customizable one.

In fact, most of the issues triggered inside GPSI when it comes to Remove Unused CSS are related to the theme...
175445935ba5d20be511e41abb2bb52a.png

These are my top choices...​
  • GeneratePress​
  • Astra​
  • Neve​
  • OceanWP​
PLUGINS
  • Visual Composer
This wouldn´t be my top choice when it comes to page builders. I prefer Elementor and even Divi before using VC.

According to Chrome DevTools, VC is loading a bit more than 500 KiB of unused resources to the page.
  • Slider Revolution
I am often against using sliders anywhere in the above-the-fold content (hero header section) as it creates too much stress especially for mobile devices and, one of the slider plugins that negatively affects performance the most is RevSlider by far.

I know it creates stunning animations that jump in the eye but that often comes with a trade-off and its usual performance.

Personally, I would use them below the fold.

According to GPSI, one of the biggest issues is Render-Blocking Resources and the biggest responsible for this are precisely Visual Composer and RevSlider...

fcf2e381b166cc2e133d3f279641e492.png

In fact, looking at the Reduce JavaScript execution time tab inside the diagnosis section on GPSI we can see more issues related to how the RevSlider and the theme deliver resources on page load...

76743218028f8a3f7f36f621cab671d1.png


EXTERNAL SCRIPTS

Your site is also executing a decent amount of scripts being downloaded from external domains...​
  • https://www.tidio.com/ - This is a messaging app responsible for 7x HTTP requests and 271 KiB transferred during the page initial load.​
  • Google Tag Manager​
  • Google Analytics​
The last two are commonly used in most websites but, the first one, it´s not.

My recommendation is to just delay the execution of the Tidio scripts as it's not required for your site´s HTML to render properly.

This is something WP Rocket is also lacking as it´s not delaying the execution of this external script.

I advise you to try https://wordpress.org/plugins/flying-scripts/ which is a free plugin you can download directly from the WP repository and just input tidio and set a delay of 2 or 3 seconds.

As a side note, Flying Script was developed by the same guy of Flying Press (#justsaying)​

IMAGES

Some images loading on your homepage are NOT optimized for mobile users. Take a look at this one for example...

https://webdesignsolutionswales.com/wp-content/uploads/2021/08/webdesignsolutionswales-scaled.jpg
That image is 2560 x 1709 pixels and close to 200 KiB...That is just massive for any mobile device on a mobile connection to handle.

And, to make things even worse, that image is being displayed in the above-the-fold portion of the page which obviously triggers some LCP issues.

Another image-related issue is some of them don´t have any dimension specified in the HTML doc and, again, this is something WP Rocket should have handled.

If WP Rocket is not handling this issue, make sure this feature is enabled in the image optimization plugin (Smushit) your site is using and re-test.

FONTS

Another common issue with websites is to serve fonts from Google Fonts (external source) which also creates small performance issues as browsers need to make a DNS lookup for these resources.

Fonts are a static resource that rarely changes over time so, the best practice is to just download and host them locally.

Also, make sure to add a "fallback" attribute to fonts to avoid or prevent any FOIT issues as displayed on GPSI...

b8a9a491666515917135f873a8da4a42.png

The easiest way to do it is by using the https://wordpress.org/plugins/swap-google-font-display/ plugin. Also free and developed by Gijo (same guy from Flying Press).

And that´s pretty much it!

I hope this helps and points you in the right direction.

Cheers and stay safe!!​
Thank you very much for this in depth response.

One of the first things I have done is remove revslider from the mobile version of my website. I'm going to simply have a header with text and a button.

Before changing my theme completely I am going to try and optimise this one as much as possible and if my score is still poor think about changing completely and starting from scratch.

In terms of my images I am using Smush and a Webp converter so not sure why that imagine is still showing as above. I believe it's part of revslider so would make sense that it's now gone.

Again, appreciate the response.
 
I think these values are wrong, they show low for me too, but the site is very fast, both from the phone and from the computer.
 
The score is terrible indeed. You use a lot of CSS, a lot of different fonts (8!) (poppins is bad), your images are not optimized (save them as WebP). The plugins, the grid, js composer are taking up a lot of resources. Your theme is not fast.

WP Rocket is not gonne work here. I am afraid you need to start all over again (if you want a fast website that is). Use a light theme (Generatepress premium and plugin Generateblocks). Don't install unnecessary plugins. Use Generatepress together with WP Rocket and you will get a 100/100 score (with decent hosting that is).

You can make it even faster by using Cloudflare, but only the DNS (nameservers).

Check it out for your self on gtmetrix.com, and check 'waterfall'.
What is wrong with poppins font?
 
Back
Top