This function aims to provide both function throttling and debouncing in as few bytes as possible.
-
-
Save eliperelman/1148518 to your computer and use it in GitHub Desktop.
Throttling and Debouncing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function( | |
a, // true to debounce, false to throttle | |
b, // how long to either disallow further (throttle) executions or delay the current (debounce) execution | |
c, // the callback to throttle or debounce | |
d // placeholder for holding current timeout context | |
) { | |
return function() { // return a new function that | |
if(a)clearTimeout(d); // if we are debouncing, clear the timeout and | |
if(a||!d)d=setTimeout(function() { d = null; c()}, b); // if debouncing and an operation running, | |
} // assign a new timer to run the supplied callback | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function(a,b,c,d){return function(){if(a)clearTimeout(d);if(a||!d)d=setTimeout(function(){d=null;c()},b)}} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
DO WHAT THE **** YOU WANT TO PUBLIC LICENSE | |
Version 2, December 2004 | |
Copyright (C) 2011 Eli Perelman <http://eliperelman.com> | |
Everyone is permitted to copy and distribute verbatim or modified | |
copies of this license document, and changing it is allowed as long | |
as the name is changed. | |
DO WHAT THE **** YOU WANT TO PUBLIC LICENSE | |
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION | |
0. You just DO WHAT THE **** YOU WANT TO. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "throttleAndDebounce", | |
"description": "Function throttling or debouncing.", | |
"keywords": [ | |
"throttle", | |
"debounce", | |
"function", | |
"delay", | |
"timeout" | |
] | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<title>Throttle or Debounce</title> | |
<script> | |
var throttleOrDebounce = function(a,b,c,d){return function(){if(a)clearTimeout(d);if(a||!d)d=setTimeout(function(){d=null;c()},b)}}; | |
var log = function() { | |
console.log('waiting to execute...sigh'); | |
}; | |
var debounce = throttleOrDebounce(true, 10000, log); | |
// won't log until 10 seconds of not calling debounce() have elapsed | |
debounce(); | |
debounce(); | |
debounce(); | |
debounce(); | |
debounce(); | |
var throttle = throttleOrDebounce(false, 10000, log); | |
// will log ONLY ONCE after 10 seconds have elapsed no matter how many times throttle() is called | |
throttle(); | |
throttle(); | |
throttle(); | |
throttle(); | |
throttle(); | |
throttle(); | |
throttle(); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is not useful for event handlers because the function doesn't have the arguments applied.
Also if you change the order of the arguments you could have defaults. Eg. throttle and default to a time of 100
And