Learning about the marble diagram (our secret weapon)

RxJS ships with more than one hundred operators – these are among the building blocks of RxJS, useful for manipulating streams. All the reactive patterns that will be detailed later in this book are based on operators, and when it comes to explaining operators, it is better to refer to a visual representation – that’s where marble diagrams come in!

Marble diagrams are visual representations of the operator’s execution, which will be used in all chapters to understand the behavior of RxJS operators. At first, it might seem daunting, but it is delightfully simple. You only have to understand the anatomy of the diagram and then you’ll be good at reading and translating it.

Marble diagrams represent the execution of an operator, so every diagram will include the following:

• Input Observable(s): Represents one or many Observables given as input to the operator
• Operator: Represents the...