A search box went from 380ms to 90ms with one tweak

A search box went from 380ms to 90ms with one tweak

INP — Interaction to Next Paint — measures how fast a page reacts when you click or type. Think of it like a waiter: a low INP means they take your order instantly; a high one means they vanish into the kitchen first.

A site had a search box that filtered results on every keystroke. Each letter triggered a heavy re-render, so INP sat at 380ms (anything over 200ms feels sluggish).

The fix was a 'debounce' — wait until typing pauses for 150ms, then filter once instead of on every key.

— Before: 12 re-renders for the word 'shoes'.
— After: 1 re-render.
— INP dropped to 90ms.

Try this: type fast in your own search field. If results stutter behind your fingers, debouncing is your fix.