Webapp on iPad 3 retina display slow screen painting

Question

I have a webapp for iPod touch and iPad. Works like a charm on iPad 1 and iPad 2. Now I have tested on a new iPad (iPad 3, iPad HD whatever name to be used) and I see that the painting of the screen is slow. I can see kind of blocks being painted one by one.

Anyone knows how I can get the painting of the screen faster than iPad 1 and 2 instead of slower ?

EDIT: Bounty expiry The bounty has at least given some answers, although they are not sufficient to award the bounty. The question remains open.

Answer 1

We had similar problem in our application, and tried some optimizations, here are the two most effective approaches:

1. Avoid using CSS3 effects. We used a lot of CSS3 shadows in previous versions, which slowed down rendering process on iPad 3 a lot. After replacing those shadow effects with background images, performance got greatly improved on iPad 3.

2. Optimize Javascript. Our application has some scrollable components, whenever user scrolls the component some Javascript code will be executed to do some loading work, like loading images in a lazy way. On iPad 3 scrolling will delay for 500ms when user tries to scroll from one page to the next. Then we found some unnecessary image loading work were performed in the scrolling callback, after removing them, the scrolling performance is acceptable.

These two approaches may be quite specific to our application. Hope they can help you as well.