Web Vitals are a subset of performance factors within Lighthouse reports that aim to understand how your web pages perform in front of real users. Web Vitals consist of three critical components, including Cumulative Layout Shift, Largest Contentful Paint, and Total Blocking Time. Together, these three components make half of the weight of the Lighthouse performance score and are focused on measuring visual stability (Cumulative Layout Shift), page load performance (Largest Contentful Paint), and overall interactivity (First Input Delay). And within each of these metrics, there are several factors and elements that make up their respective scores within Lighthouse, but all of them focus on the above-the-fold content, which is a key indicator of how your page performance is perceived from the user’s perspective.
In the following sections, we will talk in more detail about how each of these metrics are calculated, how they affect the user experience, and what web developers can do to optimize content to reduce page load times for visitors to improve the overall Lighthouse score.
