JavaScript9 min read

JavaScript Debounce and Throttle

Master debounce and throttle. Control how often functions execute for performance.

Alex Thompson
December 19, 2025
0.0k0

JavaScript Debounce and Throttle

Debounce: Wait for Pause

Execute after user stops:

```javascript function debounce(func, delay) { let timeout; return function(...args) { clearTimeout(timeout); timeout = setTimeout(() => func(...args), delay); }; }

const search = debounce(handleSearch, 300); ```

Throttle: Limit Frequency

Execute at most once per period:

```javascript function throttle(func, limit) { let inThrottle; return function(...args) { if (!inThrottle) { func(...args); inThrottle = true; setTimeout(() => inThrottle = false, limit); } }; } ```

Key Takeaway

Debounce waits for pause. Throttle limits frequency. Both improve performance. Essential for scroll/resize handlers.

#JavaScript#Debounce#Throttle#Performance#Advanced