VirtualList performance on Android

edited February 2012 in Enyo 1.0
I installed one of our apps on Android (ICS on TouchPad) using PhoneGap 1.4.1. In general, the app runs, but VirtualList performance and behavior is pretty much horrible and makes the app unusable.

I tried VirtualList and ScrollingList (with rowsPerScrollerPage 1, 10, 15, 30, 50 and 100). I also tried API level 10 and 15. But scrolling is not only jerky, it sometimes hangs and then seems to jump a whole page or two after that.

I have read that others have similar problems with that on Android and there has been the suggestion, that it is the fault of the Android WebView component. But I have seen lists from jQueryMobile (running with PhoneGap) scrolling very smoothly on the same device... OK, those lists are not "virtual", but if I set rowsPerScrollerPage=100, then at least the first 100 rows should scroll smoothly?

Any hints or suggestions would be very much appreciated. I can probably wait for Enyo 2.0, I guess, but it was said, that it will not have all components and I fear, the list will be missing initially.


  • It's probably an issue with -webkit-transform then, and how often VirtualList changes that value to animate scrolls.

    Hopefully this is a problem that is solved in Enyo 2.0.
  • There is definitely a problem with Touch events that are not handled in Enyo 1.0 in the same way as they are handled elsewhere.
  • No I don't think the issue would be with Touch events. I think it's definitely with -webkit-transform. As CSS animations get more sophisticated, they take more processing power to animate smoothly, and Enyo uses translate3d on scrollers.

    Perhaps a more basic version, using overflow: scroll and changing the element's scrollTop property instead of changing -webkit-transform: translate3d will provide better performance.
  • In Enyo 1.0, enyo.BasicScroller has a boolean property, accelerated, that is used to pick scrolling using the CSS top attribute instead of transforms. This is inherited by all the users of the scroller.
  • If you search the net for the warning message that is being thrown (something about waiting for the WebCore to catch up), you can find several other non-Enyo projects that have had this problem as well, and the solutions were to either preventDefault() in certain places, or not preventDefault() in other certain places.. or to use inEvent.touches[0].pageX/pageY rather than inEvent.pageX/pageY .. or to move to a system with a WebKit that didn't exhibit that problem. I tried mucking with the preventDefault()s, and it doesn't look like the touches[0] thing worked when I tried that. Unfortuantely, I am not a master of the internals of Enyo, here, so I'm doing exactly that: mucking with it.

    Switching to a TransformScroller has improved the scrolling performance on Android quite a bit, although it still throws that warning message and halts when flick scrolling. Performance seems to be just fine, but the flick scroll kills it.

    However, I've only used Repeaters, and I've just now realized after typing all of this, that you may be talking about problems that are List only not Scroller related. So if that's correct, my apologies.
  • Setting accelerated to false for the scroller of the VirtualList seems to help a bit. But I have still the strange effect, that after flick-scrolling a few times, suddenly the List scrolls backwards!
  • edited February 2012
    Also, scrolling very slowly is pretty awkward. It scrolls a bit, then pauses very long. Flick-scrolling sort of works better (besides the occasional backwards scrolling).

    BTW: Setting accelerated to false also helps on webOS phones.
Sign In or Register to comment.