Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the difference between subscription.unsubscribe() and subscription.remove()?

I am using Angular 5 and have subscribed an observable using the subscribe() method. I want to know if only calling the unsubscribe() method on the subscription will be sufficient to cleanup everything, or should I also call remove() method?

code snippet:

`

// somewhere in a method
this.s1 = someObservable.subscribe((value) => {
     //somecode
 });
// in ngOnDestroy
this.s1.unsubscribe(); // should I also call .remove()

`

like image 504
Akhilesh Shukla Avatar asked Nov 22 '18 10:11

Akhilesh Shukla


People also ask

Why do we need to unsubscribe from observable?

In Angular applications, it's always recommended to unsubscribe the observables to gain benefits like: Avoids Memory Leaks. Aborting HTTP requests to avoid unwanted calls.

What is RxJS unsubscribe?

Unsubscribing Manually One method we can use, is to unsubscribe manually from active subscriptions when we no longer require them. RxJS provides us with a convenient method to do this. It lives on the Subscription object and is simply called . unsubscribe() .

What is unsubscribe in Angular?

The router will remove this component from the DOM and destroy it. We need to clean up after ourselves before that happens. Specifically, we must unsubscribe before Angular destroys the component. Failure to do so could create a memory leak. We unsubscribe from our Observable in the ngOnDestroy method.


1 Answers

.remove remove the subscription from an internal list, but it does not unsubscribe.

.unsubscribe clean up everything, do the unsubscribe and remove the observer from the internal list. (There was a bug (fixed) that didn't remove the observer from the list)

.takeWhile keep alive the subscription since a certain situation is false

example:

this.service.method()
.subscribe(res => {
  //logic
});

this will never unsubscribe.

this.service.method()
    takeWhile(() => this.isAlive) // <-- custom variable setted to true
    .subscribe(res => {
      //logic
    });

ngOnDestroy(){
    this.isAlive = false;
}

Automatic unsubscribe when the component is going to be destroyed.

   this.s1 = someObservable.subscribe((value) => {
        //somecode
    });

public yourMethod(){
    this.s1.unsubscribe();
}

this subscription will exists and be "alive" until yourFunction is not called.

--

I personally like to use the rxjs operator takeWhile to keep the code clean. In a very big project or single component having multiple subscription it's confusing having (IE) 30 variables: Subscription. So If you are asking when to use the takeWhile operator my answer is: (Taking as example one subscription) -> If you are sure that the unsubscribe needs to be done when the component is destroyed, use takeWhile. If you need to unsubscribe in a certain scenario where the component is still "alive", use the second example I wrote.

Hope to have clarified the argument.

like image 196
Jacopo Sciampi Avatar answered Sep 30 '22 04:09

Jacopo Sciampi