Why does enabling hardware-acceleration in CSS3 slow down performance?
I am moving 6000 small div elements in an css3 experiment using a transition from top: 0 to top: 145px to test performance. Using no hardware-acceleration runs smooth on Google Chrome. If I enable hardware-acceleration via translateZ(0) performance becomes horrible. Why is that so? Here is my example code: http://dl.dropboxusercontent.com/u/17844821/tmp/hwtest.html Update (2014-11-13): Since this question is still attracting attention I'd like to point out that the problem itself still seems to exist although the mentioned stuttering might not be visible anymore in the provided demo on modern