Question

I created a HTML5 web application that uses hardware acceleration via CSS3 property translateZ(0).

On my 4s every works really very smooth.

When I test the same thing on a iPhone4, then performance goes down extremely. Almost unusable.

Is there some kind of freaky trick to enable hardware acceleration for the iPhone4? Or is its GPU simply that weak?

Was it helpful?

Solution

It came out that I've been doing hardware-accelerated transitions the wrong way, see:

What are the "golden rules" to increase CSS3 transition performance on mobile devices?

Using translate3d(x, y, z) instead of translateZ(0) with left:x did the trick for me. Now even on older iPhones all transitions run very smoothly.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top