Unsubscribing streams to avoid memory leaks

Streams are fun to work with and they’re awesome. You’ll know more about RxJS and streams when you’ve finished this chapter. One reality is facing unseen problems that occur when streams are used without caution. One of the biggest mistakes to make with streams is to not unsubscribe them when we no longer need them, and in this recipe, you’ll learn how to unsubscribe streams to avoid memory leaks in your Angular apps.

Getting ready

The app that we are going to work with resides in start/apps/chapter05/rx-unsubscribing-streams inside the cloned repository:

1. Open the code repository in your code editor.
2. Open the terminal, navigate to the code repository directory, and run the following command to serve the project:

   npm run serve rx-unsubscribing-streams
   

   This should open the app in a new browser tab, and you should see the following:

   

   Figure 5.3: The rxjs-unsubscribing...