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

after doing some more performance testing, decided to remove class level cache in favor of local method variable caching only

Browse Source
This commit is contained in:
Eric Rowell
2012-11-13 23:48:30 -08:00
parent 3c3351ec6f
commit 914ee2fb4b
3 changed files with 27 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/Node.js
View File

@@ -1,7 +1,4 @@
Kinetic.Node = (function() {
// variable cache
var TYPE = Kinetic.Type;
/**
* Node constructor.  Nodes are entities that can be transformed, layered,
* and have events bound to them. They are the building blocks of a KineticJS
@@ -223,7 +220,7 @@ Kinetic.Node = (function() {
for(var key in config) {
var method = 'set' + key.charAt(0).toUpperCase() + key.slice(1);
// use setter if available
if(TYPE._isFunction(this[method])) {
if(Kinetic.Type._isFunction(this[method])) {
this[method](config[key]);
}
// otherwise set directly
@@ -342,7 +339,7 @@ Kinetic.Node = (function() {
* @param {Number} y
*/
setPosition: function() {
var pos = TYPE._getXY([].slice.call(arguments));
var pos = Kinetic.Type._getXY([].slice.call(arguments));
this.setAttr('x', pos.x);
this.setAttr('y', pos.y);
},
@@ -376,7 +373,7 @@ Kinetic.Node = (function() {
* y property
*/
setAbsolutePosition: function() {
var pos = TYPE._getXY([].slice.call(arguments));
var pos = Kinetic.Type._getXY([].slice.call(arguments));
var trans = this._clearTransform();
// don't clear translation
this.attrs.x = trans.x;
@@ -405,8 +402,7 @@ Kinetic.Node = (function() {
* @param {Number} y
*/
move: function() {
var pos = TYPE._getXY([].slice.call(arguments));
var pos = Kinetic.Type._getXY([].slice.call(arguments));
var x = this.getX();
var y = this.getY();
@@ -558,6 +554,7 @@ Kinetic.Node = (function() {
* @methodOf Kinetic.Node.prototype
*/
toObject: function() {
var type = Kinetic.Type;
var obj = {};
obj.attrs = {};
@@ -565,7 +562,7 @@ Kinetic.Node = (function() {
// serialize only attributes that are not function, image, DOM, or objects with methods
for(var key in this.attrs) {
var val = this.attrs[key];
if(!TYPE._isFunction(val) && !TYPE._isElement(val) && !(TYPE._isObject(val) && TYPE._hasMethods(val))) {
if(!type._isFunction(val) && !type._isElement(val) && !(type._isObject(val) && kineticType._hasMethods(val))) {
obj.attrs[key] = val;
}
}
@@ -764,7 +761,7 @@ Kinetic.Node = (function() {
* is very high quality
*/
toImage: function(config) {
TYPE._getImage(this.toDataURL(config), function(img) {
Kinetic.Type._getImage(this.toDataURL(config), function(img) {
config.callback(img);
});
},
@@ -776,7 +773,7 @@ Kinetic.Node = (function() {
* @param {Number} y
*/
setOffset: function() {
var pos = TYPE._getXY([].slice.call(arguments));
var pos = Kinetic.Type._getXY([].slice.call(arguments));
if(pos.x === undefined) {
pos.x = this.getOffset().x;
}
@@ -793,7 +790,7 @@ Kinetic.Node = (function() {
* @methodOf Kinetic.Node.prototype
*/
setScale: function() {
var pos = TYPE._getXY([].slice.call(arguments));
var pos = Kinetic.Type._getXY([].slice.call(arguments));
if(pos.x === undefined) {
pos.x = this.getScale().x;
@@ -813,7 +810,7 @@ Kinetic.Node = (function() {
*/
setSize: function() {
// set stage dimensions
var size = TYPE._getSize(Array.prototype.slice.call(arguments));
var size = Kinetic.Type._getSize(Array.prototype.slice.call(arguments));
this.setWidth(size.width);
this.setHeight(size.height);
},

24
src/Shape.js
View File

@@ -1,7 +1,4 @@
Kinetic.Shape = (function() {
// variable cache
var TYPE = Kinetic.Type;
/**
* Shape constructor. Shapes are primitive objects such as rectangles,
* circles, text, lines, etc.
@@ -73,7 +70,7 @@ Kinetic.Shape = (function() {
var shapes = Kinetic.Global.shapes;
var key;
while(true) {
key = TYPE._getRandomColorKey();
key = Kinetic.Type._getRandomColorKey();
if(key && !( key in shapes)) {
break;
}
@@ -144,10 +141,11 @@ Kinetic.Shape = (function() {
}
},
_getFillType: function(fill) {
var type = Kinetic.Type;
if(!fill) {
return undefined;
}
else if(TYPE._isString(fill)) {
else if(type._isString(fill)) {
return 'COLOR';
}
else if(fill.image) {
@@ -156,7 +154,7 @@ Kinetic.Shape = (function() {
else if(fill.start && fill.end && !fill.start.radius && !fill.end.radius) {
return 'LINEAR_GRADIENT';
}
else if(fill.start && fill.end && TYPE._isNumber(fill.start.radius) && TYPE._isNumber(fill.end.radius)) {
else if(fill.start && fill.end && type._isNumber(fill.start.radius) && type._isNumber(fill.end.radius)) {
return 'RADIAL_GRADIENT';
}
else {
@@ -316,10 +314,11 @@ Kinetic.Shape = (function() {
* @param {Number} config.opacity
*/
setShadow: function(config) {
var type = Kinetic.Type;
if(config.offset !== undefined) {
config.offset = TYPE._getXY(config.offset);
config.offset = type._getXY(config.offset);
}
this.setAttr('shadow', TYPE._merge(config, this.getShadow()));
this.setAttr('shadow', type._merge(config, this.getShadow()));
},
/**
* set fill which can be a color, linear gradient object,
@@ -329,6 +328,7 @@ Kinetic.Shape = (function() {
* @param {String|Object} fill
*/
setFill: function(fill) {
var type = Kinetic.Type;
var oldFill = this.getFill();
var fillType = this._getFillType(fill);
var oldFillType = this._getFillType(oldFill);
@@ -337,7 +337,7 @@ Kinetic.Shape = (function() {
// if fill.offset is defined, normalize the xy value
if(fill.offset !== undefined) {
fill.offset = TYPE._getXY(fill.offset);
fill.offset = type._getXY(fill.offset);
}
/*
@@ -346,7 +346,7 @@ Kinetic.Shape = (function() {
* overwrite the fill entirely
*/
if(!newOrOldFillIsColor && changedFillType) {
fill = TYPE._merge(fill, oldFill);
fill = type._merge(fill, oldFill);
}
this.setAttr('fill', fill);
@@ -357,7 +357,7 @@ Kinetic.Shape = (function() {
* @methodOf Kinetic.Shape.prototype
*/
setSize: function() {
var size = TYPE._getSize(Array.prototype.slice.call(arguments));
var size = Kinetic.Type._getSize(Array.prototype.slice.call(arguments));
this.setWidth(size.width);
this.setHeight(size.height);
},
@@ -412,7 +412,7 @@ Kinetic.Shape = (function() {
* element is the y component
*/
intersects: function() {
var pos = TYPE._getXY(Array.prototype.slice.call(arguments));
var pos = Kinetic.Type._getXY(Array.prototype.slice.call(arguments));
var stage = this.getStage();
var bufferCanvas = stage.bufferCanvas;
bufferCanvas.clear();

7
tests/js/performanceTests.js
View File

@@ -67,7 +67,7 @@ Test.Modules.PERFORMANCE = {
anim.start();
}, 4000);
},
'DRAWING - draw 10,000 small circles with tooltips': function(containerId) {
'*DRAWING - draw 10,000 small circles with tooltips': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
@@ -79,6 +79,7 @@ Test.Modules.PERFORMANCE = {
var colors = ["red", "orange", "yellow", "green", "blue", "cyan", "purple"];
var colorIndex = 0;
startTimer();
for(var n = 0; n < 10000; n++) {
// induce scope
( function() {
@@ -134,7 +135,9 @@ Test.Modules.PERFORMANCE = {
stage.add(circlesLayer);
stage.add(tooltipLayer);
document.body.appendChild(circlesLayer.bufferCanvas.element)
endTimer('drew 10,000 circles');
//document.body.appendChild(circlesLayer.bufferCanvas.element)
},
'DRAWING - draw rect vs image from image data': function(containerId) {