<b>The 3 parts hiding inside a slow interaction</b>

<b>The 3 parts hiding inside a slow interaction</b>

When INP — Interaction to Next Paint — is poor, 'my site is laggy' isn't specific enough to fix. Like LCP, every interaction splits into three pieces, and knowing which is fat points you straight at the cause.

The three parts:
— <b>Input delay</b> — the wait before your code even starts, usually because the browser is busy with other scripts
— <b>Processing time</b> — how long your click handler's own code runs
— <b>Presentation delay</b> — the time to repaint the screen with the result

Think of ordering coffee: waiting for the barista to notice you, the brewing, then actually handing it over.

How to read it:
— Chrome DevTools' Performance panel labels these phases for each interaction

<b>Try this:</b> Record one slow click. If input delay is the biggest slice, the fix is reducing other scripts; if processing is, the fix is your own handler. Different slice, different repair.