Core Web Vitals in 2026: why INP is the metric to fix first

Core Web Vitals are Google's measures of how a page feels to real visitors: how fast the main content appears (LCP), how much the layout jumps around (CLS) and how quickly the page responds when you interact with it (INP). In March 2024, Interaction to Next Paint replaced First Input Delay, and it is the one most sites now fail.

Why INP is harder than FID

First Input Delay only measured the delay before the browser started handling the first tap or click. A page could pass while every later interaction felt sluggish. INP looks at interactions across the whole visit and reports one of the slowest, from the click until the next frame is painted. It measures the slowness people actually notice: a menu that takes half a second to open, a filter that freezes the page, an "add to cart" that seems to do nothing.

Google's thresholds: 200 ms or less is good, up to 500 ms needs improvement, and anything slower is poor.

What usually causes poor INP

• Long tasks on the main thread. Any JavaScript that runs for more than about 50 ms blocks the browser from responding.
• Third-party scripts. Chat widgets, heat maps, ad and tracking tags often run work on every interaction.
• Page builders and plugin stacks that attach many listeners and re-render large parts of the page.
• Heavy visual effects such as large blur filters or animating box shadows, which make every frame expensive to paint.

How I fix it

1. Measure field data first. Search Console's Core Web Vitals report and PageSpeed Insights show real-user INP. Lab tests alone miss it.
2. Find the slow interaction. Record a performance trace in Chrome DevTools while clicking the slow element, and look for long tasks.
3. Do less on interaction. Update the visible state first, then defer the expensive work.
4. Break up long tasks so the browser can paint in between, and move heavy work off the main thread where you can.
5. Load third parties later. Delay chat and tracking scripts until after the first interaction or when the browser is idle.
6. Make effects cheap. Animate transforms and opacity, avoid repainting large blurred or shadowed areas on every frame, and pause animations that are off screen.

Do not forget LCP and CLS

• LCP: serve the hero image in a modern format at the right size, preload it, and do not lazy-load what is above the fold.
• CLS: give images and embeds explicit width and height, and reserve space for banners before they load.

On one clinic landing page, compressing images, deferring third-party scripts and trimming unused CSS took the desktop PageSpeed score to 97. On a surgeon's site, before-and-after galleries that were blank on phones came back after the sliders were initialised at the right moment and 3 MB images were compressed.

The takeaway

Good INP is mostly about restraint: less JavaScript running when people interact. Every script, widget and effect has a cost, and visitors pay it on every tap.