lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-11-18 17:21:36 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

worked through some synchronous / asynchronous issues with toDataURL and toImage(). stage toDataURL() is now asynchronous, and all other node toDataURLs is still synchronous. toImage() is now asynchronous. Kinetic.Image once again only accepts image objects, and can no longer be instantiated with a data URL or image data due to asynchronous issues. It's much cleaner for the developer to load an image however they like, and then instantiate a Kinetic.Image shape synchronously

Browse Source
This commit is contained in:
Eric Rowell
2012-07-15 20:12:18 -07:00
parent acc6b6e14e
commit 384a686740
11 changed files with 233 additions and 267 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
tests/js/performanceTests.js
View File

@@ -1,5 +1,5 @@
Test.prototype.tests = {
'PERFORMANCE - draw rect vs image from image data': function(containerId) {
'DRAWING - draw rect vs image from image data': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -34,7 +34,7 @@ Test.prototype.tests = {
endTimer('draw 10,000 images with image object from image data');
},
'PERFORMANCE - draw rect vs image from data url': function(containerId) {
'DRAWING - draw rect vs image from data url': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -57,7 +57,7 @@ Test.prototype.tests = {
endTimer('draw 10,000 rects with canvas API');
startTimer();
var url = canvas.toDataURL();
var url = layer.toDataURL();
endTimer('create data url');
var imageObj = new Image();
@@ -71,7 +71,7 @@ Test.prototype.tests = {
}
endTimer('draw 10,000 images with image object from data url');
},
'*ANIMATION - draw 1,000 stars': function(containerId) {
'DRAWING - draw 1,000 stars': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -99,7 +99,7 @@ Test.prototype.tests = {
endTimer('draw 1,000 stars');
},
'*ANIMATION - draw 1,000 cached stars': function(containerId) {
'DRAWING - draw 1,000 cached stars': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -107,8 +107,6 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
startTimer();
var star = new Kinetic.Star({
innerRadius: 20,
outerRadius: 50,
@@ -123,21 +121,23 @@ Test.prototype.tests = {
layer.add(star);
stage.add(layer);
var img = star.toImage();
console.log('call toImage')
star.toImage(function(img) {
startTimer();
for(var n = 0; n < 1000; n++) {
var image = new Kinetic.Image({
image: img,
x: Math.random() * stage.getWidth(),
y: Math.random() * stage.getHeight(),
offset: 70
});
for(var n = 0; n < 1000; n++) {
var image = new Kinetic.Image({
image: img,
x: Math.random() * stage.getWidth(),
y: Math.random() * stage.getHeight(),
offset: 70
});
layer.add(image);
}
layer.add(image);
}
layer.draw();
layer.draw();
endTimer('draw 1,000 stars');
endTimer('draw 1,000 cached stars');
});
}
};