konvajs / konva

Konva.js is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.
http://konvajs.org/
Other
11.72k stars 933 forks source link

Performance issue for _clearCache #1608

Closed yinguangyao closed 1 year ago

yinguangyao commented 1 year ago

This is an example given by Leaferjs, comparing the time required to create 1 million rectangles. Konva takes the longest time to create 1 million rectangles, approximately over 40 seconds Here is a Flame Graph created by Konva with 330000 rectangles, it can be seen that _getProtoListeners is called frequently

image

The culprit is that the absoluteTransformChange event is sent, because fire calls _getProtoListeners

  _clearSelfAndDescendantCache(attr?: string) {
    this._clearCache(attr);
    // trigger clear cache, so transformer can use it
    if (attr === ABSOLUTE_TRANSFORM) {
      this.fire('absoluteTransformChange');
    }
  }

Is it possible to judge that if there is no Transformer, do not fire?

lavrton commented 1 year ago

I am not sure if it will help much. Need to verify that first.