RxJS Best Practices

A series of practices I use every day in my code

RxJS is the most popular framework for functional reactive programming (FRP) in JavaScript. This means a lot of people are using RxJS daily in their projects. Most developers are aware of the common clean-code practices, but what about RxJS best practices? Are you aware of the dos and don’ts when it comes to FRP? Are you applying them in your code?

This tutorial will focus on several best practices that I use daily when writing code, with practical examples. We’ll be covering the following points:

We’ll be covering these techniques:

1. Avoid logic inside the subscribe function

2. Use subjects to force completion

3. Avoid duplicated logic

4. Avoid nesting — use chaining instead

5. Share to avoid stream duplication

6. Don’t expose subjects

7. Use marble diagrams for testing

Without further ado, let’s get started.

Hello everyone, welcome to Dottech. In this video we’re going to talk about RxJS, which is the most popular framework for functional reactive programming in JavaScript. More specifically, we’re going to talk about RxJS best practices. We’ll discuss the dos and don’ts when it comes to functional reactive programming. So, without further ado, let’s get started

1. Avoid Logic Inside the Subscribe Function

This statement may seem pretty obvious to some of you, but it’s a common pitfall for RxJS beginners. Until you learn how to think functionally + reactively, you may be tempted to do something like this:

Our pokemon$ Observable emits Pokemon objects, and, in a very nonreactive way, we’re subscribing to it in order to access these objects and perform some actions, like returning early if the Pokemon type is Water, making a call to a getStats() function, logging…