Menu
from the lodash documentation:
Throttle
Creates a throttled function that only invokes func at most once per every wait milliseconds
Debounce
Creates a debounced function that delays invoking func until after wait milliseconds have elapsed since the last time the debounced function was invoked
I am a little bit confused about these two definitions, it sounds that they are similar.
Can someone give us a simple explanation with examples.
706
It's simple. They do the exact same thing (rate limiting) except while throttle is being called it'll fire your wrapped function periodically, while debounce only fires once at the end. Example: If you're scrolling, throttle will slowly call your function while you scroll (every X milliseconds).
throttle() method in lodash is used to create a throttled function that can only call the func parameter maximally once per every wait milliseconds.
The Lodash debounce function returns a debounced function that when called will execute a function after X milliseconds pass since its last execution.
In JavaScript, a debounce function makes sure that your code is only triggered once per user input. Search box suggestions, text-field auto-saves, and eliminating double-button clicks are all use cases for debounce.
The lodash docs link to the article Debouncing and Throttling Explained Through Examples.
From that article:
The Debounce technique allow us to "group" multiple sequential calls in a single one.
By using _.throttle, we don't allow to our function to execute more than once every X milliseconds.
The main difference between this and debouncing is that throttle guarantees the execution of the function regularly, at least every X milliseconds.
The article explains the differences clearly using prose and diagrams.
58
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
