Plugins

The plugins site is currently in development.

We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.

throttle


jQuery Message Queuing: Get all your JavaScript ducks in a row

With jQuery Message Queuing, you can process and manage operations on large queues of items or elements. You can throttle, giving each operation a little breathing room (firing tracking pixels, performing DOM manipulations). You can force multiple asynchronous operations to execute serially (AJAX requests). You can also get some quantity of JavaScript ducks, put them in a boat, in a line, and have them fight loudly over who gets to use the oars.

Full documentation, source, and examples are available on benalman.com.

jQuery throttle / debounce: Sometimes, less is more!

jQuery throttle / debounce allows you to rate-limit your functions in multiple useful ways. Passing a delay and callback to $.throttle returns a new function that will execute no more than once every delay milliseconds. Passing a delay and callback to $.debounce returns a new function that will execute only once, coalescing multiple sequential calls into a single execution at either the very beginning or end.

Full documentation, source, and examples are available on benalman.com.

jQuery resize event

With jQuery resize event, you can now bind resize event handlers to elements other than window, for super-awesome-resizing-greatness!

Long ago, the powers-that-be decided that the resize event would only fire on the browser's window object. Unfortunately, that means that if you want to know when another element has resized, you need to manually test its width and height, periodically, for changes. While this plugin doesn't do anything fancy internally to obviate that approach, the interface it provides for binding the event is exactly the same as what's already there for window.

Full documentation, source, and examples are available on benalman.com.

Debouncing and throttling decorators

Simple debounce and throttle implementations

Debouncing

debouncedFn = $.debounce(fn, timeout, [invokeAsap], [context]);

Example

$('input[name=suggest]').keyup($.debounce(onKeyUp, 300));

or

$('input').bind('keyup blur', $.debounce(process, 300));

Throttling

throttledFn = $.throttle(fn, period, [context]);

Example

$(window).resize($.throttle(doComplexСomputation, 300));