What Are Core Web Vitals?

6 min read

Core Web Vitals are Google’s way of describing three distinct parts of a page experience: loading, interactivity and visual stability. They are not a single score, and they are not a full performance audit. Instead, they act like a user-experience lens that helps you separate a page that looks fast from one that actually feels smooth.

The three metrics are LCP (Largest Contentful Paint), INP (Interaction to Next Paint) and CLS (Cumulative Layout Shift). Each one answers a different human question. When does the main content appear? How quickly does the page respond to input? Does the layout stay steady while the page loads and updates?

LCP: when the page feels loaded

LCP measures when the largest visible element in the viewport is rendered. In practice, that element is often a hero image, a headline block, or a large content section. It is a better signal of perceived loading than the moment every resource has finished downloading, because users care most about when the important part of the page becomes usable.

This is why LCP sits at the center of loading experience. A page can technically be making progress in the background while still feeling slow if the main content is delayed by images, render-blocking CSS, heavy fonts, or slow server responses. The metric is about the point where a user can look at the page and think, “now I can start reading or acting.”

It helps to think of LCP as the outcome of many upstream factors, including HTML delivery, caching behavior, image handling, and server response time. If you want a broader explanation of why pages feel slow in the first place, the article why a website feels slow to real visitors gives useful background without turning the topic into a tool tutorial.

INP: how the page responds to people

INP measures the delay between a user interaction and the next visible update the browser paints. It covers more than the very first tap or click. That matters because users do not experience a site as a single load event; they experience it as a series of actions, reactions and small waits.

A poor INP usually points to main-thread pressure. If JavaScript runs too long, if event handlers trigger expensive work, if the DOM is large and busy, or if rendering is overloaded, the browser may need extra time before it can paint the result of the user’s action. The site is technically receiving the input, but it feels sluggish because the visible response arrives late.

INP is especially important on pages with filters, menus, carts, forms and dashboards. These interfaces are judged not by how quickly they appear, but by how quickly they answer. That is why interactivity is a separate metric from loading speed: a site can produce a decent first paint and still feel frustrating the moment someone tries to use it.

CLS: why stable layouts matter

CLS captures unexpected movement in the layout. If content shifts after it has already appeared, the page becomes harder to read and easier to misclick. A user may reach for a button and hit the wrong target because an image, ad slot, cookie banner or late-loading font pushed the content somewhere else.

Layout instability is more than a cosmetic issue. It interrupts scanning, increases cognitive load and makes a site feel less trustworthy. Good visual stability means the page reserves space sensibly, so that late assets do not shove everything around.

Common causes of layout shifts

  • Images and videos without reserved dimensions.
  • Ads, embeds and widgets injected after the page starts rendering.
  • Web fonts that replace fallback text and change line height.
  • Sticky notices or banners that appear above existing content.

Field data and lab data: two different views

Core Web Vitals are often discussed alongside field data and lab data. The difference matters. Lab data comes from controlled tests with a specific device, network profile and set of conditions. Field data comes from real users in real environments, with different hardware, connection quality and browser behavior.

That is why the numbers do not always match. A page can look acceptable in a lab and still feel slower for people on weaker phones, busy mobile networks or regions far from the server. It can also happen the other way around: a synthetic test may exaggerate a problem that most visitors never notice. Both views are useful, but they answer different questions.

Field data tells you what happened to actual users. Lab data helps you explore why. Treating them as the same often leads to confusion, especially when a single snapshot suggests a neat answer that the user reality does not support.

Why one performance score is not enough

Overall performance scores are convenient, but they compress too much into one number. A site may earn a respectable score while still frustrating users with delayed interactions or unexpected shifts. Another site may look worse in a synthetic summary but feel clearer and more usable in the moments that matter.

The value of Core Web Vitals is that they separate different dimensions of experience. LCP reflects loading, INP reflects responsiveness and CLS reflects stability. Together, they show whether the page is simply fast in a technical sense or genuinely comfortable to use.

TTFB and LCP: related, not identical

TTFB stands for Time to First Byte, the moment the browser receives the first byte of the response from the server. It is not the same thing as LCP, but it can influence it. If the server is slow to respond, the browser gets HTML later, and the rest of the page often starts later too. That can push the main content further out.

Still, a good TTFB does not guarantee a good LCP. The server may answer quickly while the page still struggles with images, CSS, client-side rendering or heavy scripts. In other words, TTFB can be part of the chain, but it is not the full story. For a focused explanation of the concept, see what TTFB means in practical hosting terms.

Core Web Vitals as real UX signals

The best way to read Core Web Vitals is as a description of lived experience. They are useful because they map technical behavior to what people actually notice: whether the page arrives in time, whether it reacts smoothly, and whether it stays put while they read or tap.

That is also why a single metric should never be treated as the whole story. A page can load quickly but feel jumpy. It can be visually stable but slow to respond. It can answer clicks well but expose the main content too late. Core Web Vitals help you name those differences instead of folding them into one vague impression.

Core Web Vitals improve when content travels less and fewer elements need to be recalculated. A CDN helps with distribution, while website caching reduces delays caused by dynamic page generation.

Newsletter subscription

Subscribe for more useful content

Get updates and guides on hosting, WordPress and performance. You can unsubscribe at any time.