RxJS!

Featured image

RxJS

We continue part II

Patterns

Pattern observer

To all this, I don’t know if you have heard of it, maybe you felt it in some class at school… but yes, exactly, observer is one of the most known design patterns. And RxJS has its bases in these 2 patterns: observer and iterator.

So, the observer pattern, is simple, it has an object, called subject (subject), which has a state. If this state changes, this subject has the ability to “notify” its subscribers (observers) of this change. NOISE!

enter image description here

Note: this “subject” we are talking about, is our famous Subject, it will be our way to make a “multi diffusion” of values or events, to multiple Observers.

many values *towards -> many observers**.

** Pattern Iterator

The second pattern on which RxJS is based, is the Iterator. The purpose of this pattern is that it allows us to be able to access the elements of an object, in a sequential way. Who does what? It allows a collection a means to browse its data without exposing its internal structure.

The implementation is simple, recall the two methods: next(), to get the next element in the collection, and hasNext (), to check if there are elements left in the collection or not.

Hot & Cold Observables

Hot Observable (multicasting)

Hot&Cold yeah, like the Katy Perry song that everyone kwnos right. But what does it all mean?

Let’s imagine this issue in relation to TV. When we are watching a program on a channel, 100 Argentines say, no matter from which TV set we watch it, at that same hour, ALL of us will be receiving exactly the same content (let’s not get Flow into this yet!). We call this observable hot. **All subscribers are going to receive the same thing (I open parenthesis, this temperature issue is not only related to this subscription issue, but also affects the whole **life cycle** of that stream/data flow. But we will see it later). So, a hot observable, starts broadcasting as soon as it is created (this has to do with the data producer that we will see later), and the content it broadcasts, is shared by ALL its subscribers.

Cold observable (unicasting)

Let’s remember, cold observables are very vague. They just wait for subscribers to start broadcasting (data producer). For each subscriber, these observables start a new execution, therefore the data is NOT shared.

enter image description here

What a liar, yes there is why! Because each subscription is a DIFFERENT execution of the data flow/streaming! Continuing the analogy but this time with Flow or Netflix, now if every time we turn on and we want to watch a series, movie etc we watch it from the start, no matter if someone already streamed it, watched it or whatever, we will not watch it already started, but always from the start (for this example we stay with that, no forwarding chapters and do forward that’s cheating). We will see later how to transform cold to hot and vice versa. I also want to deepen a little more both topics with examples, now we only saw the concepts above.

Bonus

enter image description here

I recently had the honor to use the following chrome extension, which I leave here called MOCKMAN. Really a luxury!!! as its name suggests, it allows us to mock our HTTP calls with their respective response and status (success/error). In addition to setting a delay if desired. Take it as a godsend when in your environment you have all the services down. enter image description here

I hope you found today’s post useful, stay tuned!