Simplify.js & 70k points polyline on a canvas

JavaScript performance comparison

Test case created by Mourner

Info

Drawing a 72k-points polyline with and without simplification using Simplify.js: http://mourner.github.com/simplify-js/

Preparation code

<script src="http://mourner.github.com/simplify-js/website/test-data.js">
</script>
<script src="http://mourner.github.com/simplify-js/simplify.js">
</script>
 
<script>
Benchmark.prototype.setup = function() {
    var canvas = document.createElement('canvas');
    canvas.width = 800;
    canvas.height = 400;
    ctx = canvas.getContext('2d');
    ctx.translate(-200, -100);
   
    function draw(tolerance) {
      ctx.clearRect(200, 100, 800, 400);
   
      var newPoints = points;
   
      if (tolerance) {
        newPoints = simplify(points, tolerance);
      }
      var i, len, p;
   
      ctx.beginPath();
   
      for (i = 0, len = newPoints.length; i < len; i++) {
        p = newPoints[i];
        ctx.lineTo(p.x, p.y);
      }
   
      ctx.stroke();
    }
};
</script>

Preparation code output

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
with Simplify.js & tolerance = 1
draw(1.0)
pending…
without Simplify.js
draw()
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. Here’s a list of current revisions for this page:

0 comments

Add a comment