1

I think I am missing something in NativeScript (currently with Angular and testing on Android, both with latest versions).

On one hand, each of my routes, initializes some Observable Subscription (watching data change, navigation changes, services changes). On the other hand, Nativescript keep a stack of loaded/living routes..

Result : If any of my services changes, the Subscriptions on the stacked routes are still executed (which are not on screen, but can be deep in back stack)..

Is that a problem ? I mean why would those hidden routes still be active ? Doesn't it smell bad like a leak ?

So now, I'm asking, why doesn't Nativescript don't have onResume & onPause logic like on Android Sdk ? This way I could stop/resume observers from here ?

For now, I'm trying to use :

ngOnInit() {
    console.log('onInit');
}

@HostListener('loaded')
onResume() {
    console.log('onResume');
}

@HostListener('unloaded')
onPause() {
    console.log('onPause');
}

ngOnDestroy() {
    console.log('onDestroy');
}

But I don't know, I got a bad feeling about all of this, I have the feeling I'm not the one who should handle this but nativescript inner sdk. Thanks.

Jscti
  • 14,096
  • 4
  • 62
  • 87
  • nativescript supports suspend and resume, such as application.on(application.resumeEvent), https://docs.nativescript.org/core-concepts/application-lifecycle – Yong Feb 06 '20 at 11:05
  • @Yong I'm not talking about application lifecycle but Page (component or route) lifecycle – Jscti Feb 06 '20 at 11:21
  • you can register callbacks in your components. – Yong Feb 06 '20 at 11:28
  • 1
    A Page in NativeScript is a layout - it is not an Android Activity. SO as this is not an activity but a View it doesn't have `onResume` (but have `loaded` event) – Nick Iliev Feb 06 '20 at 12:48

2 Answers2

0

You can take a look at this page in the NS Angular docs:

https://docs.nativescript.org/angular/core-concepts/angular-navigation

especially this section:

In a native mobile application, the system will keep the navigated views alive,
so that when you come back to them, their view state will be kept the same.
Views are destroyed only when you back away from them. The page-router-outlet
houses native navigations, so its components lifecycle must match the lifecycle
of the native views. This is done by the custom NSRouteReuseStrategy.

In order to unsubscribe, I'm using a BaseComponent that keeps track of all subscriptions a component has and removes them in ngOnDestroy - which will be called eventually.

In rare cases, I need to do that in the NativeScript lifecycle hooks, ie. in page.on('navigatedFrom') if special handling is needed.

Tim
  • 212
  • 1
  • 7
  • Thanks for your answer. Yeah I do all that already, but my question remain : is it OK to you that all your subscriptions are still executed when your page is not the active one and is in the back stack ? That feels bad. From a performance point it's a leak for me ... So i'll use loaded/unloaded events but its kinda hacky – Jscti Feb 06 '20 at 13:25
  • Performance impacts would depend on what you do in your subscriptions and how deep your back-stack can get, but I have not had any issues (I'm aware of) - other than being slightly annoyed about having to keep the differences to "web" Angular in mind. – Tim Feb 06 '20 at 14:23
0

loaded or unloaded are events triggered on {N} View. It's the base component, inherited by any other component in the framework. loaded event is triggered when the underlaying native view is created and unloaded is mostly when its destroyed Or removed from screen.

Your Page (any component assigned for a route path is wrapped with a Page in Angular) is a fragment. While you navigate forward with page-router-outlet, your current page is put on a back stack (history). The unloaded event may be called at this point too, but it doesn't necessarily mean you have to unsubscribe. Because the component is still alive on back stack, when you navigate backward the loaded will be triggered again.

I would suggest you to just stick with ngOnInit to subscribe and ngOnDestroy to unsubscribe anything just like Angular on web. You shall use loaded event of a View only in cases where you must access the UI elements / it's underlaying native component. But remember this event is triggered every time when the page is loaded, that includes the back navigation as discussed above. So you might want to remove the loaded listener as soon you are done, so it doesn't get executed again on back navigation.

Also it doesn't hurt the performance if you keep the subscriptions active when the component is put on back stack. I believe the native view is not updated unless it's active. But you might want to unsubscribe in cases where you do any heavy operations on controller, like some heavy math or long loops etc., It totally depends on what you do in your subscription.

Manoj
  • 21,753
  • 3
  • 20
  • 41