Что такое Debouncer

Debouncer — это функция, которая откладывает вызов целевой функции до тех пор, пока не пройдет определенное время без новых вызовов. Полезно для оптимизации частых событий (например, ввод в поисковую строку, изменение размеров окна).

Пример реализации на JavaScript:

function debounce(func, delay) {
  let timeoutId;
  return function(...args) {
    clearTimeout(timeoutId);
    timeoutId = setTimeout(() => func.apply(this, args), delay);
  };
}

// Использование
const handleInput = debounce((value) => {
  console.log('Search for:', value);
}, 300);

inputElement.addEventListener('input', (e) => handleInput(e.target.value));

Ключевые моменты:

• Отменяет предыдущий отложенный вызов при новом событии
• Гарантирует выполнение только после паузы в событиях
• Сохраняет контекст (this) и аргументы оригинальной функции