PageSpeed ​​Insights screenshots LCP and CLS elements May 1, 2021 by Anil Patil

PageSpeed Insights now visually displays LCP and CLS elements as screenshots.
This is a function implemented by Lighthouse.

Visually check the LCP and CLS elements

You can visually see the LCP and CLS elements in the PageSpeed Insights validation results.

Checking LCP elements

The ” Draw Maximum Content” element represents the element that is subject to LCP.
Thumbnail images are posted with HTML code.

Pagespeed Insights LCP

Click the thumbnail image to enlarge.

Google Pagespeed Insights LCP Score

Article first paragraph are subject to LCP

Checking CLS elements

“Keep the layout unchanged” represents an element of CLS.
Thumbnail images are posted in the same way as LCP.

Pagespeed Insights cls

Although it is minute, it was recognized that it caused a layout shift.

It’s much easier to see which element corresponds to LCP or CLS while it’s displayed on the page, compared to just the HTML code.

1 month half extended However, the core web vital is incorporated into the line King factors approaching the day.
It is very helpful that the tools used for improvement become easier to use.

Next article: [Top 5] Best SEO tools for blogger to easily rank your website.

Leave a Reply

Your email address will not be published. Required fields are marked *