canvas translate multiple line to vs multiple lineto

Benchmark created on


Preparation HTML

<canvas id="can"></canvas>

Setup

var x, y,
      c = document.getElementById("can"),
      ctx = c.getContext("2d");

Test runner

Ready to run.

Testing in
TestOps/sec
without translate
ctx.beginPath();
ctx.moveTo(50, 50);
for (i = 0; i < 800; i++) {

  x = 50 + 5;
  y = 50 + 5;
  ctx.lineTo(x, y);
}

ctx.stroke();
ready
with translate
ctx.translate(50, 50);
ctx.beginPath();
ctx.moveTo(0, 0);
for (i = 0; i < 800; i++) {

  x = 5;
  y = 5;
  ctx.lineTo(x, y);
}

ctx.stroke();
ctx.translate(-50, -50);
ready

Revisions

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