WebkitCSSMatrix vs translate3d

JavaScript performance comparison

Test case created by

Preparation code


      
      <script>
Benchmark.prototype.setup = function() {
  div = document.createElement('div');
  div.className = 'moved';
  div.style.webkitTransform = "translate3d(0,0,0)";
  matrix = new WebKitCSSMatrix().translate(0,0,0);
  x = 0;
  y = 0;
  z = 0;
  

};
</script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
translate3d
div.style.webkitTransform = "translate3d("+(x++)+"px,"+(y++)+"px,"+(z++)+"px)"
pending…
WebKitCSSMatrix
div.style.webkitTransform = matrix.translate(x++,y++,z++)
pending…
WebkitCSSMatrix 2
matrix.m41 = x++;
matrix.m42 = y++;
matrix.m43 = z++;
div.style.webkitTransform = matrix;
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL.

0 Comments