Hello 👋! Thanks for subscribing.

I wrote only one article last week, another video summary:

Notes on “RxJS Recipes – Dominic Elm & Kwinten Pisman – Uphill Conf 2019”

Published on: 2021-12-05

tags: RxJS, JavaScript

Here are some notes on the talk on RxJS Recipes by Dominic Elm and Kwinten Pisman.

Identifying Patterns

• What?: Result
• When?: Trigger
• How?: Pattern

Triggers and results should always be streams. If they are not streams, create streams yourself.

Repeater Pattern

Work that needs to be executed n times (n > 1)

const result$ = trigger$.pipe(<flatteningOperator>((_) => work$))

Enricher

Lazily enrich a stream with data when trigger fires

const result$ = trigger$.pipe(
    withLatestFrom(enricherSource$),
    map(([trigger, data]) => <data>),
);

Group Aggregator

Whenever the result is an Observable

const FT$ = falseTrigger$.pipe(mapTo(false))
const TT$ = trueTrigger$.pipe(mapTo(true))

const result$ = merge(FT$, TT$)

(Note: While the merge operator is deprecated, you can still use it as a creation function. If you want to use merge in a pipe, use mergeWith instead.)

Work Decider

Work that needs to be stopped and restarted when some trigger fires

const result$ = trigger$.pipe(<flatteningOperator>((condition) => {
  if (condition) workA$
  else workB$
}))

Use observables as the boundaries between services and components.

Error Decider

Work that needs to be stopped and restarted when some trigger fires

const result$ = trigger$.pipe(
  retryWhen((error$) => {
    return error$.pipe(
      switchMap((_) => {
        if (condition) workA$
        else workB$
      })
    )
  })
)

Links

• Dominic Elm & Kwinten Pisman - RxJS Recipes - Uphill Conf 2019
• Slides from the talk
• Code Repository

Thank you for reading my blog.

Don’t hesitate to reach out via email or Twitter!