RxJS — Can’t tell your flatMaps from your switchMaps?

I’ve been using switchMap and flatMap wrong. If you have too, this article may be for you…

RxJS Operators got you going through the wormhole?

Clearly I need a self-dose of RTFM. I’ve been building projects with RxJS for a few years now (reactive programming ftw). The huge array of operators and functionality is exhaustive, but, there are quite a few similarly named operators that can get you in a pickle if you don’t use them right.

While developing MaxMedia (www.maxmedia.cloud — An awesome media sharing service for post-production professionals), I had the following problem:

How do I display a loading bar, only if it takes longer than 300ms to load

Well, before we get into that …

What is Reactive Programming?

If you already know what Reactive Programming is, then feel free to skip this section. But, for you newcomers, Reactive Programming is the concept of processing of data in a stream, as it comes in.

Example — Let’s say you wish to split an incoming dynamic array into odd and even numbers.

var myArray = [1,2,3,4,5];
var evenValues = myArray.filter(i => i % 2 == 0);
var oddValues = myArray.filter(i => i % 2 == 1);