Core Web Vitals in 2025: What Actually Moves the Needle

Google's Core Web Vitals are no longer a nice-to-have. They're a ranking factor, and the thresholds have gotten tighter. Most guides you'll find are still referencing FID — a metric Google deprecated in March 2024. INP (Interaction to Next Paint) replaced it, and it measures something harder to optimize.

INP: the new bottleneck

FID measured the delay before the browser could start processing an interaction. INP measures the full duration from input to the next paint — including JavaScript execution and rendering. This means heavy client-side React components, large event handlers, and anything that blocks the main thread are now directly measurable liabilities.

LCP: where most sites fail

Largest Contentful Paint should be under 2.5 seconds. The biggest lever is your hero image or above-the-fold element. Preload it explicitly, use modern formats (AVIF or WebP), serve from a CDN with correct Cache-Control headers, and ensure it's not blocked by render-blocking scripts. A correctly configured Next.js Image component with `priority` gets you most of the way there.

CLS: the invisible problem

Cumulative Layout Shift catches movement that happens after the page loads. The culprits are always the same: images without explicit dimensions, ads and embeds without reserved space, dynamically injected content above existing content, and web fonts causing text reflow. Fix dimensions, use `font-display: optional`, and reserve space for async-loaded content.

The Next.js-specific wins

Server Components eliminate client-side JavaScript for static content, directly improving INP. The `next/image` component handles lazy loading, sizing, and format optimization automatically. `next/font` eliminates font-related CLS entirely. Turbopack dramatically reduces development compilation times, which doesn't affect prod scores but does make iterating on performance fixes faster.