How to improve webapp scroll performance in retina webview device

Question

I have an iPad3 (ios5):
I upload my webapp html locally, I turned off the whole css3 effect, for example box-shadow , and all that I can optimize, for example, what I used to optimize the site, etc.
And all my efforts are focused on css / html (I do not even execute javascript), but I still could not get to portable fps

Did I miss something? Is it just a performance issue, like a bug or something else in ios5?
What is the best practice for improving scroll performance in webapp?

Answer 1

I struggled with the most likely same problem ( see my SO question here )

I use iScroll, and recently I had another performance issue in iOS6.1.3, but with iScroll itself. I was able to solve this by explicitly adding css to get hardware acceleration in iScroll.

I used a specific id page to assign css , but you can decide where you need to add it if that helps your case.

CSS

 #myid * { -webkit-transform: translate3d(0, 0, 0); } 

my iscroll uses the s-scrollwrapper and s-scrollpane , which may be the best choice to add css to provide hardware acceleration. Then css will be

 .s-scrollwrapper * { -webkit-transform: translate3d(0, 0, 0); } 

or

 .s-scrollpane * { -webkit-transform: translate3d(0, 0, 0); } 

Hope this helps you improve speed on iOS5.

Webapp on iPad 3 Mesh Slow Screen Display