| id | mainCompare | focusOn | lesson | video | compare | learnBackAbout | learnAbout | title | layout | class | preview_image | preview_image_alt | ||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
debounceTime |
debounceTime |
delay |
12 |
245691062 |
|
delay |
throttleTime |
Rate-limiting debounceTime vs delay in RxJS |
default |
post |
debounceTime/content_preview.jpg |
The "debounceTime" operator |
If your stream is created from key presses or mouse movements, you'll likely deal with bursts of events. But you can't react to every single event, as it would overload the CPU or flood the servers with too many requests.
A strategy is to wait for a certain "emission silence" window of time (where the user has stopped typing or moving his mouse) to actually handle the latest word or mouse position.
To do so, you can use ❚ debounceTime. Like delay, it waits for a certain time period and delays events. But debounceTime can also ignore events.
They both accept a time period argument, such as 3000 milliseconds.
debounceTime is a rate-limiting operator. It ignores events but also delays others.
{:.w350}
The time period is small enough that no events are ignored
{:.w350}
With a 3000ms time period, some events are ignored
{:.w350}
As the time period gets larger, even more events are ignored
{:.w300}