Mastering RxJS: operators and functions that can bite you when you don’t expect

The things you may not pay attention to but they are good to know

Photo by Lucas Vasques on Unsplash

Prerequisites:You should be familiar with RxJS and have some practical experience in using it.

#1. fromFetch functionvs ajax const

RxJS lib has two ways to wrap network request in Observable. And They have difference:

fromFetchfunction — uses the Fetch API to make an HTTP request.

snippet link

2. ajaxfunction — use XhrHttpRequest under the hood

snippet link

Both return Observable so we expect unfinished network request should be canceled on unsubscribe. Usually it works like that but there is small remark in the official documentation for fromFetch :

WARNING Parts of the fetch API are still experimental. AbortController is required for this implementation to work and use cancellation appropriately.

Will automatically set up an internal AbortController in order to teardown the internal fetch when the subscription tears down.

So beware if you use it in IE11 browser since AbortController is not supported there .

*Remark from Nicholas Jamieson : there is a problem with the current implementation of ` fromFetch `. See this issue .

#2. forkJoin vs zip

There is a nice tweet of Reactive Fox :rocket: “If you know Promise you already know RxJS”: