Ответ
Throttling (дросселирование) — это паттерн, ограничивающий частоту выполнения функции или обработки событий, чтобы предотвратить перегрузку системы. Он гарантирует, что функция будет вызываться не чаще, чем раз в заданный период времени.
Основное применение:
- Ограничение частоты запросов к API.
- Обработка событий с высокой частотой (например, скролл, изменение размера окна).
- Защита от злоупотреблений (rate limiting).
Пример реализации на JavaScript:
function throttle(func, limit) {
let inThrottle;
return function(...args) {
if (!inThrottle) {
func.apply(this, args);
inThrottle = true;
setTimeout(() => inThrottle = false, limit);
}
};
}
// Использование: обработчик скролла сработает не чаще, чем раз в 100 мс
window.addEventListener('scroll', throttle(() => {
console.log('Scroll position:', window.scrollY);
}, 100));Отличие от Debouncing:
- Throttling выполняет функцию с регулярными интервалами, пока происходит событие.
- Debouncing выполняет функцию только после того, как событие прекратилось на заданное время.
Ответ 18+ 🔞
А, ну вот, смотри, опять эти ваши умные слова: «дросселирование», «паттерн». А по-простому, это когда ты, такой весь из себя, пытаешься на каждое чихание браузера отреагировать, а система тебе говорит: «Остынь, мудила, не чаще раза в секунду, а то я сейчас накроюсь медным тазом».
Короче, зачем это нужно, чтобы не еб... не перегрузить систему:
- Ты там API какого-нибудь дергаешь, как последний извращенец, а он тебе в ответ: «Иди на хуй, больше трёх запросов в секунду не принимаю».
- Пользователь скроллит страницу, а у тебя на каждый пиксель скролла какая-то тяжёлая хуйня запускается. Браузер просто взвывает: «Да ёпта, хватит!».
- Ну и от дураков защита, которые думают, что если тыкать в кнопку «Отправить» со скоростью пулемёта, то быстрее отправится.
Вот, смотри, как это в коде выглядит, простейший вариант:
function throttle(func, limit) {
let inThrottle;
return function(...args) {
if (!inThrottle) {
func.apply(this, args);
inThrottle = true;
setTimeout(() => inThrottle = false, limit);
}
};
}
// Применяем: теперь при скролле сообщение в консоль будет вываливаться не чаще, чем раз в 100 мс, а не как сумасшедший граммофон.
window.addEventListener('scroll', throttle(() => {
console.log('Scroll position:', window.scrollY);
}, 100));И главное, не путай с другим зверем — Debouncing!
- Throttling (наш герой) — это как строгий охранник: «Раз в N миллисекунд — и ни шагу больше!». Событие идёт потоком, а функция срабатывает чётко по таймеру.
- Debouncing — это уже хитрая жопа. Он ждёт, пока ты, наконец, успокоишься и перестанешь дёргаться. Только после паузы он выполнит действие ОДИН РАЗ. Представь, что ты ищешь что-то в поиске: ты печатаешь, а запрос улетает не на каждую букву, а только когда ты, блядь, на полсекунды остановился.
Вот и вся разница, ебушки-воробушки. Throttling — для регулярности, Debouncing — для конечного результата после суеты. Выбирай, что тебе больше подходит, чтобы не получить пизды от производительности.