|
1 år sedan | |
---|---|---|
.. | ||
CHANGELOG.md | 1 år sedan | |
LICENSE.md | 1 år sedan | |
README.md | 1 år sedan | |
index.cjs.js | 1 år sedan | |
index.cjs.js.map | 1 år sedan | |
index.esm.js | 1 år sedan | |
index.esm.js.map | 1 år sedan | |
index.umd.js | 1 år sedan | |
index.umd.js.map | 1 år sedan | |
package.json | 1 år sedan |
Throttle and debounce functions.
This module is the same as jquery-throttle-debounce (with some differences), but it’s transferred to ES Modules and CommonJS format.
npm install throttle-debounce --save
throttle
import { throttle } from 'throttle-debounce';
const throttleFunc = throttle(1000, false, (num) => {
console.log('num:', num);
});
// Can also be used like this, because noTrailing is false by default
const throttleFunc = throttle(1000, (num) => {
console.log('num:', num);
});
throttleFunc(1); // Will execute the callback
throttleFunc(2); // Won’t execute callback
throttleFunc(3); // Won’t execute callback
// Will execute the callback, because noTrailing is false,
// but if we set noTrailing to true, this callback won’t be executed
throttleFunc(4);
setTimeout(() => {
throttleFunc(10); // Will execute the callback
}, 1200);
// Output
// num: 1
// num: 4
// num: 10
debounce
import { debounce } from 'throttle-debounce';
const debounceFunc = debounce(1000, false, (num) => {
console.log('num:', num);
});
// Can also be used like this, because atBegin is false by default
const debounceFunc = debounce(1000, (num) => {
console.log('num:', num);
});
// Won’t execute the callback, because atBegin is false,
// but if we set atBegin to true, this callback will be executed.
debounceFunc(1);
debounceFunc(2); // Won’t execute callback
debounceFunc(3); // Won’t execute callback
// Will execute the callback,
// but if we set atBegin to true, this callback won’t be executed.
debounceFunc(4);
setTimeout(() => {
debounceFunc(10); // Will execute the callback
}, 1200);
// Output
// num: 4
// num: 10
Debounce and throttle can both be cancelled by calling the cancel
function.
const throttleFunc = throttle(300, () => {
// Throttled function
});
throttleFunc.cancel();
const debounceFunc = debounce(300, () => {
// Debounced function
});
debounceFunc.cancel();
The logic that is being throttled or debounced will no longer be called.
Returns: Function
Throttle execution of a function. Especially useful for rate limiting execution of handlers on events like resize and scroll.
Type: Number
A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
Type: Boolean
Optional, defaults to false. If noTrailing is true, callback will only execute
every delay
milliseconds while the throttled-function is being called. If
noTrailing is false or unspecified, callback will be executed one final time
after the last throttled-function call. (After the throttled-function has not
been called for delay
milliseconds, the internal counter is reset)
Type: Function
A function to be executed after delay milliseconds. The this
context and all
arguments are passed through, as-is, to callback
when the throttled-function
is executed.
Type: Boolean
If debounceMode
is true (at begin), schedule clear
to execute after delay
ms. If debounceMode
is false (at end), schedule callback
to execute after
delay
ms.
Returns: Function
Debounce execution of a function. Debouncing, unlike throttling, guarantees that a function is only executed a single time, either at the very beginning of a series of calls, or at the very end.
Type: Number
A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
Type: Boolean
Optional, defaults to false. If atBegin
is false or unspecified, callback will
only be executed delay
milliseconds after the last debounced-function call. If
atBegin
is true, callback will be executed only at the first
debounced-function call. (After the throttled-function has not been called for
delay
milliseconds, the internal counter is reset).
Type: Function
A function to be executed after delay milliseconds. The this
context and all
arguments are passed through, as-is, to callback
when the debounced-function
is executed.
$.throttle
and
$.debounce
to be availableTested in IE9+ and all modern browsers.
For automated tests, run npm run test:automated
(append :watch
for watcher
support).
Original module license: Copyright (c) 2010 "Cowboy" Ben Alman (Dual licensed under the MIT and GPL licenses. http://benalman.com/about/license/)
This module license: MIT © Ivan Nikolić