WEBSITE PERFORMANCE
INP migration checklist: what to ship before March 12.
On 12 March 2024, Interaction to Next Paint replaces First Input Delay in Core Web Vitals. If you are reading this after the date, the checklist still applies, just less urgently. Sites that passed FID comfortably are failing INP at a rate of roughly 1 in 3 on mobile (Chrome UX Report, Jan 2024).
Pre-flight diagnostics
Pull your p75 INP from CrUX. PageSpeed Insights shows it; CrUX API gives historical.
Install
web-vitalsJS library if not already, forward INP attribution to GA4 or your warehouse. Without attribution data you are guessing.Run the Chrome DevTools Performance panel with "Interactions" track enabled on your top 5 pages, on a throttled Moto G4 profile.
Ship-this-week list
Move non-essential scripts off the input path. Consent SDKs, analytics tags, A/B testing loaders. All should init on
requestIdleCallback, not the first click.Debounce your expensive input handlers. Search autocomplete, filter panels, currency conversion. 150ms debounce is free performance.
Wrap non-urgent state updates in
startTransition. Any React app rendering more than ~500 DOM nodes on keystroke should be using this.Audit your third-party tag count. Median ecommerce site in HTTP Archive 2023 loads 42 third-party requests. The top 5 by execution time are usually the INP problem.
Kill long tasks over 200ms. Chrome flags these automatically in the Performance panel. Break them up with
scheduler.yield()orsetTimeout(0).
The change that surprised us most
Replacing a single 340ms forEach loop that ran on product-card click with a pre-computed lookup dropped p75 INP from 480ms to 190ms on one client's PLP. One function. Nothing else changed. Always profile before refactoring.
Sources: Chrome UX Report, January 2024; web.dev INP guide; HTTP Archive Web Almanac 2023 third-party chapter.