Archived topic
Please help me fix Avoid Large Layout Shift
7 replies · Started by Pintu on May 7, 2022
Hi, can you tell me how to fix the 'Avoid Large Layout Shift' warning in GTMatrix and PageSpeed Insights? The mobile page speed score is very good (90+) but on the desktop, it is around 80. Can you help me make the score 90+ on both? The site is hosted on Cloudways and for caching I'm using WP Rocket. Thanks
Hi there,
can you share a link to the site ( page ) where we can see the CLS issue ?
When I test your site with WP Rocket disabled ( by adding the ?nowprocket query string to the URL ) then the CLS is virtually 0.
The main issue looks to be related to WP Rocket adding display=swap to the font loading. I would suggest you change this to auto - see here:
https://docs.wp-rocket.me/article/1312-optimize-google-fonts
And for better performance you may want to load the fonts locally
Okay. Thanks
You're welcome
Hi, David. I'm now using system font on my site and ditched Google font altogether. However, there are still 5 elements causing a Large Layout Shift. Can you please check my site again and help me fix those. I know these shifts have very little impact on my site's overall speed and ranking. But I want to see if I could make the CLS 0 and get a perfect 100 score or not - it's a dream :) So, please make this dream come true.
You will need to check with WP Rocket, as again if i test the site with WP Rocket disabled the CLS disappears.
