Core Web Vitals

What Are Core Web Vitals?

Core Web Vitals are a set of standards defined by Google to measure three dimensions of user experience with concrete metrics. These metrics, which became ranking signals in 2021, evaluate a page's technical quality from the user's perspective.

LCP (Largest Contentful Paint) — Measures how long it takes to render the largest content element in the visible viewport. Target: 2.5 seconds or less. INP (Interaction to Next Paint) — Measures the visual response time to user interactions (clicks, keyboard input). Target: 200 ms or less. CLS (Cumulative Layout Shift) — Measures the amount of unexpected visual movement during page load and use. Target: 0.1 or less.

The Optimisation Process at Detartech

In projects built with Next.js, built-in image optimisation (next/image), font optimisation (next/font), and the Server Components architecture automatically improve LCP and CLS scores. For INP optimisation, we strategically use React's concurrent rendering features and Suspense boundaries.

Before each project delivery, comprehensive performance tests are run with PageSpeed Insights and Chrome DevTools. Lighthouse CI integration provides regression protection in the CI/CD pipeline: if Core Web Vitals scores drop below a threshold, deployment stops automatically.