0

Goal: User moves the slider, and the slider value is sent to the server to calculate some value X, displayed next to the slider and updated gradually as slider value changes.

What I did: used throttled Subject, switchMap'ped to fetch the value:

sliderMoved$.pipe(
    throttleTime(200),
    switchMap(sliderVal => server.calculateX(sliderVal)
)

It does the job, but

The Problem: if server responds longer than throttle time, the switchMap operator cancels the previos call. Thus slow movement of the slider results in sequence of cancelled requests, and value gets updated only when user stops sliding.

Needed Improvement: for every server call I need to wait until the response comes, update the displayed value X, and then fire the new call with the latest value of the slider. If user stopped sliding when there was a pending request, a last one request with latest slider value has to be made.

(or if you have better idea how it should work)

eagor
  • 9,150
  • 8
  • 47
  • 50
  • 3
    Replace switchMap with exhaustMap. – Ingo Bürk May 04 '19 at 13:33
  • Brilliant! thank you! But how to finish with one more request sending the final slider value? – eagor May 04 '19 at 14:04
  • Do you have a separate event for "let go of slider"? If not then according to your requirements this is impossible since we cannot know what a "final" value is. – Ingo Bürk May 04 '19 at 19:18
  • 1
    (You can also use mergeMap, which will make the same number of requests as switchMap, but not cancel them. Or concatMap, does the same but ensures requests cannot overtake each other similarly to how switchMap ensures it by canceling them.) – Ingo Bürk May 04 '19 at 19:19
  • added additional event. Thanks so much for your help! – eagor May 05 '19 at 08:16

0 Answers0