Core Web Vitals are a set of standardized, user-centric performance metrics defined by Google that measure real-world page experience in the browser. They directly influence search ranking and reflect how fast, stable, and responsive a web page feels to actual users.
Core Web Vitals are three specific metrics: Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS). Each metric targets a distinct dimension of user experience — loading speed, interactivity, and visual stability respectively. Google treats them as a subset of its broader Page Experience signals used in search ranking algorithms.
LCP measures how long it takes for the largest visible content element — typically a hero image or main heading — to fully render in the viewport. A good LCP score is under 2.5 seconds from when the page first starts loading. Common culprits for poor LCP include render-blocking resources, slow server response times (TTFB), and unoptimized images lacking modern formats like WebP or AVIF.
INP replaced First Input Delay (FID) as the interactivity metric in March 2024 and measures the latency of all user interactions — clicks, taps, and keyboard inputs — throughout the entire page lifecycle. It reports the worst-case interaction delay observed, making it more comprehensive than FID, which only measured the first interaction. A good INP score is under 200 milliseconds; long JavaScript tasks on the main thread are the primary cause of poor scores.
CLS quantifies unexpected visual movement of page elements during loading by summing the impact fraction multiplied by the distance fraction for each layout shift event. A good CLS score is under 0.1. Images without explicit width and height attributes, dynamically injected banners, and web fonts causing text reflow are the most frequent sources of high CLS scores.
Metrics can be collected as either lab data (simulated, using tools like Lighthouse or WebPageTest) or field data (real user telemetry via the Chrome User Experience Report or the web-vitals JavaScript library). Google Search Console's Core Web Vitals report surfaces aggregated field data per URL group. For ranking purposes, Google uses field data, so lab scores alone can be misleading if your real user conditions differ significantly.
A critical gotcha is that Core Web Vitals are assessed at the 75th percentile of real user sessions, meaning you must optimize for slower devices and connections, not just your own fast hardware. Prioritize LCP by preloading hero images with a fetchpriority='high' attribute, reduce INP by breaking up long tasks with scheduler.yield() or setTimeout chunking, and prevent CLS by always reserving space for ads, embeds, and images using aspect-ratio CSS. Continuously monitor field data because single-page app navigations and third-party scripts can silently degrade scores over time.
© RM Full Stack & AI Engineer · All guides · Roadmaps · Open the app