Merge branch 'master' of github.com:konvajs/konva

src/Container.ts

@@ -404,7 +404,7 @@ export abstract class Container extends Node {
     var layer = this.getLayer(),
       canvas = can || (layer && layer.getCanvas()),
       context = canvas && canvas.getContext(),
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       cachedSceneCanvas = cachedCanvas && cachedCanvas.scene;
 
     if (this.isVisible() || caching) {
@@ -423,7 +423,7 @@ export abstract class Container extends Node {
     var layer = this.getLayer(),
       canvas = can || (layer && layer.hitCanvas),
       context = canvas && canvas.getContext(),
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       cachedHitCanvas = cachedCanvas && cachedCanvas.hit;
 
     if (this.shouldDrawHit(canvas) || caching) {

src/Node.ts

@@ -70,6 +70,7 @@ type globalCompositeOperationType =
 var ABSOLUTE_OPACITY = 'absoluteOpacity',
   ABSOLUTE_TRANSFORM = 'absoluteTransform',
   ABSOLUTE_SCALE = 'absoluteScale',
+  CANVAS = 'canvas',
   CHANGE = 'Change',
   CHILDREN = 'children',
   KONVA = 'konva',
@@ -116,7 +117,7 @@ export abstract class Node {
   attrs: any = {};
   index = 0;
   parent: Container = null;
-  _cache: any = {};
+  _cache: Map<string, any> = new Map<string, any>();
   _lastPos = null;
 
   _filterUpToDate = false;
@@ -160,21 +161,25 @@ export abstract class Node {
   /** @lends Konva.Node.prototype */
   _clearCache(attr) {
     if (attr) {
-      delete this._cache[attr];
+      this._cache.delete(attr);
     } else {
-      this._cache = {};
+      this._cache.clear();
     }
   }
   _getCache(attr, privateGetter) {
-    var cache = this._cache[attr];
+    var cache = this._cache.get(attr);
 
     // if not cached, we need to set it using the private getter method.
     if (cache === undefined) {
-      this._cache[attr] = cache = privateGetter.call(this);
+      cache = privateGetter.call(this);
+      this._cache.set(attr, cache);
     }
 
     return cache;
   }
+  _getCanvasCache() {
+    return this._cache.get(CANVAS);
+  }
   /*
    * when the logic for a cached result depends on ancestor propagation, use this
    * method to clear self and children cache
@@ -183,7 +188,7 @@ export abstract class Node {
     this._clearCache(attr);
 
     // skip clearing if node is cached with canvas
-    if (this._cache.canvas) {
+    if (this._getCanvasCache()) {
       return;
     }
     if (this.children) {
@@ -201,7 +206,7 @@ export abstract class Node {
    * node.clearCache();
    */
   clearCache() {
-    delete this._cache.canvas;
+    this._cache.delete(CANVAS);
     this._filterUpToDate = false;
     this._clearSelfAndDescendantCache(undefined);
     return this;
@@ -339,13 +344,13 @@ export abstract class Node {
       sceneContext.restore();
     }
 
-    this._cache.canvas = {
+    this._cache.set(CANVAS, {
       scene: cachedSceneCanvas,
       filter: cachedFilterCanvas,
       hit: cachedHitCanvas,
       x: x,
       y: y
-    };
+    });
 
     return this;
   }
@@ -430,7 +435,9 @@ export abstract class Node {
     context.save();
     context._applyOpacity(this);
     context._applyGlobalCompositeOperation(this);
-    context.translate(this._cache.canvas.x, this._cache.canvas.y);
+
+    const canvasCache = this._getCanvasCache();
+    context.translate(canvasCache.x, canvasCache.y);
 
     var cacheCanvas = this._getCachedSceneCanvas();
     var ratio = cacheCanvas.pixelRatio;
@@ -445,17 +452,17 @@ export abstract class Node {
     context.restore();
   }
   _drawCachedHitCanvas(context) {
-    var cachedCanvas = this._cache.canvas,
-      hitCanvas = cachedCanvas.hit;
+    var canvasCache = this._getCanvasCache(),
+      hitCanvas = canvasCache.hit;
     context.save();
     context._applyGlobalCompositeOperation(this);
-    context.translate(this._cache.canvas.x, this._cache.canvas.y);
+    context.translate(canvasCache.x, canvasCache.y);
     context.drawImage(hitCanvas._canvas, 0, 0);
     context.restore();
   }
   _getCachedSceneCanvas() {
     var filters = this.filters(),
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       sceneCanvas = cachedCanvas.scene,
       filterCanvas = cachedCanvas.filter,
       filterContext = filterCanvas.getContext(),

src/Shape.ts

@@ -406,7 +406,7 @@ export class Shape extends Node {
     var layer = this.getLayer(),
       canvas = can || layer.getCanvas(),
       context = canvas.getContext(),
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       drawFunc = this.sceneFunc(),
       hasShadow = this.hasShadow(),
       hasStroke = this.hasStroke(),
@@ -530,7 +530,7 @@ export class Shape extends Node {
       canvas = can || layer.hitCanvas,
       context = canvas.getContext(),
       drawFunc = this.hitFunc() || this.sceneFunc(),
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       cachedHitCanvas = cachedCanvas && cachedCanvas.hit;
 
     if (!this.colorKey) {
@@ -581,7 +581,7 @@ export class Shape extends Node {
    */
   drawHitFromCache(alphaThreshold) {
     var threshold = alphaThreshold || 0,
-      cachedCanvas = this._cache.canvas,
+      cachedCanvas = this._getCanvasCache(),
       sceneCanvas = this._getCachedSceneCanvas(),
       hitCanvas = cachedCanvas.hit,
       hitContext = hitCanvas.getContext(),