Understanding Core Web Vitals

What Are Core Web Vitals?

Core Web Vitals are a set of real-world performance metrics that Google uses as ranking signals. They measure how users actually experience your page — loading speed, interactivity, and visual stability. Since the Page Experience update, these metrics directly influence your search rankings.

There are three Core Web Vitals:

LCP — Largest Contentful Paint

LCP measures how long it takes for the largest visible element on the page to load. This is usually a hero image, a large heading, or a video thumbnail. A good LCP is 2.5 seconds or less.

How to improve LCP:

• Optimize and compress images (use WebP format)
• Add loading="eager" and fetchpriority="high" to your hero image
• Use a fast hosting provider and CDN
• Eliminate render-blocking CSS and JavaScript
• Enable server-side caching

INP — Interaction to Next Paint

INP replaced FID (First Input Delay) in March 2024. It measures the delay between a user interaction (click, tap, keypress) and the next visual update on screen. A good INP is 200ms or less.

How to improve INP:

• Minimize JavaScript execution time — break up long tasks
• Defer non-critical JavaScript
• Avoid heavy third-party scripts (ads, chat widgets, analytics)
• Use requestAnimationFrame for visual updates

CLS — Cumulative Layout Shift

CLS measures how much the page layout shifts unexpectedly during loading. If elements jump around as the page loads (e.g. an ad pushes content down), that's a high CLS. A good CLS score is 0.1 or less.

How to improve CLS:

• Always set explicit width and height attributes on images and videos
• Reserve space for ads and embeds with fixed-size containers
• Avoid inserting content above existing content after page load
• Use font-display: optional to prevent font-swap shifts

How to Measure Core Web Vitals

• Google Search Console — Core Web Vitals report shows field data from real users
• PageSpeed Insights — Combines lab and field data with specific recommendations
• Chrome DevTools — Performance tab for local testing
• Lighthouse — Built into Chrome, gives a full performance audit