Skip to main content

Interactions · Performance

Debounce

Also called: Debouncing, Debounced input

When an event fires over and over, hold off, and once it stops for a set time, run only the last one. Often used for search suggestions as you type.

In detail

Debounce works like "wait until you stop." Every keystroke fires an input event, and if each one calls the API, typing one word sends several requests. With a 300ms debounce, each new event restarts the timer, and the request only goes out once the user has stopped typing for a full 300ms.

Good fits: search suggestions, checking whether a username is taken as you type, recalculating the layout after a window resize ends, and autosaving drafts.

It's easy to confuse with Throttle. Debounce "runs once after you stop," and doesn't run at all during continuous activity. Throttle "runs at a fixed interval," so it runs several times on a steady beat during continuous activity. Rule of thumb: if you only care about the final result, use debounce; if you need ongoing feedback along the way, use throttle.

Developer info
Term ID
interaction-debounce
DOM selectors
No DOM cues. This concept isn't detected directly on a page.
Priority
1 · when several match at the same level, the higher priority wins
Version
v1 · updated Sep 29, 2026