Archived topic
High CLS and LCP
5 replies · Started by Tan on February 18, 2021
I excluded lazy-load logo and feature image but still received high CLS and LCP.
I use Perfmatters, WP-Rocket, Shortpixel, GP Premium and GB.
How could I improve it?
Thank you for your help.
Hi there,
I've ran your site through Google Lighthouse and it's getting a "Image elements do not have explicit width and height" flag but I don't see any CLS flags as indicated in this screenshot.
https://share.getcloudapp.com/OAugGZwW
As for solving the explicit width and height flag, you can add these attributes in.
Check the answer here on how to do it:
https://generatepress.com/forums/topic/how-to-set-height-and-width-for-the-logo-image/#post-1563234
As for the LCP, you're h1 containing the text "CHIẾN LƯỢC CONTENT MARKETING: HƯỚNG DẪN HOÀN CHỈNH 7 BƯỚC TỪ A-Z" is being flagged but it's not exactly straightforward as there may be other things involved. See David's brief explanation here: https://generatepress.com/forums/topic/largest-contentful-paint-on-h1-issue/#post-1345248
As for everything else, the usual optimizations should do. (compressing images, using web formats like JPEG 2000, JPEG XR, and WebP instead of PNG, minifying scripts and stylesheets, etc. )
I added width and height attributes to logo but nothing changed.
When I turn on Optimize CSS Delivery option in WP-Rocket, my Lab data score changes but Pagespeed Insight doesn't. It also increases my CLS.
Before: https://markuphero.com/share/zn8DdrbTnwJj2LJsreQW/2
After: https://markuphero.com/share/zn8DdrbTnwJj2LJsreQW
In short, my Pagespeed Insights CLS and LCP are still high :(
Hi there,
checking the PSI Lab Data CLS is currently 0
The difference between FCP times and LCP times are pretty small which means the issue is not the Largest Element but what is happening before the page is loaded.
One of the main Opportunities the PSI report provides is: Reduce initial server response times. Which is something you would want to speak to your host about...
There is one possible issue here - is that we don't know where the Google PSI test servers are located. But if you use a network testing service like GT Metrix or webpagetest you will probably see a significant difference between a test performed on a US/Canada based server vs a test performed on server closer to your host. Which means Lab Data timings can be skewed, and its only as Google collects Field Data, presumably from users in your location that you will begin to see better timings reported.
Thank you David. I think I should contact my host :)
You're welcome