Menu

gitpiper

throttle javascript Code Snippet in 2024

functionadvanced

Last Updated: 14 February 2024

Creates a throttled function that only invokes the provided function at most once per every wait milliseconds

  • Use setTimeout() and clearTimeout() to throttle the given method, fn.
  • Use Function.prototype.apply() to apply the this context to the function and provide the necessary arguments.
  • Use Date.now() to keep track of the last time the throttled function was invoked.
  • Use a variable, inThrottle, to prevent a race condition between the first execution of fn and the next loop.
  • Omit the second argument, wait, to set the timeout at a default of 0 ms.
const throttle = (fn, wait) => { let inThrottle, lastFn, lastTime; return function() { const context = this, args = arguments; if (!inThrottle) { fn.apply(context, args); lastTime = Date.now(); inThrottle = true; } else { clearTimeout(lastFn); lastFn = setTimeout(function() { if (Date.now() - lastTime >= wait) { fn.apply(context, args); lastTime = Date.now(); } }, Math.max(wait - (Date.now() - lastTime), 0)); } }; };
window.addEventListener( 'resize', throttle(function(evt) { console.log(window.innerWidth); console.log(window.innerHeight); }, 250) ); // Will log the window dimensions at most every 250ms

javascript snippet similar to throttle For You in February 2024

Subscribe to our Newsletter

Subscribe to get resources directly to your inbox. You won't receive any spam! ✌️

© 2024 GitPiper. All rights reserved

Rackpiper Technology Inc

Company

About UsBlogContact

Subscribe to our Newsletter

Subscribe to get resources directly to your inbox. You won't receive any spam! ✌️