INP phase breakdown
The worst synthetic interaction split into input delay, processing and presentation (lab probe).
At a glance the headline numbers for INP phase breakdown
The worst synthetic interaction split into input delay, processing and presentation (lab probe).
On the typical site, the worst interaction waits 0ms before any code runs.
Where the milliseconds go the phases at the median, against the budget
At the median the whole stack uses 49ms, inside the 200ms INP budget. The biggest piece is Presentation at 47ms, 96% of the total. computed
Why this matters for the Core Web Vitals, and where to start fixing it
An interaction spends time in three places. Input delay is the wait before your handler even starts, because the main thread was busy with something else. Processing is the handler running. Presentation is the wait after the handler, while the browser recalculates styles, lays out and paints the result.
Each phase has its own causes. Input delay points at long tasks from scripts that have nothing to do with the click. Processing points at a handler doing too much synchronously. Presentation points at the rendering cost of the update, which scales with DOM size. Fix the phase the data names. The other two will not move.
Chrome field data from 189,915 sites, representing millions of real page loads. How we measured.