DEV Community

Cover image for D is for debounceTime
Julian Dierkes
Julian Dierkes

Posted on

2 1

D is for debounceTime

Welcome back! Today it is time for...

...two seconds later...

No NOW is time for...
The debounceTime operator!

What does it do?

It takes your source observable and starts a timer when a value is emitted. (The time is specified in milliseconds)
If no new value occurs before the timer finishes, debounceTime emits the value.
If a new value occurs nothing is emitted and the timer is reset and started again.

What kind of problems does this solve?

It is mostly used for performance improvements, e.g.

  1. A line chart with panning and/or zooming functionality. You don't want to fetch new data on every pan/zoom interaction. Instead you want to fetch the data when the users has stopped scrolling or panning for a specified amount of time.

    zoomChanged
        .pipe(debounceTime(200))
        .subscribe(newTimeWindow => fetchChartData(newTimeWindow))
    
  2. Fetching data for an autocomplete input. You don't want to fetch the autocomplete data matching the current user input on each character the user enters. You want to fetch them when the users stops typing for a specified amount of time.

    userInputChanged
        .pipe(debounceTime(200))
        .subscribe(userInput => fetchFilteredAutocompleteValues(userInput))
    

Pretty useful right?

Stay tuned for more RxJS glory!

Speedy emails, satisfied customers

Postmark Image

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

AWS GenAI LIVE!

GenAI LIVE! is a dynamic live-streamed show exploring how AWS and our partners are helping organizations unlock real value with generative AI.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️