From 852ef7056d1655a6e159174bc3070f8dcb097f03 Mon Sep 17 00:00:00 2001 From: Eric Rowell Date: Sun, 9 Mar 2014 13:15:01 -0700 Subject: [PATCH] added perf tests for new FastLayer --- src/FastLayer.js | 3 + src/Layer.js | 3 + test/performance/common/random-squares.js | 73 +++++-------------- test/performance/random-squares-v3.6.2.html | 21 ------ ...v4.7.4.html => random-squares-v5.0.1.html} | 2 +- test/unit/FastLayer-test.js | 2 +- 6 files changed, 28 insertions(+), 76 deletions(-) delete mode 100644 test/performance/random-squares-v3.6.2.html rename test/performance/{random-squares-v4.7.4.html => random-squares-v5.0.1.html} (94%) diff --git a/src/FastLayer.js b/src/FastLayer.js index c0d8a725..39a7ed9d 100644 --- a/src/FastLayer.js +++ b/src/FastLayer.js @@ -41,6 +41,9 @@ return this; }, + // the apply transform method is handled by the Layer and FastLayer class + // because it is up to the layer to decide if an absolute or relative transform + // should be used _applyTransform: function(shape, context) { var m = shape.getTransform().getMatrix(); context.transform(m[0], m[1], m[2], m[3], m[4], m[5]); diff --git a/src/Layer.js b/src/Layer.js index 78fa196a..77a4cfe8 100644 --- a/src/Layer.js +++ b/src/Layer.js @@ -123,6 +123,9 @@ return this; }, + // the apply transform method is handled by the Layer and FastLayer class + // because it is up to the layer to decide if an absolute or relative transform + // should be used _applyTransform: function(shape, context) { var m = shape.getAbsoluteTransform().getMatrix(); context.transform(m[0], m[1], m[2], m[3], m[4], m[5]); diff --git a/test/performance/common/random-squares.js b/test/performance/common/random-squares.js index 6f5054af..0abdaae1 100644 --- a/test/performance/common/random-squares.js +++ b/test/performance/common/random-squares.js @@ -5,7 +5,7 @@ var width = 500; var height = 300; - var VERSION = Kinetic.version === '4.7.4' || Kinetic.version === 'dev' ? 'new' : 'old'; + var VERSION = Kinetic.version === 'dev' ? 'new' : 'old'; window.requestAnimFrame = (function(){ return window.requestAnimationFrame || @@ -66,12 +66,9 @@ for (var i = 0; i < circles.length; i++) { var x = Math.round(Math.random() * width); var y = Math.round(Math.random() * height); - if (VERSION === 'new') { - circles[i].setPosition({x: x, y: y}); - } - else { - circles[i].setPosition(x, y); - } + + circles[i].setPosition({x: x, y: y}); + } lastTime = time; @@ -83,56 +80,26 @@ } function make_shape(color) { - if (VERSION === 'new') { - - return new Kinetic.Rect({ - fill: color, - width: 10, - height: 10, - transformsEnabled: "position", - listening : false - }); - - - - // return new Kinetic.Shape({ - // drawFunc: function(context) { - // var _context = context._context; - // _context.beginPath(); - // _context.rect(0, 0, 10, 10); - // _context.closePath(); - // _context.fillStyle = color; - // _context.fill(); - // } - // }); - - - } else { - return new Kinetic.Shape(function(){ - var context = this.getContext(); - - context.beginPath(); - context.rect(0, 0, 10, 10); - context.fillStyle = color; - context.fill(); - context.closePath(); - }); - } + return new Kinetic.Rect({ + fill: color, + width: 10, + height: 10 + }); } function make_stage() { + stage = new Kinetic.Stage({ + container: "container", + width: width, + height: height + }); + if (VERSION === 'new') { - stage = new Kinetic.Stage({ - container: "container", - width: width, - height: height, - nestedTransformsEnabled: false - }); - circlesLayer = new Kinetic.Layer({ - hitGraphEnabled: false - }); - } else { - stage = new Kinetic.Stage("container", width, height); + console.log('create fast layer') + circlesLayer = new Kinetic.FastLayer(); + } + else { + console.log('create normal layer') circlesLayer = new Kinetic.Layer(); } } \ No newline at end of file diff --git a/test/performance/random-squares-v3.6.2.html b/test/performance/random-squares-v3.6.2.html deleted file mode 100644 index 2bc228ec..00000000 --- a/test/performance/random-squares-v3.6.2.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - -
- - - - - - \ No newline at end of file diff --git a/test/performance/random-squares-v4.7.4.html b/test/performance/random-squares-v5.0.1.html similarity index 94% rename from test/performance/random-squares-v4.7.4.html rename to test/performance/random-squares-v5.0.1.html index 69b2401e..84c0a1de 100644 --- a/test/performance/random-squares-v4.7.4.html +++ b/test/performance/random-squares-v5.0.1.html @@ -14,7 +14,7 @@
- + diff --git a/test/unit/FastLayer-test.js b/test/unit/FastLayer-test.js index ab6af43d..1f7c038c 100644 --- a/test/unit/FastLayer-test.js +++ b/test/unit/FastLayer-test.js @@ -1,7 +1,7 @@ suite('FastLayer', function() { // ====================================================== - test('basic render', function() { + test.only('basic render', function() { var stage = addStage(); var layer = new Kinetic.FastLayer();