Ion-router-outlet (angular) fills with hidden DOM by design: safe?

I know this is by-design behavior, I’m just wondering about the limits of the { provide: RouteReuseStrategy, useClass: IonicRouteStrategy } and angular router’s leaving the entire history of DOM objects in the ion-router-outlet so the back button has DOM to animate with.

I’ve designed something that allows traversing in a way that could generate a DOM history of thousands of whole pages in a typical case. That’s gotta be a lot of DOM memory for the browser to deal with, no?

Worse still, those pages are still subscribed to observers, meaning my observables can have hundreds of subscribers to update all the time! (I just stopped that by subscribing on ionViewWillEnter and unsubscribing on ionViewDidLeave but it stopped me from using the | async pipe in the template which is a nice feature…)

It purges fine when I navigate back to the home page. It works fine on a beefy dev machine. Question is, does it stress test well on meeker devices? Does it include a way of bailing the hidden DOM in a low-memory situation (rather than bailing out of the whole app!) or is that something I should do myself, perhaps by forcibly interjecting a home page visit in the middle of a long history piling up?

Yes I know about { replaceUrl: true } that doesn’t avoid this and I do want at least some back functionality (perhaps 20 animated back’s) preserved, I just want this capped so we don’t get a memory crisis. Thoughts?

I am not sure if I have an answer for you.

I am very curious on the problem you are trying to solve - why does this question pop up?

You seem to either want to control how the browser deals with caching of history and/or try to fight the Angular framework and the way it handles the DOM.

Either way, things I wonder if you really want to deal with, or at least check if your case is really that edge case requiring you to maybe even rethink which framework to use?

Simple enough, master/detail pattern, rather than having to go back to the master, include a button to go directly to the next detail. And potentially thousands of details could be seen without going back to master.

I’m looking for thoughts from someone who understands the framework and whether it has been stress tested for this. If not, I can work around by interjecting a master visit to clear the history from time to time. Although that would mean a loss of back functionality or I have to say “hang on a sec” and run through 20 detail routings so I get my goal of 20 backs.

This isn’t so weird a request. This is a 10 year old framework with 10% of the app store apps. Someone knows.

if the question is navigating back and forth through details, the question to me seems more on the part of how fast you can retrieve data from a backend. And how far ahead you want read data. I am not sure if the browser back button handles the iteration through data - invoking javascript code that triggers the change detection which leads to what the UI shows.

ps. never said the q is weird. Just trying to understand
ps2. angular is not 10 years old. Angular was released 2014. AngularJS 2010. :slight_smile: