Skip to content

Instantly share code, notes, and snippets.

@pavan-idapalapati
Created May 22, 2019 05:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save pavan-idapalapati/c2b442c7e46958d4622ddde80981f81b to your computer and use it in GitHub Desktop.
Save pavan-idapalapati/c2b442c7e46958d4622ddde80981f81b to your computer and use it in GitHub Desktop.
Debounce and throttle functions
function throttle(callback, limit) {
var tick = false;
return function () {
if (!tick) {
callback.call();
tick = true;
setTimeout(function () {
tick = false;
}, limit);
}
}
}
// added throttle for scroll event listener
window.addEventListener("scroll", throttle(onScrollMethods, 500));
function debounce(func, wait, immediate) {
// 'private' variable for instance
// The returned function will be able to reference this due to closure.
// Each call to the returned function will share this common timer.
var timeout;
// Calling debounce returns a new anonymous function
return function () {
// reference the context and args for the setTimeout function
var context = this,
args = arguments;
// Should the function be called now? If immediate is true
// and not already in a timeout then the answer is: Yes
var callNow = immediate && !timeout;
// This is the basic debounce behaviour where you can call this
// function several times, but it will only execute once
// [before or after imposing a delay].
// Each time the returned function is called, the timer starts over.
clearTimeout(timeout);
// Set the new timeout
timeout = setTimeout(function () {
// Inside the timeout function, clear the timeout variable
// which will let the next execution run when in 'immediate' mode
timeout = null;
// Check if the function already ran with the immediate flag
if (!immediate) {
// Call the original function with apply
// apply lets you define the 'this' object as well as the arguments
// (both captured before setTimeout)
func.apply(context, args);
}
}, wait);
// Immediate mode and no wait timer? Execute the function..
if (callNow) func.apply(context, args);
}
}
// Define the debounced function
var debouncedScroll = debounce(onScrollMethods, 50);
// Call the debounced function on every mouse move
window.addEventListener('scroll', debouncedScroll);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment