What responsiveness means
Interaction to next paint measures the time from a user interaction, like a tap or key press, to the moment the screen visibly updates in response. It looks across all interactions on the page and reports a high one so a single slow response does not hide. A good value stays under two hundred milliseconds.
- It captures clicks, taps, and key presses.
- It measures end to end, including processing and the next paint.
- It replaces an older metric that only watched the first input.
The three parts of a delay
Every interaction delay splits into three pieces, and each is a target for improvement.
- Input delay is time waiting because the main thread is busy.
- Processing time is your event handlers running.
- Presentation delay is the time to compute and paint the new frame.
How to make it snappy
- Break long tasks so the main thread is free when input arrives.
- Keep event handlers light and defer non urgent work.
- Show immediate visual feedback, then finish heavier work afterward.
- Avoid large synchronous layout work inside handlers.
Key idea
Interaction to next paint reflects real responsiveness, so reduce it by freeing the main thread and keeping handlers and the next paint fast.