lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-09-19 02:37:59 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

added performance test suite with two sample performance tests

Browse Source
This commit is contained in:
Eric Rowell
2012-07-14 09:57:21 -07:00
parent 5bfcf3ffa8
commit 2548e3c2ef
5 changed files with 104 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
dist/kinetic-core.js vendored
View File

@@ -3,7 +3,7 @@
* http://www.kineticjs.com/
* Copyright 2012, Eric Rowell
* Licensed under the MIT or GPL Version 2 licenses.
* Date: Jul 13 2012
* Date: Jul 14 2012
*
* Copyright (C) 2011 - 2012 by Eric Rowell
*

2
dist/kinetic-core.min.js vendored
View File

@@ -3,7 +3,7 @@
* http://www.kineticjs.com/
* Copyright 2012, Eric Rowell
* Licensed under the MIT or GPL Version 2 licenses.
* Date: Jul 13 2012
* Date: Jul 14 2012
*
* Copyright (C) 2011 - 2012 by Eric Rowell
*

16
tests/html/performanceTests.html Normal file
View File

@@ -0,0 +1,16 @@
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" type="text/css"href="../base.css">
<script src="../../dist/kinetic-core.js"></script>
<script src="../js/Test.js"></script>
<script src="../js/performanceTests.js"></script>
<script>
window.onload = function() {
var test = new Test();
test.run();
};
</script>
</head>
<body onmousedown="return false;"></body>
</html>

12
tests/js/Test.js
View File

@@ -1,6 +1,18 @@
var numTests = 0;
var testCounter = null;
var before, after;
function startTimer() {
var date = new Date();
before = date.getTime();
}
function endTimer(str) {
var date = new Date();
after = date.getTime();
var diff = after - before;
console.log(str + ': ' + diff + 'ms');
}
function warn(condition, message) {
test(condition, message, true);
}

74
tests/js/performanceTests.js Normal file
View File

@@ -0,0 +1,74 @@
Test.prototype.tests = {
'PERFORMANCE - draw rect vs image from image data': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
stage.add(layer);
var canvas = layer.getCanvas();
var context = layer.getContext();
startTimer();
for(var n = 0; n < 10000; n++) {
context.fillStyle = 'blue';
context.lineWidth = 6;
context.strokeStyle = 'red';
context.fillRect(10, 10, 100, 100);
context.strokeRect(10, 10, 100, 100);
}
endTimer('draw 10,000 rects with canvas API');
startTimer();
var imageData = context.getImageData(7, 7, 106, 106);
endTimer('create image data');
layer.clear();
startTimer();
for(var n = 0; n < 10000; n++) {
context.putImageData(imageData, 7, 7);
}
endTimer('draw 10,000 images with image object from image data');
},
'PERFORMANCE - draw rect vs image from data url': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
stage.add(layer);
var canvas = layer.getCanvas();
var context = layer.getContext();
startTimer();
for(var n = 0; n < 10000; n++) {
context.fillStyle = 'blue';
context.lineWidth = 6;
context.strokeStyle = 'red';
context.fillRect(10, 10, 100, 100);
context.strokeRect(10, 10, 100, 100);
}
endTimer('draw 10,000 rects with canvas API');
startTimer();
var url = canvas.toDataURL();
endTimer('create data url');
var imageObj = new Image();
imageObj.src = url;
layer.clear();
startTimer();
for(var n = 0; n < 10000; n++) {
context.drawImage(imageObj, 7, 7, 106, 106, 10, 10, 106, 106);
}
endTimer('draw 10,000 images with image object from data url');
}
};