Что такое throttle?

При работе с событиями браузера функция может вызываться слишком часто.

Определение

Throttle — это техника, ограничивающая выполнение функции одним вызовом за определённый промежуток времени.

Где применяется throttle

1. Обработка scroll

2. Обработка resize

3. Отслеживание движения мыши

Пример

function throttle(fn, delay) {
  let isThrottled = false;

  return function () {
    if (isThrottled) return;

    isThrottled = true;
    fn();

    setTimeout(() => {
      isThrottled = false;
    }, delay);
  };
}

Отличие от debounce

1. Throttle — выполняет регулярно

2. Debounce — выполняет после паузы

Вывод

Throttle полезен, когда важно регулярно обрабатывать события, но без перегрузки приложения.