Андрей Мотошин Front-end engineer

Пара слов о limit.js

#javascript

В своей предыдущей заметке я описал способ, как можно избежать слишком частого выполнения функций, привязанных к событиям.

После этого я нашел как минимум два способа сделать то же самое:

  1. Маленькая библиотечка limit.js
  2. Полноценная библиотека Underscore.js.

Limit.js — это библиотека состоящая всего из двух методов: debounce и throttle. В Underscore.js методы называются так же и решают те же задачи, но имеют немного иную реализацию. Я опишу методы limit.js.

Задача debounce: дождаться, когда после вызова функции пройдет N миллисекунд и выполниться один раз. Если до выполнения вы успеете вызвать её ещё раз, то счётчик времени сбросится, функция не выполнится и будет ждать следующего шанса. Мне нравится использовать её вместе с событием resize, чтобы перерисовать интерфейс один раз по завершении растягивания окна пользователем.

throttle выполняет функцию, пока вы её вызываете, но не чаще чем каждые N миллисекунд. Его, мне кажется, лучше использовать с событием mousemove, чтобы отфильтровать слишком частое срабатывание и перерисовку интерфейса.

limit.js расширяет прототип объекта Function, поэтому новые методы появятся у всех функций:

function(){}.throttle(100);

А в Underscore.js это делается через обертку:

_.throttle(function(){}, 100);

Ссылки