0

I have few subscriptions in app component ( root component) in angular. Once angular loads the application, the app component never get destroyed until we close the application. This basically means, the ngOnDestroy method of app component will not get called.

  1. In this scenario, what happens with the active subscriptions in app component, when user closes or refreshes the page?
  2. Does these active subscriptions can create a memory leakage, once user closes the application?

Note: I tried to find the answer from RXJS docs and angular.io site, unfortunately there were no details mentioned about the above scenarios.

Ane
  • 115
  • 9

1 Answers1

2

What happens with the active subscriptions in app component, when user closes or refreshes the page?

When the browser is closed or refreshed , active subscriptions of an application using a library such as RxJS will automatically unsubscribe or terminate. This is due to the typical life cycle of JavaScript applications running in a browser environment.

When the browser is closed:

  • All JavaScript processes running within that browser instance are terminated, including any active subscriptions.
  • Any ongoing network requests or other asynchronous operations initiated by the application will be interrupted.

When the browser is refreshed:

  • The page is reloaded, and the entire JavaScript application is reset.
  • Any active subscriptions will be automatically unsubscribed or terminated as part of the reset process.
  • The application will need to reestablish any necessary subscriptions or state when it initializes again after the refresh.

Does these active subscriptions can create a memory leakage, once user closes the application?

Yes, when a user leaves the current webpage or navigates to another, active RxJS subscriptions can cause memory leakage. The reason for this is that RxJS subscriptions are often connected to JavaScript objects or components that are part of the context of the current web page, and if they are not correctly unsubscribed, they may maintain references to those things long after the user navigates away.

The browser releases resources and unloads the JavaScript context for the current web page when a user switches to another website. The garbage collector will not be able to free up the memory if there are any active RxJS subscriptions that haven't been unsubscribed because they still hold references to objects.

You can listen to beforeunload and unload yourself to unsubscribe your subscriptions before the application is destroyed by the browser.

See Also

https://developer.mozilla.org/en-US/docs/Web/Events/unload
How can we detect when user closes browser? (Angular)

Abdullah Qudeer
  • 949
  • 7
  • 24