I have a view (page) in my app where I’m basically swiping images in and out of screen - in other words, on swipe event I’m tweening the css properties of images via css. There are only 2 images in the DOM at all times, and I’m changing their src on each swipe.
For the actual swipe I’m listening to Gesture from ionic-angular/gestures/gesture which I’m making sure to destroy on ngOnDestroy(). (If I destroy the gesture there’s no need to unlisten right?)
The first time I’m viewing that page on my android device, the images are being swiped (tweened following a swipe event) smoothly.
After I move to a different view and come back, it suddenly lags catastrophically.
I thought it might be due to a memory leak, but I’m making sure to always remove listeners and kill tweens on ngOnDestroy, so I really don’t know what could cause a memory leak.
Profiling an Angular 2 app seems like a nearly impossible task so far, plus I didn’t notice any resources actually accumulating over time in the profiles, the contrary actually.
The second thing I suspected was view caching, it sounded like it might just be it, except -
I’m never pushing views to NavController, I’m always using setRoot(). According to the NavController docs:
By default, pages are cached and left in the DOM if they are navigated away from but still in the navigation stack (the exiting page on a push() for example). They are destroyed when removed from the navigation stack (on pop() or setRoot()).
According to that, my views are never cached.
The rest of my views are simpler then that, each view basically sends a request to my server and displays info accordingly, feels like not much can be going on there.
Any idea what might be going on?
The device I’m testing on is Redmi Note 3.