CodePark/ questions / Core Web Vitals
START PRACTICINGPRACTICE
Frontend question · Browser & web performance › Core Web Vitals

What are the Core Web Vitals and what does each one measure?

The Core Web Vitals are Google's three user-focused metrics. They measure loading, responsiveness and visual stability.

LCP (Largest Contentful Paint) measures loading. It is the time until the largest image or text block in the viewport is rendered.

INP (Interaction to Next Paint) measures responsiveness. It is the delay from a click, tap or key press until the next frame is painted. The reported value is roughly the worst interaction during the visit. INP replaced FID (First Input Delay) in March 2024.

CLS (Cumulative Layout Shift) measures visual stability. It is how much visible content moves unexpectedly, for example text jumping down when an ad loads.

The "good" thresholds are:

  • LCP at most 2.5 s
  • INP at most 200 ms
  • CLS at most 0.1

Google checks these at the 75th percentile of real page loads. So 75% of visits must meet the threshold.

  • LCP measures loading: when the largest element in the viewport is rendered.
  • INP measures responsiveness across all interactions, and it replaced FID in March 2024.
  • CLS measures unexpected layout shifts.
  • Good means LCP at most 2.5 s, INP at most 200 ms and CLS at most 0.1, at the 75th percentile.