Ion-list scrolling performance with multiple lists per page


#1

Hello,

My team is working on an application and we’ve kind of hit an issue and was curious if anyone has any suggestions. We’re creating a page that starts with one list that fills the screen, then when an option is selected it shrinks and content for the item selected fills in next to it. When just the one list is on the page scrolling behaves as you would expect. This list contains only around 26 items, showing only text. It’s when the second list that contains about 274 items is displayed that both lists become unusable in regards to scrolling. The second list contains text and two small images. When trying to scroll when they are both on the screen it’s very choppy and you can’t get a smooth scroll. On the second list with the most items it’s almost like there’s a lag in the time the app realizes the user has pressed and began to scroll, so when you let up to just do a small scroll through the list it does a large scroll and sends you clear to the bottom. Whats odd is that when developing and using Chrome on my PC it runs decent, only when deployed to the iPad that it really suffers.

Both lists are setup as with ng-repeating. We’re running the latest version of Ionic. I have done a lot of searching and haven’t really come across anyone else having these issues. Does anyone have an idea as to what could be bogging it down? I’m going to attach a screenshot just to see what we’re working with. If anyone needs any more info I’ll be more than happy to provide.

Thanks!