Lighthouse: What are Web Vitals and How to Improve Them?
Overview
Web Vitals are a set of Google metrics focused on loading speed, interactivity, and visual stability. They highlight the most important factors for page experience.
How does your site score on this metric?
What are the Different Web Vitals?
Web Vitals in GTmetrix focus on three Performance Score metrics, namely:
Each metric represents a key facet of the page experience, namely loading, interactivity, and visual stability.
In addition to the above, Interaction to Next Paint (INP) is another key field-only metric in the Web Vitals set.
Since INP is derived from the Chrome User Experience Report (CrUX), it cannot be measured in the lab in GTmetrix.
INP is available as part of our field data reporting in the CrUX tab of the GTmetrix Report.
Learn more about viewing field (CrUX) data in GTmetrix.
Why are Web Vitals Important?
There are a whole host of performance metrics available and it may be difficult to understand which ones to analyze and optimize, unless you are an advanced developer.
Web Vitals serve as a simplified benchmark for user experience in terms of perceived performance, interactivity, and delightfulness.
This smaller set of metrics should be the first to focus on when you consider your page performance as they account for Performance Score.
Additionally, Web Vitals are representative of what your visitors first see in their viewports when they visit your page i.e., above-the fold content. What they see first ultimately influences their perception of your page's performance.
INP further covers how well your page responds to typical user interactions, allowing you to improve your visitors' page experience beyond the initial load.
Focusing on these metrics first allows you to yield size-able gains in perceived and actual performance for the majority of your visitors, before needing to dig deeper into other optimizations.
Learn more about Web Vitals.