Last Updated: February 25, 2016
·
3.691K
· creativeaura

CSS performance relative to translateZ(0)

A number of blogs have expressed the performance gain in 'tricking' the GPU to think that an element is 3D by using transform: translateZ(0) to speed up animations and transitions. I was wonder what are the implications, if any, of applying this transform in the following manner:

* {
    -webkit-transform: translatez(0);
    -moz-transform: translatez(0);
    -ms-transform: translatez(0);
    -o-transform: translatez(0);
    transform: translatez(0);
}

Or for long parallax scroll page add transform property on body element.

More information http://stackoverflow.com/questions/10814178/css-performance-relative-to-translatez0