В чем разница между throttleTime и debounceTime в rxjs и когда выбирать, какой?

Question

Я пытаюсь понять throttleTime против debounceTime и какой из них использовать, когда?

У меня есть кнопка upvote, которая отправляет запрос API бэкэнду (который подсчитывает голоса). Пользователь может отправить кнопку несколько раз, но я бы хотел ограничить время нажатия кнопки в секунду.

Я знаю, что операторы throttleTime и debounceTime могут это сделать, но какой из них выбрать лучше?

const upvoteClicks = fromEvent(this.el.nativeElement, 'click')
 .pipe(debounceTime(500))
 .subscribe(() => this.myService.postUpvote(this.postId));

Answer 1

Я думаю, что в вашем случае throttleTime работает немного лучше, потому что вы хотите сделать запрос API, как только пользователь нажмет кнопку.

И throttleTime, и debounceTime игнорируют событиякоторые приходят между тем, но throttleTime испускает сразу, а debounceTime ждет дополнительной задержки.

Вы можете визуально это хорошо увидеть на https://rxmarbles.com

Более того, throttleTime против debounceTime в RxJS В статье представлен хороший обзор обоих операторов.