Dettle Batch

A batched debouncing and throttling solution, for performance.

This allows you to construct debounce and throttle functions based on dettle where multiple callbacks using the same options are scheduled together, so a single timeout is used to schedule all of them, rather than one for each.

Install

1npm install dettle-batch

Usage

1import {createDebounce, createThrottle} from 'dettle-batch';
2
3// Let's debounce multiple handlers for the same DOM event together, for performance
4
5const debounce = createDebounce ();
6
7document.addEventListener ( 'focusin', debounce ( onFocusChange1, 50 ) );
8document.addEventListener ( 'focusout', debounce ( onFocusChange1, 50 ) );
9document.addEventListener ( 'focusin', debounce ( onFocusChange2, 50 ) );
10document.addEventListener ( 'focusout', debounce ( onFocusChange2, 50 ) );
11
12// Let's throttle multiple handlers for the DOM event together, for performance
13
14const throttle = createThrottle ();
15
16document.addEventListener ( 'focusin', throttle ( onFocusChange1, 50 ) );
17document.addEventListener ( 'focusout', throttle ( onFocusChange1, 50 ) );
18document.addEventListener ( 'focusin', throttle ( onFocusChange2, 50 ) );
19document.addEventListener ( 'focusout', throttle ( onFocusChange2, 50 ) );

License

MIT © Fabio Spampinato