This article is a translation of the anti-shake and throttling sections of Glossary + Explain Like I’m Five (from Google).
Personally, I think this is one of the best explanations for throttling and anti-shaking. The rest of the article is worth reading as well.
What is debouncing and throttling?
Debouncing and throttling are too common techniques for dealing with things that happen “too often”. Imagine you’re meeting a friend, and they are telling you a story, but they struggle to pause when talking. Let’s say you want to accommodate them while also responding to what they have to say, when possible. (I know this might be a bit contrived, but bear with me!)
Debouncing and throttling are common techniques for dealing with things that happen “too often.” Imagine you’re meeting a friend and they’re telling you a story, but it’s hard for them to stop talking. Suppose you want to accommodate them where possible, while still responding to their opinions. (I know this might sound contrived, but bear with me!)
Let’s say you can never speak at the same time. You have a few strategies:
Suppose you can’t talk at the same time. You have a few strategies:
Synchronous Synchronous
You could respond to each sentence the moment they finish it:
You can respond to each sentence the moment they’re done:
This might work okay if your responses are short. But if your responses are longer, this could make it very hard for them to finish the story. So this strategy isn’t great.
If your response is brief, this may work. But if your answer is longer, it may make it difficult for them to finish the story. So that’s not a very good strategy.
Debounced stabilization
You could wait for them to stop talking. For example, if they pause for long enough, you could start responding:
You can wait for them to stop talking. For example, if they pause long enough, you can start responding:
This strategy works well if your friend is occasionally making pauses. However, if they’re talking for a few minutes without a pause, this doesn’t let you respond at all:
This strategy works well if your friend pauses occasionally. But if they speak for a few minutes without pausing, it won’t make you respond at all:
Throttled orifice
You could decide to respond at most once a minute. Here, you keep count of how long you haven’t spoken for. Once you haven’t spoken for a minute, you insert your response right after the friend’s next sentence:
You can decide to respond at most once per minute. Here, you can calculate how long you haven’t spoken. Once you haven’t spoken for a minute, you insert your answer after your friend’s next sentence:
This strategy is helpful if your friend wants you to respond as they go, but they don’t ever create pauses for you to do it. But it’s not great if they’re creating pauses but you’re still waiting out for no reason:
This strategy is useful if your friends want you to respond while they’re going, but they’ll never create a pause for you. However, if they create a pause and you still wait for no reason, that’s not good:
conclusion
Buffeting: Perform the callback again n seconds after the event is triggered. If triggered within n seconds, reset the timer;
Throttling: A high-frequency event fires, but only executes once in n seconds, so throttling dilutes the execution frequency of the function
Other related documents
- What is anti-shake and throttling? What’s the difference? How to do that?
- Underscore for JavaScript topics
- JavaScript topics follow the science of underscore