How to Measure Core Web Vitals
Core web vitals is a new performance metric that will become part of the Google ranking algorithm from May 2021. in this blog, we explain how to measure core web vitals scores.
The score of core web vitals in mobile and desktop are different, so we suggest measuring the score in both devices, this will let you know which device has the lowest core web vitals of your website, each core web vitals, it is important to achieve a ‘good’ target at 90% of page load on mobile and desktop.
Core Web Vitals Measuring Tools
Core Web Vitals can now be measured using:
- PageSpeed Insights.
- Search Console.
- Chrome UX Report
- Chrome DevTools.
- Web Vitals Extension.
To understand the core web vitals of your website, it would be a good step to start with PageSpeed Insights, PageSpeed Insights will not only help you understand the core web vitals but will also show the website speed, and this tool will help in understanding the diagnostics issues of your website.
PageSpeed Insights will give you the opportunity to build your website performance score.
Google has given the options of core web vitals in the search console which tells you which core web vitals of your page are good and which core web vitals of the page have a low score.
Which page on your website is showing low core web vitals, and you can see the issues in the details section, because of which your score is low, after which you can fix the issues.
Recently Lighthouse has been upgraded to 6.0, in which a new addition new metric and audit report with performance report has been added.
If you want to know how to generate the report in the lighthouse, simple
Go to the website which is you want to generate the lighthouse report, click the mouse right button, and choose Inspect(shortcut – CTRL+SHIFT+I).
After that generate the report, and you will see the core web vitals and other factor scores and also provide diagnostic information for optimizing user experience.
Chrome UX Report
Recently Google updates the report with a new core web vitals important landing page.
This report, known as Chrome UX, is a public dataset of genuine user experience data across millions of websites.
Chrome UX report measures core web vitals that means it reports real-world data rather than laboratory data.
Chrome Devtools has recently been updated to help website owners, find and fix visual instability issues on pages that may contribute to cumulative layout shift (CLS).
if you want to view in detail in the summary tab, to see where the change itself occurred, hover over it moved from, and went to the fields.
Not only this, chrome DevTools also measure the total blocking time (TBT), which is useful for improving the first input delay (FID).
TBT shows in the footer of Chrome DevTools when you measure the performance of a page.
Web Vitals Extension
A new extension, which will now be installed in your Chrome browser, and with the help of which you can measure core web vitals in real-time.
You can download and install the extension here.
I think did you like this How to Measure Core Web Vitals…