Debounce vs throttle: what is the difference?

Definition:

Debouncing and throttling control how frequently a function runs when events arrive repeatedly. Debouncing waits for a quiet period, while throttling limits execution frequency during continued activity. They reduce unnecessary work but introduce different delays and must match the user experience.

Key points:

• Debounce waits until events stop for a short time; useful for search input.

• Throttle limits how often work runs; useful for scroll updates.

• Clear timers when the related component or task ends.

• A 300ms search debounce normally sends a request after the user pauses typing for that time.

• A throttle can report scroll position periodically even while scrolling continues; leading and trailing behavior depends on its implementation.

Interview point:

• Debouncing reduces bursts after inactivity; throttling keeps a steady maximum rate during activity.