Core Web Vitals: what they are and how to improve them

Core Web Vitals are a set of metrics developed by Google that measure the real user experience on a website — how fast it loads, how well it responds to interaction, and whether the layout stays stable. These indicators affect not only visitor satisfaction but also a site's position in Google Search, as they are part of the ranking signals. There are three core metrics: LCP, INP, and CLS.

LCP — Largest Contentful Paint

Largest Contentful Paint measures the time at which the largest content element in the visible area is rendered — usually the main image or heading block. It reflects how quickly a user sees the page's primary content. A good LCP score is 2.5 seconds or less.

To improve LCP, optimize images using modern formats such as WebP or AVIF, and specify their dimensions. Use a content delivery network (CDN), implement caching, and reduce server response time. Load critical resources with priority while deferring non-essential scripts.

INP — interaction responsiveness

Interaction to Next Paint replaced the previous FID (First Input Delay) metric in 2024. INP measures how quickly the page visually responds to user actions — clicks, taps, and key presses — throughout the entire visit. A good INP is below 200 milliseconds.

The main enemy of INP is heavy JavaScript that blocks the main thread. Break long tasks into smaller ones, defer non-critical code, reduce the number of third-party scripts, and use web workers for complex computations. The less work the browser has to do at the moment of interaction, the faster the response will be.

CLS — Cumulative Layout Shift

Cumulative Layout Shift measures visual stability — how much elements move unexpectedly while the page loads. Everyone has experienced trying to tap a button only to have an ad or image suddenly push the content down. A good CLS score is 0.1 or less.

To prevent shifts, always specify image and video dimensions (width and height), reserve space for ads and embedded content, and avoid inserting content above already visible elements. Load fonts in a way that doesn't cause text to reflow.

How to measure and improve

There are two types of data: lab data and field data. Lighthouse and PageSpeed Insights provide lab measurements in a controlled environment, while the Chrome User Experience Report (CrUX) aggregates data from real users. Google uses field data for ranking, so trust the CrUX figures.

Start with PageSpeed Insights, which combines both data types and offers concrete recommendations. The "Core Web Vitals" report in Search Console shows issues across the entire site. A practical order of improvements: optimize images, minify and defer JavaScript, implement caching and a CDN, and stabilize the layout. Measure after each change, because optimization is a continuous process.