Ionic 2 Beta 3 - Slides Laggy Working On Android


#1

I just updated to beta 3 and <ion-slides> is being very slow when I run on device. On browser it’s fine but when I deploy on my android device theres a multiple second delay opening a page with an <ion-slides>. The slides are also non-response for several seconds when the page first opens and once they become responsive again dragging them is very laggy. Is this a known issue or am I doing something wrong?

Thanks for the help.


#2

Would you be able to recreate something small in a codepen

http://codepen.io/tlancina/pen/EPBdVE/

With Ionic2 and Angular 2 both being beta, performance is something that still needs to be addressed. This is what NG2 is focusing on in the upcoming releases, so expect to see better performance over time.


#3

Sorry for the slow response: I put together a small example of what I’m doing here:

That example demonstrates what I’m doing with <ion-slides> that’s giving me performance troubles. In browser it’s silky smooth but on devices it usually slows to a crawl or will simply refuse to swipe.


#4

After some more investigation I realized that the slides are only unresponsive if they’ve been pushed on a few layers deep into the hierarchy. I made a Pen that demonstrates this:

As with the last one this is smooth in browser but when I run my app on device it’s very slow. On device the first page would be laggy but the slides would still work, but once you click one of the buttons under the image to push the button page and then click the blue button to push another slides page the slides no longer work. In my actual app the flow is as follows:

HomePage -> GalleryPage -> SlidesPage (works) -> GalleryPage -> SlidesPage (doesn't work)

#5

I think the problem might be coming from having too many slides at once. Currently I’m doing 100 slides at a time which seems fine on desktop but slow on mobile, but if I do 200 or 300 slides even the desktop browser slows down. @mhartington do you know if this is something that’s going to get ironed out as Ionic 2/Angular 2 develop? Or is this a performance problem inherent to Swiper?


#6

Hmm, I think it’s a bit from everyone involved.

There is some performance hits using the raw API

But I think there may be some added perf hits when you try to add ngFor to it.
We should expect to see some performance increase from V2 and NG2 in future releases


#7

Alright, thanks for the info. I’ll revisit this down the road if the issue persists in later releases.


#8

Update: As of beta 6 I’m not seeing nearly as much performance degradation as I move deeper into the navigation stack. I can’t say for certain that there’s no slow down if I make the stack very large, but it’s at least not as extreme as it was before.