All posts
postApril 7, 2026

Debounce — Control High-Frequency Events

#javascript#performance#debounce#events
Debounce — Control High-Frequency Events — slide 1
javascript
function debounce(fn, delay) {
  let timer;
  return function(...args) {
    clearTimeout(timer);
    timer = setTimeout(() => fn.apply(this, args), delay);
  };
}

const search = debounce((query) => {
  console.log('Searching:', query);
  fetch(`/api/search?q=${query}`);
}, 300);

// Only fires 300ms after the user stops typing
input.addEventListener('input', e => search(e.target.value));