Georgi Parlakov

Observables in Plain terms

A single error can terminate your entire observable chain. Learn how placing `catchError` inside `switchMap` contains the blast and saves your stream.

Observables in Plain terms
#1about 8 minutes

Understanding the core concept of operators as wrappers

Observables can be visualized as a chain of wrapping operators, similar to Russian dolls, where each operator adds functionality to the one before it.

#2about 9 minutes

Live demo of the operator wrapper model

A code demonstration reveals how subscriptions propagate down the chain and values emit up, showing that observables can emit both synchronously and asynchronously.

#3about 4 minutes

The `toPromise` operator waits for observable completion

The `toPromise` operator doesn't resolve with the first emitted value but instead waits for the source observable to complete and resolves with the last value.

#4about 8 minutes

Comparing the `first` and `take(1)` operators

While `take(1)` safely completes on an empty stream, the `first` operator will throw an error if the source observable completes without emitting any values.

#5about 10 minutes

Choosing between `switchMap`, `concatMap`, and `mergeMap`

`switchMap` cancels previous inner observables, `concatMap` waits for them to complete sequentially, and `mergeMap` runs them all concurrently.

#6about 4 minutes

Keeping observable chains alive with `catchError`

Placing a `catchError` operator inside a higher-order mapping operator like `switchMap` prevents an inner observable's error from terminating the entire outer chain.

#7about 2 minutes

Combining streams with `combineLatest` and `withLatestFrom`

Both `combineLatest` and `withLatestFrom` require all source observables to emit at least once before they produce any output.

#8about 2 minutes

Managing subscriptions to prevent memory leaks

Use a parent `Subscription` object to group multiple child subscriptions, allowing you to unsubscribe from all of them at once to avoid memory leaks.

#9about 3 minutes

Recommended resources for learning RxJS

Key learning resources include the official RxJS documentation, interactive marble diagrams for visualizing operators, and content from core team members like Ben Lesh.

Related jobs
Jobs that call for the skills explored in this talk.

Angular Developer

Picnic Technologies B.V.
Amsterdam, Netherlands

Intermediate
Senior

Featured Partners

From learning to earning

Jobs that call for the skills explored in this talk.