@visactor/vrender 1.1.0-alpha.11 → 1.1.0-alpha.13

package/dist/index.js

@@ -9318,12 +9318,42 @@
         this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1, this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1;
       }
       setAttributesAndPreventAnimate(params, forceUpdateTag = !1, context, ignorePriority) {
-        this.visitTrackedAnimates(animate => {
-          (animate.priority !== 1 / 0 || ignorePriority) && Object.keys(params).forEach(key => {
-            animate.preventAttr(key);
-          });
+        if (!params) return;
+        const keys = Object.keys(params);
+        this.captureTransientFromAttrsBeforePreventAnimate(params, keys, context), this.visitTrackedAnimates(animate => {
+          (animate.priority !== 1 / 0 || ignorePriority) && animate.preventAttrs(keys);
         }), this.applyTransientAttributes(params, forceUpdateTag, context);
       }
+      captureTransientFromAttrsBeforePreventAnimate(params, keys, context) {
+        var _a;
+        const graphicContext = this.context,
+          diffAttrs = null == graphicContext ? void 0 : graphicContext.diffAttrs,
+          updateType = null == context ? void 0 : context.type;
+        if (!keys.length || !graphicContext || !diffAttrs || updateType === exports.AttributeUpdateType.STATE || null != updateType && updateType >= exports.AttributeUpdateType.ANIMATE_BIND && updateType <= exports.AttributeUpdateType.ANIMATE_END) return;
+        let fromAttrs = this.transientFromAttrsBeforePreventAnimateDiffAttrs === diffAttrs && null !== (_a = this.transientFromAttrsBeforePreventAnimate) && void 0 !== _a ? _a : null,
+          captured = !1;
+        for (let i = 0; i < keys.length; i++) {
+          const key = keys[i];
+          if (!Object.prototype.hasOwnProperty.call(diffAttrs, key)) continue;
+          const previousValue = this.attribute[key],
+            nextValue = params[key];
+          isEqual(previousValue, nextValue) || (null != fromAttrs || (fromAttrs = {}), fromAttrs[key] = cloneAttributeValue(previousValue), captured = !0);
+        }
+        captured && (this.transientFromAttrsBeforePreventAnimate = fromAttrs, this.transientFromAttrsBeforePreventAnimateDiffAttrs = diffAttrs);
+      }
+      consumeTransientFromAttrsBeforePreventAnimate(rawDiffAttrs, diffAttrs) {
+        const transientFromAttrs = this.transientFromAttrsBeforePreventAnimate;
+        if (!transientFromAttrs || this.transientFromAttrsBeforePreventAnimateDiffAttrs !== rawDiffAttrs) return null;
+        let fromAttrs = null,
+          remaining = !1;
+        for (const key in transientFromAttrs) Object.prototype.hasOwnProperty.call(transientFromAttrs, key) && (Object.prototype.hasOwnProperty.call(diffAttrs, key) ? (null != fromAttrs || (fromAttrs = {}), fromAttrs[key] = transientFromAttrs[key]) : remaining = !0);
+        if (remaining) {
+          const nextTransientFromAttrs = {};
+          for (const key in transientFromAttrs) Object.prototype.hasOwnProperty.call(transientFromAttrs, key) && !Object.prototype.hasOwnProperty.call(diffAttrs, key) && (nextTransientFromAttrs[key] = transientFromAttrs[key]);
+          this.transientFromAttrsBeforePreventAnimate = nextTransientFromAttrs;
+        } else this.transientFromAttrsBeforePreventAnimate = null, this.transientFromAttrsBeforePreventAnimateDiffAttrs = null;
+        return fromAttrs;
+      }
       setAttributes(params, forceUpdateTag = !1, context) {
         params && ((params = this.onBeforeAttributeUpdate && this.onBeforeAttributeUpdate(params, this.attribute, null, context) || params).background && this.loadImage(params.background, !0), isExternalTexture(params.texture) && this.loadImage(params.texture, !1), params.shadowGraphic && this.setShadowGraphic(params.shadowGraphic), this._setAttributes(params, forceUpdateTag, context));
       }
@@ -32432,6 +32462,18 @@
       return !1;
     }
 
+    const animateUpdateContext = {
+      type: exports.AttributeUpdateType.ANIMATE_UPDATE
+    };
+    function applyAnimationFrameAttributes(target, attributes) {
+      var _a;
+      if (!attributes) return;
+      const transientTarget = target;
+      transientTarget.attribute || (transientTarget.attribute = {});
+      const targetAttribute = transientTarget.attribute;
+      for (const key in attributes) Object.prototype.hasOwnProperty.call(attributes, key) && (targetAttribute[key] = attributes[key]);
+      null === (_a = transientTarget.onAttributeUpdate) || void 0 === _a || _a.call(transientTarget, animateUpdateContext);
+    }
     function applyAnimationTransientAttributes(target, attributes, type = exports.AttributeUpdateType.ANIMATE_UPDATE) {
       var _a;
       if (!attributes) return;
@@ -32446,6 +32488,10 @@
     }
 
     function noop() {}
+    function includesKey$1(keys, key) {
+      for (let i = 0; i < keys.length; i++) if (keys[i] === key) return !0;
+      return !1;
+    }
     class Step {
       constructor(type, props, duration, easing) {
         var _a;
@@ -32501,6 +32547,17 @@
       onBind() {
         "glyph" === this.target.type && (this.syncAttributeUpdate = this._syncAttributeUpdate);
       }
+      runInterpolateUpdate(fromProps, toProps, ratio) {
+        if (this.animate.interpolateUpdateFunction) return void this.animate.interpolateUpdateFunction(fromProps, toProps, ratio, this, this.target);
+        const funcs = this.interpolateUpdateFunctions,
+          propKeys = this.propKeys;
+        if (funcs && propKeys) for (let index = 0; index < funcs.length; index++) {
+          const key = propKeys[index],
+            fromValue = fromProps[key],
+            toValue = toProps[key];
+          funcs[index](key, fromValue, toValue, ratio, this, this.target);
+        }
+      }
       onFirstRun() {}
       onStart() {
         if (!this._hasFirstRun) {
@@ -32515,23 +32572,49 @@
       tryPreventConflict() {
         var _a, _b;
         const animate = this.animate,
-          target = this.target;
-        (null !== (_b = null === (_a = target.forEachTrackedAnimate) || void 0 === _a ? void 0 : _a.bind(target)) && void 0 !== _b ? _b : cb => {
-          var _a;
-          null === (_a = target.animates) || void 0 === _a || _a.forEach(cb);
-        })(a => {
+          target = this.target,
+          forEachTrackedAnimate = null !== (_b = null === (_a = target.forEachTrackedAnimate) || void 0 === _a ? void 0 : _a.bind(target)) && void 0 !== _b ? _b : cb => {
+            var _a;
+            null === (_a = target.animates) || void 0 === _a || _a.forEach(cb);
+          },
+          propKeys = this.propKeys;
+        forEachTrackedAnimate(a => {
           if (a === animate || a.priority > animate.priority || a.priority === 1 / 0) return;
           const fromProps = a.getStartProps();
-          this.propKeys.forEach(key => {
-            null != fromProps[key] && a.preventAttr(key);
-          });
+          let conflictKeys = null;
+          for (let i = 0; i < propKeys.length; i++) {
+            const key = propKeys[i];
+            null != fromProps[key] && (null != conflictKeys ? conflictKeys : conflictKeys = []).push(key);
+          }
+          conflictKeys && a.preventAttrs(conflictKeys);
         });
       }
+      removeKeysFromRecord(record, keys) {
+        if (!record) return record;
+        let hasBlockedKey = !1;
+        for (const key in record) if (Object.prototype.hasOwnProperty.call(record, key) && includesKey$1(keys, key)) {
+          hasBlockedKey = !0;
+          break;
+        }
+        if (!hasBlockedKey) return record;
+        const nextRecord = {};
+        for (const key in record) Object.prototype.hasOwnProperty.call(record, key) && !includesKey$1(keys, key) && (nextRecord[key] = record[key]);
+        return nextRecord;
+      }
       deleteSelfAttr(key) {
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
         var _a;
-        delete this.props[key], this.fromProps && delete this.fromProps[key];
-        const index = this.propKeys.indexOf(key);
-        -1 !== index && (this.propKeys.splice(index, 1), null === (_a = this.interpolateUpdateFunctions) || void 0 === _a || _a.splice(index, 1));
+        if ((null == keys ? void 0 : keys.length) && (this.props = this.removeKeysFromRecord(this.props, keys), this.fromProps = this.removeKeysFromRecord(this.fromProps, keys), this.fromParsedProps = this.removeKeysFromRecord(this.fromParsedProps, keys), this.toParsedProps = this.removeKeysFromRecord(this.toParsedProps, keys), null === (_a = this.propKeys) || void 0 === _a ? void 0 : _a.length)) {
+          const funcs = this.interpolateUpdateFunctions;
+          let writeIndex = 0;
+          for (let readIndex = 0; readIndex < this.propKeys.length; readIndex++) {
+            const propKey = this.propKeys[readIndex];
+            includesKey$1(keys, propKey) || (writeIndex !== readIndex && (this.propKeys[writeIndex] = propKey, funcs && (funcs[writeIndex] = funcs[readIndex])), writeIndex++);
+          }
+          this.propKeys.length = writeIndex, funcs && (funcs.length = writeIndex);
+        }
       }
       trySyncStartProps() {
         this.propKeys.forEach(key => {
@@ -32541,11 +32624,7 @@
       update(end, ratio, out) {
         if (this.onStart(), !this.props || !this.propKeys) return;
         const easedRatio = this.easing(ratio);
-        this.animate.interpolateUpdateFunction ? this.animate.interpolateUpdateFunction(this.fromProps, this.props, easedRatio, this, this.target) : this.interpolateUpdateFunctions.forEach((func, index) => {
-          if (!this.animate.validAttr(this.propKeys[index])) return;
-          const key = this.propKeys[index];
-          func(key, this.fromProps[key], this.props[key], easedRatio, this, this.target);
-        }), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
+        this.runInterpolateUpdate(this.fromProps, this.props, easedRatio), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
       }
       onUpdate(end, ratio, out) {}
       onEnd(cb) {
@@ -32749,19 +32828,34 @@
         }), this.applyTransientFromAttributes();
       }
       deleteSelfAttr(key) {
-        super.deleteSelfAttr(key), delete this.from[key];
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
+        super.deleteSelfAttrs(keys), this.from = this.removeKeysFromRecord(this.from, keys);
       }
       update(end, ratio, out) {
         if (this.onStart(), !this.props || !this.propKeys) return;
         const easedRatio = this.easing(ratio);
-        this.animate.interpolateUpdateFunction ? this.animate.interpolateUpdateFunction(this.from, this.props, easedRatio, this, this.target) : this.interpolateUpdateFunctions.forEach((func, index) => {
-          if (!this.animate.validAttr(this.propKeys[index])) return;
-          const key = this.propKeys[index];
-          func(key, this.from[key], this.props[key], easedRatio, this, this.target);
-        }), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
+        this.runInterpolateUpdate(this.from, this.props, easedRatio), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
       }
     }
 
+    function includesKey(keys, key) {
+      for (let i = 0; i < keys.length; i++) if (keys[i] === key) return !0;
+      return !1;
+    }
+    function removeKeysFromRecord(record, keys) {
+      if (!record) return record;
+      let hasBlockedKey = !1;
+      for (const key in record) if (Object.prototype.hasOwnProperty.call(record, key) && includesKey(keys, key)) {
+        hasBlockedKey = !0;
+        break;
+      }
+      if (!hasBlockedKey) return record;
+      const nextRecord = {};
+      for (const key in record) Object.prototype.hasOwnProperty.call(record, key) && !includesKey(keys, key) && (nextRecord[key] = record[key]);
+      return nextRecord;
+    }
     class Animate {
       constructor(id = Generator.GenAutoIncrementId(), timeline = defaultTimeline, slience) {
         this.id = id, this.status = exports.AnimateStatus.INITIAL, this._timeline = timeline, timeline.addAnimate(this), this.slience = slience, this._startTime = 0, this._duration = 0, this._totalDuration = 0, this._loopCount = 0, this._currentLoop = 0, this._bounce = !1, this._firstStep = null, this._lastStep = null, this._startProps = {}, this._endProps = {}, this._preventAttrs = new Set(), this.currentTime = 0, this.interpolateUpdateFunction = null, this.priority = 0;
@@ -32849,12 +32943,14 @@
         cb ? (this._onRemove || (this._onRemove = []), this._onRemove.push(cb)) : null === (_a = this._onRemove) || void 0 === _a || _a.forEach(cb => cb());
       }
       preventAttr(key) {
-        this._preventAttrs.add(key), delete this._startProps[key], delete this._endProps[key];
-        let step = this._firstStep;
-        for (; step;) step.deleteSelfAttr(key), step = step.next;
+        this.preventAttrs([key]);
       }
       preventAttrs(keys) {
-        keys.forEach(key => this._preventAttrs.add(key));
+        if (!(null == keys ? void 0 : keys.length)) return;
+        for (let i = 0; i < keys.length; i++) this._preventAttrs.add(keys[i]);
+        this._startProps = removeKeysFromRecord(this._startProps, keys), this._endProps = removeKeysFromRecord(this._endProps, keys);
+        let step = this._firstStep;
+        for (; step;) step.deleteSelfAttrs(keys), step = step.next;
       }
       validAttr(key) {
         return !this._preventAttrs.has(key);
@@ -33854,8 +33950,11 @@
         }), this));
       }
       deleteSelfAttr(key) {
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
         this.tasks.forEach(task => {
-          task.animate && task.animate.forEach(animate => animate.preventAttr(key));
+          task.animate && task.animate.forEach(animate => animate.preventAttrs(keys));
         });
       }
       stop(type) {
@@ -34449,6 +34548,25 @@
       }
     }
 
+    function buildAnimationStaticCommitAttrs(target, keys, animate, fallbackAttrs) {
+      var _a;
+      const commitTarget = target,
+        contextFinalAttrs = null === (_a = commitTarget.context) || void 0 === _a ? void 0 : _a.finalAttrs,
+        finalAttribute = "function" == typeof commitTarget.getFinalAttribute ? commitTarget.getFinalAttribute() : commitTarget.finalAttribute;
+      let commitAttrs = null;
+      for (let i = 0; i < keys.length; i++) {
+        const key = keys[i];
+        animate && !animate.validAttr(key) || (contextFinalAttrs && Object.prototype.hasOwnProperty.call(contextFinalAttrs, key) ? (null != commitAttrs || (commitAttrs = {}), commitAttrs[key] = contextFinalAttrs[key]) : finalAttribute && Object.prototype.hasOwnProperty.call(finalAttribute, key) ? (null != commitAttrs || (commitAttrs = {}), commitAttrs[key] = finalAttribute[key]) : fallbackAttrs && Object.prototype.hasOwnProperty.call(fallbackAttrs, key) && (null != commitAttrs || (commitAttrs = {}), commitAttrs[key] = fallbackAttrs[key]));
+      }
+      return commitAttrs;
+    }
+    function commitAnimationStaticAttrs(target, keys, animate, fallbackAttrs) {
+      const commitAttrs = buildAnimationStaticCommitAttrs(target, keys, animate, fallbackAttrs);
+      return !!commitAttrs && (target.setAttributes(commitAttrs, !1, {
+        type: exports.AttributeUpdateType.ANIMATE_END
+      }), !0);
+    }
+
     class TagPointsUpdate extends ACustomAnimate {
       constructor(from, to, duration, easing, params) {
         var _a, _b;
@@ -34467,21 +34585,9 @@
       }
       onBind() {
         super.onBind();
-        const {
-            points: points,
-            segments: segments
-          } = this.target.attribute,
-          {
-            points: pointsTo,
-            segments: segmentsTo
-          } = this.target.getFinalAttribute();
-        this.from = {
-          points: points,
-          segments: segments
-        }, this.to = {
-          points: pointsTo,
-          segments: segmentsTo
-        }, this.props = this.to;
+        const currentAttribute = this.target.attribute,
+          finalAttribute = this.target.getFinalAttribute();
+        this.from = {}, this.to = {}, Object.prototype.hasOwnProperty.call(currentAttribute, "points") && (this.from.points = currentAttribute.points), Object.prototype.hasOwnProperty.call(currentAttribute, "segments") && (this.from.segments = currentAttribute.segments), finalAttribute && Object.prototype.hasOwnProperty.call(finalAttribute, "points") && (this.to.points = finalAttribute.points), finalAttribute && Object.prototype.hasOwnProperty.call(finalAttribute, "segments") && (this.to.segments = finalAttribute.segments), this.props = this.to;
         const originFromPoints = this.getPoints(this.from),
           originToPoints = this.getPoints(this.to, !0);
         this.fromPoints = originFromPoints ? Array.isArray(originFromPoints) ? originFromPoints : [originFromPoints] : [], this.toPoints = originToPoints ? Array.isArray(originToPoints) ? originToPoints : [originToPoints] : [];
@@ -34517,31 +34623,42 @@
         const lastClipRange = this.target.attribute.clipRange;
         isValidNumber$1(lastClipRange * this.clipRange) && (this.clipRange *= lastClipRange);
       }
+      onEnd(cb) {
+        cb ? super.onEnd(cb) : (this.to && commitAnimationStaticAttrs(this.target, Object.keys(this.to), this.animate, this.to), super.onEnd());
+      }
+      applyPointTransientAttributes(attributes) {
+        const validAttrs = {};
+        Object.keys(attributes).forEach(key => {
+          this.animate.validAttr(key) && (validAttrs[key] = attributes[key]);
+        }), Object.keys(validAttrs).length && (applyAnimationFrameAttributes(this.target, validAttrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag());
+      }
       onUpdate(end, ratio, out) {
-        if (end) return Object.keys(this.to).forEach(k => {
-          this.target.attribute[k] = this.to[k];
-        }), this.target.addUpdatePositionTag(), void this.target.addUpdateShapeAndBoundsTag();
-        if (this.points = this.points.map((point, index) => {
-          const newPoint = pointInterpolation(this.interpolatePoints[index][0], this.interpolatePoints[index][1], ratio);
-          return newPoint.context = point.context, newPoint;
-        }), this.clipRange) {
-          if (this.shrinkClipRange) return void (end ? (out.points = this.toPoints, out.clipRange = 1) : (out.points = this.fromPoints, out.clipRange = this.clipRange - (this.clipRange - this.shrinkClipRange) * ratio));
-          applyAnimationTransientAttributes(this.target, {
-            clipRange: this.clipRange + (1 - this.clipRange) * ratio
-          });
-        }
-        if (this.segmentsCache && this.to.segments) {
-          let start = 0;
-          const segments = this.to.segments.map((segment, index) => {
-            const end = start + this.segmentsCache[index],
-              points = this.points.slice(start, end);
-            return start = end, Object.assign(Object.assign({}, segment), {
-              points: points
+        if (end) this.applyPointTransientAttributes(this.to);else {
+          if (this.points = this.points.map((point, index) => {
+            const newPoint = pointInterpolation(this.interpolatePoints[index][0], this.interpolatePoints[index][1], ratio);
+            return newPoint.context = point.context, newPoint;
+          }), this.clipRange) {
+            if (this.shrinkClipRange) return void (end ? (out.points = this.toPoints, out.clipRange = 1) : (out.points = this.fromPoints, out.clipRange = this.clipRange - (this.clipRange - this.shrinkClipRange) * ratio));
+            applyAnimationTransientAttributes(this.target, {
+              clipRange: this.clipRange + (1 - this.clipRange) * ratio
+            });
+          }
+          if (this.segmentsCache && this.to.segments) {
+            let start = 0;
+            const segments = this.to.segments.map((segment, index) => {
+              const end = start + this.segmentsCache[index],
+                points = this.points.slice(start, end);
+              return start = end, Object.assign(Object.assign({}, segment), {
+                points: points
+              });
+            });
+            this.applyPointTransientAttributes({
+              segments: segments
             });
+          } else this.applyPointTransientAttributes({
+            points: this.points
           });
-          this.target.attribute.segments = segments;
-        } else this.target.attribute.points = this.points;
-        this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        }
       }
     }
 
@@ -34562,10 +34679,10 @@
         }), null === (_d = (_c = this.target).applyFinalAttributeToAttribute) || void 0 === _d || _d.call(_c), this.props = to, this.propKeys = this.keys, this.from = from, this.to = to, !1 !== (null === (_e = this.params.controlOptions) || void 0 === _e ? void 0 : _e.immediatelyApply) && applyAppearStartAttributes(this.target, from);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class CommonOut extends ACustomAnimate {
@@ -34580,16 +34697,16 @@
         this.keys.forEach(key => {
           var _a;
           to[key] = 0, from[key] = null !== (_a = attrs[key]) && void 0 !== _a ? _a : 1;
-        }), this.props = to, this.propKeys = this.keys, this.from = from, this.to = to, Object.assign(this.target.attribute, from), this.target.addUpdatePositionTag(), this.target.addUpdateBoundTag();
+        }), this.props = to, this.propKeys = this.keys, this.from = from, this.to = to, applyAnimationTransientAttributes(this.target, from, exports.AttributeUpdateType.ANIMATE_BIND), this.target.addUpdatePositionTag(), this.target.addUpdateBoundTag();
       }
       onEnd(cb) {
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
 
@@ -34632,8 +34749,7 @@
       onEnd() {}
       onUpdate(end, ratio, out) {
         if (null == this.phi || null == this.theta) return;
-        const target = this.target,
-          {
+        const {
             center: center,
             r: r,
             cb: cb
@@ -34644,8 +34760,15 @@
           x = r * Math.sin(phi) * Math.cos(theta) + center.x,
           y = r * Math.cos(phi) + center.y,
           z = r * Math.sin(phi) * Math.sin(theta) + center.z;
-        for (target.attribute.x = x, target.attribute.y = y, target.attribute.z = z, target.attribute.alpha = theta + pi / 2; target.attribute.alpha > pi2;) target.attribute.alpha -= pi2;
-        target.attribute.alpha = pi2 - target.attribute.alpha, target.attribute.zIndex = -1e4 * target.attribute.z, cb && cb(out);
+        let alpha = theta + pi / 2;
+        for (; alpha > pi2;) alpha -= pi2;
+        alpha = pi2 - alpha, applyAnimationFrameAttributes(this.target, {
+          x: x,
+          y: y,
+          z: z,
+          alpha: alpha,
+          zIndex: -1e4 * z
+        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag(), cb && cb(out);
       }
     }
 
@@ -34787,15 +34910,23 @@
         this.propKeys ? this.propKeys && this.propKeys.length > 1 ? this._updateFunction = this.updateAngle : "startAngle" === this.propKeys[0] ? this._updateFunction = this.updateStartAngle : "endAngle" === this.propKeys[0] ? this._updateFunction = this.updateEndAngle : this.valid = !1 : this.valid = !1;
       }
       deleteSelfAttr(key) {
-        delete this.props[key], this.fromProps && delete this.fromProps[key];
-        const index = this.propKeys.indexOf(key);
-        -1 !== index && this.propKeys.splice(index, 1), this.propKeys && this.propKeys.length > 1 ? this._updateFunction = this.updateAngle : "startAngle" === this.propKeys[0] ? this._updateFunction = this.updateStartAngle : "endAngle" === this.propKeys[0] ? this._updateFunction = this.updateEndAngle : this._updateFunction = null;
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
+        var _a;
+        super.deleteSelfAttrs(keys);
+        const firstKey = null === (_a = this.propKeys) || void 0 === _a ? void 0 : _a[0];
+        this.propKeys && this.propKeys.length > 1 ? this._updateFunction = this.updateAngle : this._updateFunction = "startAngle" === firstKey ? this.updateStartAngle : "endAngle" === firstKey ? this.updateEndAngle : null;
       }
       updateStartAngle(ratio) {
-        this.target.attribute.startAngle = this.from.startAngle + (this.to.startAngle - this.from.startAngle) * ratio;
+        applyAnimationFrameAttributes(this.target, {
+          startAngle: this.from.startAngle + (this.to.startAngle - this.from.startAngle) * ratio
+        });
       }
       updateEndAngle(ratio) {
-        this.target.attribute.endAngle = this.from.endAngle + (this.to.endAngle - this.from.endAngle) * ratio;
+        applyAnimationFrameAttributes(this.target, {
+          endAngle: this.from.endAngle + (this.to.endAngle - this.from.endAngle) * ratio
+        });
       }
       updateAngle(ratio) {
         this.updateStartAngle(ratio), this.updateEndAngle(ratio);
@@ -34969,10 +35100,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class GrowCenterOut extends ACustomAnimate {
@@ -34991,10 +35122,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
 
@@ -35074,10 +35205,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     function growHeightOutIndividual(graphic, options, animationParameters) {
@@ -35135,10 +35266,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
 
@@ -35171,7 +35302,9 @@
         var _a, _b;
         const fromPoints = null === (_a = this.from) || void 0 === _a ? void 0 : _a.points,
           toPoints = null === (_b = this.to) || void 0 === _b ? void 0 : _b.points;
-        fromPoints && toPoints && (this.target.attribute.points = fromPoints.map((point, index) => pointInterpolation(fromPoints[index], toPoints[index], ratio)), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag());
+        fromPoints && toPoints && (applyAnimationFrameAttributes(this.target, {
+          points: fromPoints.map((point, index) => pointInterpolation(fromPoints[index], toPoints[index], ratio))
+        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag());
       }
     }
     class GrowPointsIn extends GworPointsBase {
@@ -35403,10 +35536,10 @@
         super(from, to, duration, easing, params);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class GrowRadiusIn extends GrowPointsBase {
@@ -35546,10 +35679,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class GrowWidthOut extends ACustomAnimate {
@@ -35569,10 +35702,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
 
@@ -36345,18 +36478,26 @@
         super.onEnd(cb);
       }
       updateX(ratio) {
-        this.target.attribute.scaleX = this.from.scaleX + (this.to.scaleX - this.from.scaleX) * ratio;
+        this.applyScaleTransientAttrs(ratio, !0, !1);
       }
       updateY(ratio) {
-        this.target.attribute.scaleY = this.from.scaleY + (this.to.scaleY - this.from.scaleY) * ratio;
+        this.applyScaleTransientAttrs(ratio, !1, !0);
       }
       updateXY(ratio) {
-        this.updateX(ratio), this.updateY(ratio);
+        this.applyScaleTransientAttrs(ratio, !0, !0);
+      }
+      applyScaleTransientAttrs(ratio, scaleX, scaleY) {
+        const attrs = {};
+        scaleX && (attrs.scaleX = this.from.scaleX + (this.to.scaleX - this.from.scaleX) * ratio), scaleY && (attrs.scaleY = this.from.scaleY + (this.to.scaleY - this.from.scaleY) * ratio), applyAnimationFrameAttributes(this.target, attrs);
       }
       deleteSelfAttr(key) {
-        delete this.props[key], this.fromProps && delete this.fromProps[key];
-        const index = this.propKeys.indexOf(key);
-        -1 !== index && this.propKeys.splice(index, 1), this.propKeys && this.propKeys.length > 1 ? this._updateFunction = this.updateXY : "scaleX" === this.propKeys[0] ? this._updateFunction = this.updateX : "scaleY" === this.propKeys[0] ? this._updateFunction = this.updateY : this._updateFunction = null;
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
+        var _a;
+        super.deleteSelfAttrs(keys);
+        const firstKey = null === (_a = this.propKeys) || void 0 === _a ? void 0 : _a[0];
+        this.propKeys && this.propKeys.length > 1 ? this._updateFunction = this.updateXY : this._updateFunction = "scaleX" === firstKey ? this.updateX : "scaleY" === firstKey ? this.updateY : null;
       }
       onUpdate(end, ratio, out) {
         this._updateFunction && (this._updateFunction(ratio), this.target.addUpdatePositionTag(), this.target.addUpdateBoundTag());
@@ -36401,10 +36542,10 @@
         super.onEnd(cb);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateBoundTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateBoundTag();
       }
     }
 
@@ -36415,14 +36556,19 @@
       update(end, ratio, out) {
         if (this.onStart(), !this.props || !this.propKeys) return;
         const easedRatio = this.easing(ratio);
-        this.animate.interpolateUpdateFunction ? this.animate.interpolateUpdateFunction(this.fromProps, this.props, easedRatio, this, this.target) : this.interpolateUpdateFunctions.forEach((func, index) => {
-          if (!this.animate.validAttr(this.propKeys[index])) return;
-          const key = this.propKeys[index];
-          func(key, this.fromProps[key], this.props[key], easedRatio, this, this.target);
-        }), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
+        this.runInterpolateUpdate(this.fromProps, this.props, easedRatio), this.onUpdate(end, easedRatio, out), this.syncAttributeUpdate();
       }
     }
 
+    function buildInterpolatedAttrs(keys, from, to, ratio) {
+      const attrs = {};
+      return keys.forEach(key => {
+        attrs[key] = from[key] + (to[key] - from[key]) * ratio;
+      }), attrs;
+    }
+    function applyStoryFrame(target, attrs) {
+      applyAnimationFrameAttributes(target, attrs), target.addUpdatePositionTag(), target.addUpdateShapeAndBoundsTag();
+    }
     class SlideIn extends ACustomAnimate {
       constructor(from, to, duration, easing, params) {
         super(from, to, duration, easing, params);
@@ -36445,10 +36591,7 @@
         "top" === direction ? (from.y = (null !== (_e = attrs.y) && void 0 !== _e ? _e : 0) - distance, to.y = null !== (_f = attrs.y) && void 0 !== _f ? _f : 0, this.propKeys = ["opacity", "baseOpacity", "y"]) : "bottom" === direction ? (from.y = (null !== (_g = attrs.y) && void 0 !== _g ? _g : 0) + distance, to.y = null !== (_h = attrs.y) && void 0 !== _h ? _h : 0, this.propKeys = ["opacity", "baseOpacity", "y"]) : "left" === direction ? (from.x = (null !== (_j = attrs.x) && void 0 !== _j ? _j : 0) - distance, to.x = null !== (_k = attrs.x) && void 0 !== _k ? _k : 0, this.propKeys = ["opacity", "baseOpacity", "x"]) : (from.x = (null !== (_l = attrs.x) && void 0 !== _l ? _l : 0) + distance, to.x = null !== (_m = attrs.x) && void 0 !== _m ? _m : 0, this.propKeys = ["opacity", "baseOpacity", "x"]), this.from = from, this.to = to, this.props = to, applyAppearStartAttributes(this.target, from);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class GrowIn extends ACustomAnimate {
@@ -36473,10 +36616,7 @@
         this.propKeys = ["opacity", "baseOpacity"], "x" !== direction && "xy" !== direction || (from.scaleX = fromScale, to.scaleX = null !== (_f = attrs.scaleX) && void 0 !== _f ? _f : 1, this.propKeys.push("scaleX")), "y" !== direction && "xy" !== direction || (from.scaleY = fromScale, to.scaleY = null !== (_g = attrs.scaleY) && void 0 !== _g ? _g : 1, this.propKeys.push("scaleY")), this.from = from, this.to = to, this.props = to, applyAppearStartAttributes(this.target, from);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class SpinIn extends ACustomAnimate {
@@ -36507,10 +36647,7 @@
         this.propKeys = ["opacity", "baseOpacity", "angle", "scaleX", "scaleY"], this.from = from, this.to = to, this.props = to, applyAppearStartAttributes(this.target, from);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class StrokeIn extends ACustomAnimate {
@@ -36555,8 +36692,10 @@
       }
       onUpdate(end, ratio, out) {
         var _a;
-        const attribute = this.target.attribute;
-        attribute.lineDashOffset = this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio, (null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attribute.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio);
+        const attrs = {
+          lineDashOffset: this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio
+        };
+        (null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attrs.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio), applyAnimationTransientAttributes(this.target, attrs);
       }
       onEnd() {
         var _a;
@@ -36607,8 +36746,10 @@
       }
       onUpdate(end, ratio, out) {
         var _a;
-        const attribute = this.target.attribute;
-        attribute.lineDashOffset = this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio, (null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attribute.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio);
+        const attrs = {
+          lineDashOffset: this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio
+        };
+        (null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attrs.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio), applyAnimationTransientAttributes(this.target, attrs);
       }
     }
     class MoveScaleIn extends ACustomAnimate {
@@ -36705,10 +36846,7 @@
         "top" === direction ? (from.y = null !== (_g = attrs.y) && void 0 !== _g ? _g : 0, to.y = (null !== (_h = attrs.y) && void 0 !== _h ? _h : 0) - distance, this.propKeys = ["opacity", "baseOpacity", "y"]) : "bottom" === direction ? (from.y = null !== (_j = attrs.y) && void 0 !== _j ? _j : 0, to.y = (null !== (_k = attrs.y) && void 0 !== _k ? _k : 0) + distance, this.propKeys = ["opacity", "baseOpacity", "y"]) : "left" === direction ? (from.x = null !== (_l = attrs.x) && void 0 !== _l ? _l : 0, to.x = (null !== (_m = attrs.x) && void 0 !== _m ? _m : 0) - distance, this.propKeys = ["opacity", "baseOpacity", "x"]) : (from.x = null !== (_o = attrs.x) && void 0 !== _o ? _o : 0, to.x = (null !== (_p = attrs.x) && void 0 !== _p ? _p : 0) + distance, this.propKeys = ["opacity", "baseOpacity", "x"]), this.from = from, this.to = to, this.props = to;
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class GrowOut extends ACustomAnimate {
@@ -36733,10 +36871,7 @@
         this.propKeys = ["opacity", "baseOpacity"], "x" !== direction && "xy" !== direction || (from.scaleX = null !== (_h = attrs.scaleX) && void 0 !== _h ? _h : 1, to.scaleX = toScale, this.propKeys.push("scaleX")), "y" !== direction && "xy" !== direction || (from.scaleY = null !== (_j = attrs.scaleY) && void 0 !== _j ? _j : 1, to.scaleY = toScale, this.propKeys.push("scaleY")), this.from = from, this.to = to, this.props = to;
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class SpinOut extends ACustomAnimate {
@@ -36767,10 +36902,7 @@
         this.propKeys = ["opacity", "baseOpacity", "angle", "scaleX", "scaleY"], this.from = from, this.to = to, this.props = to;
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
-        this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+        applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
       }
     }
     class MoveScaleOut extends ACustomAnimate {
@@ -36855,20 +36987,20 @@
       onUpdate(end, ratio, out) {
         const angle = ratio * Math.PI * this.pulseCount,
           pulseValue = Math.abs(Math.sin(angle)),
-          attribute = this.target.attribute;
+          attrs = {};
         if (this.useOpacity) {
           const opacity = 1 + (this.pulseOpacity - 1) * pulseValue;
-          this.useStroke && (attribute.strokeOpacity = (this.originalAttributes.strokeOpacity || 1) * opacity), this.useFill && (attribute.fillOpacity = (this.originalAttributes.fillOpacity || 1) * opacity);
+          this.useStroke && (attrs.strokeOpacity = (this.originalAttributes.strokeOpacity || 1) * opacity), this.useFill && (attrs.fillOpacity = (this.originalAttributes.fillOpacity || 1) * opacity);
         }
         if (this.useScale) {
           const scale = 1 + (this.pulseScale - 1) * pulseValue;
-          attribute.scaleX = (this.originalAttributes.scaleX || 1) * scale, attribute.scaleY = (this.originalAttributes.scaleY || 1) * scale;
+          attrs.scaleX = (this.originalAttributes.scaleX || 1) * scale, attrs.scaleY = (this.originalAttributes.scaleY || 1) * scale;
         }
-        this.useColor && this.pulseColor && this.applyColorPulse(attribute, pulseValue), this.target.addUpdateShapeAndBoundsTag(), this.target.addUpdatePositionTag();
+        this.useColor && this.pulseColor && this.applyColorPulse(attrs, pulseValue), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdateShapeAndBoundsTag(), this.target.addUpdatePositionTag();
       }
-      applyColorPulse(attribute, pulseValue) {
+      applyColorPulse(attrs, pulseValue) {
         const colorRatio = this.pulseColorIntensity * pulseValue;
-        this.useFill && this.originalFill && this.pulseColor && (attribute.fill = interpolateColor(this.originalFill, this.pulseColor, colorRatio, !0)), this.useStroke && this.originalStroke && this.pulseColor && (attribute.stroke = interpolateColor(this.originalStroke, this.pulseColor, colorRatio, !0));
+        this.useFill && this.originalFill && this.pulseColor && (attrs.fill = interpolateColor(this.originalFill, this.pulseColor, colorRatio, !0)), this.useStroke && this.originalStroke && this.pulseColor && (attrs.stroke = interpolateColor(this.originalStroke, this.pulseColor, colorRatio, !0));
       }
       onEnd() {
         super.onEnd(), this.target.setAttributes(this.originalAttributes);
@@ -36883,52 +37015,52 @@
       width: !0,
       height: !0
     };
+    function includesChannel(channels, key) {
+      for (let i = 0; i < channels.length; i++) if (channels[i] === key) return !0;
+      return !1;
+    }
+    function filterExcludedChannels(diffAttrs, excludeChannels) {
+      if (!(null == excludeChannels ? void 0 : excludeChannels.length)) return diffAttrs;
+      const nextAttrs = {};
+      for (const key in diffAttrs) Object.prototype.hasOwnProperty.call(diffAttrs, key) && !includesChannel(excludeChannels, key) && (nextAttrs[key] = diffAttrs[key]);
+      return nextAttrs;
+    }
     class Update extends ACustomAnimate {
       constructor(from, to, duration, easing, params) {
-        super(from, to, duration, easing, params), this.clipPathSyncKeys = null, this.clipPathSyncParent = null, this.clipPathSyncChildIndex = -1, this.clipPathSyncDisabled = !1;
+        super(from, to, duration, easing, params), this.updateFromAttrs = null, this.clipPathSyncKeys = null, this.clipPathSyncParent = null, this.clipPathSyncChildIndex = -1, this.clipPathSyncDisabled = !1;
       }
       onBind() {
-        var _a, _b;
+        var _a;
         super.onBind();
+        const targetContext = null !== (_a = this.target.context) && void 0 !== _a ? _a : {};
         let {
           diffAttrs = {}
-        } = null !== (_a = this.target.context) && void 0 !== _a ? _a : {};
+        } = targetContext;
         const {
-          options: options
-        } = this.params;
-        diffAttrs = Object.assign({}, diffAttrs), (null === (_b = null == options ? void 0 : options.excludeChannels) || void 0 === _b ? void 0 : _b.length) && options.excludeChannels.forEach(channel => {
-          delete diffAttrs[channel];
-        }), this.props = diffAttrs, this.clipPathSyncKeys = Object.keys(diffAttrs).filter(key => clipPathGeometryAttrs[key]), this.clipPathSyncDisabled = !this.clipPathSyncKeys.length, this.syncParentClipPathToTarget();
+            options: options
+          } = this.params,
+          rawDiffAttrs = diffAttrs;
+        diffAttrs = filterExcludedChannels(diffAttrs, null == options ? void 0 : options.excludeChannels), this.props = diffAttrs;
+        const consumeTransientFromAttrs = this.target.consumeTransientFromAttrsBeforePreventAnimate;
+        this.updateFromAttrs = "function" == typeof consumeTransientFromAttrs ? consumeTransientFromAttrs.call(this.target, rawDiffAttrs, diffAttrs) : null, this.clipPathSyncKeys = Object.keys(diffAttrs).filter(key => clipPathGeometryAttrs[key]), this.clipPathSyncDisabled = !this.clipPathSyncKeys.length, this.syncParentClipPathToTarget();
       }
-      getStaticCommitAttrs() {
-        var _a;
-        if (!this.props) return null;
-        const target = this.target,
-          contextFinalAttrs = null === (_a = target.context) || void 0 === _a ? void 0 : _a.finalAttrs,
-          finalAttribute = "function" == typeof target.getFinalAttribute ? target.getFinalAttribute() : target.finalAttribute,
-          commitAttrs = {};
-        return Object.keys(this.props).forEach(key => {
-          contextFinalAttrs && Object.prototype.hasOwnProperty.call(contextFinalAttrs, key) ? commitAttrs[key] = contextFinalAttrs[key] : finalAttribute && Object.prototype.hasOwnProperty.call(finalAttribute, key) ? commitAttrs[key] = finalAttribute[key] : this.animate.validAttr(key) && (commitAttrs[key] = this.props[key]);
-        }), Object.keys(commitAttrs).length ? commitAttrs : null;
+      trySyncStartProps() {
+        const updateFromAttrs = this.updateFromAttrs;
+        this.propKeys.forEach(key => {
+          this.fromProps[key] = updateFromAttrs && Object.prototype.hasOwnProperty.call(updateFromAttrs, key) ? updateFromAttrs[key] : this.animate.target.getComputedAttribute(key);
+        });
       }
       onEnd(cb) {
-        if (cb) return void super.onEnd(cb);
-        const commitAttrs = this.getStaticCommitAttrs();
-        commitAttrs && this.target.setAttributes(commitAttrs, !1, {
-          type: exports.AttributeUpdateType.ANIMATE_END
-        }), this.syncParentClipPathToTarget(), super.onEnd();
+        var _a;
+        cb ? super.onEnd(cb) : (this.props && commitAnimationStaticAttrs(this.target, null !== (_a = this.propKeys) && void 0 !== _a ? _a : Object.keys(this.props), this.animate, this.props), this.syncParentClipPathToTarget(), super.onEnd());
       }
       update(end, ratio, out) {
         if (this.onStart(), !this.props || !this.propKeys) return;
         const easedRatio = this.easing(ratio);
-        this.animate.interpolateUpdateFunction ? this.animate.interpolateUpdateFunction(this.fromProps, this.props, easedRatio, this, this.target) : this.interpolateUpdateFunctions.forEach((func, index) => {
-          if (!this.animate.validAttr(this.propKeys[index])) return;
-          const key = this.propKeys[index];
-          func(key, this.fromProps[key], this.props[key], easedRatio, this, this.target);
-        }), this.syncParentClipPathToTarget(), this.onUpdate(end, easedRatio, out);
+        this.runInterpolateUpdate(this.fromProps, this.props, easedRatio), this.syncParentClipPathToTarget(), this.onUpdate(end, easedRatio, out);
       }
       syncParentClipPathToTarget() {
-        var _a, _b;
+        var _a, _b, _c, _d;
         if (this.clipPathSyncDisabled) return;
         const target = this.target,
           parent = target.parent,
@@ -36939,7 +37071,7 @@
         const clipGraphic = path[childIndex];
         if (!(null == clipGraphic ? void 0 : clipGraphic.attribute) || clipGraphic.type !== target.type || !this.isClipPathStaticTarget(clipGraphic)) return;
         const syncAttrs = this.buildClipPathTransientAttrs(clipGraphic);
-        syncAttrs && applyAnimationTransientAttributes(clipGraphic, syncAttrs, exports.AttributeUpdateType.ANIMATE_UPDATE);
+        syncAttrs && (applyAnimationFrameAttributes(clipGraphic, syncAttrs), null === (_c = clipGraphic.addUpdatePositionTag) || void 0 === _c || _c.call(clipGraphic), null === (_d = clipGraphic.addUpdateShapeAndBoundsTag) || void 0 === _d || _d.call(clipGraphic));
       }
       getClipPathSyncChildIndex(parent) {
         var _a;
@@ -37083,10 +37215,10 @@
         super(from, to, duration, easing, params);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class MoveIn extends MoveBase {
@@ -37142,10 +37274,10 @@
         super(from, to, duration, easing, params);
       }
       onUpdate(end, ratio, out) {
-        const attribute = this.target.attribute;
+        const attrs = {};
         this.propKeys.forEach(key => {
-          attribute[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
-        }), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
+          attrs[key] = this.from[key] + (this.to[key] - this.from[key]) * ratio;
+        }), applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag();
       }
     }
     class RotateIn extends RotateBase {
@@ -37188,7 +37320,7 @@
             pos: pos,
             angle: angle
           } = this.path.getAttrAt(at);
-        attrs.x = pos.x, attrs.y = pos.y, this.changeAngle && (attrs.angle = angle + this.initAngle), this.cb && this.cb(this.from, this.to, ratio, this.target), end && this.commitOnEnd ? this.target.setAttributes(attrs) : applyAnimationTransientAttributes(this.target, attrs);
+        attrs.x = pos.x, attrs.y = pos.y, this.changeAngle && (attrs.angle = angle + this.initAngle), this.cb && this.cb(this.from, this.to, ratio, this.target), end && this.commitOnEnd ? this.target.setAttributes(attrs) : (applyAnimationFrameAttributes(this.target, attrs), this.target.addUpdatePositionTag(), this.target.addUpdateShapeAndBoundsTag());
       }
     }
 
@@ -40941,11 +41073,7 @@
       if (!graphic || !targetAttrs) return;
       const committedTargetAttrs = cloneDeep(targetAttrs),
         transientStartAttrs = cloneDeep(null != startAttrs ? startAttrs : graphic.attribute);
-      graphic.setAttributes(committedTargetAttrs);
-      const baseAttributes = graphic.baseAttributes;
-      baseAttributes && "object" == typeof baseAttributes && Object.keys(committedTargetAttrs).forEach(key => {
-        baseAttributes[key] = cloneDeep(committedTargetAttrs[key]);
-      }), null === (_b = (_a = graphic).setFinalAttributes) || void 0 === _b || _b.call(_a, committedTargetAttrs), null === (_d = (_c = graphic).setAttributesAndPreventAnimate) || void 0 === _d || _d.call(_c, transientStartAttrs, !1, {
+      graphic.setAttributes(committedTargetAttrs), null === (_b = (_a = graphic).setFinalAttributes) || void 0 === _b || _b.call(_a, committedTargetAttrs), null === (_d = (_c = graphic).setAttributesAndPreventAnimate) || void 0 === _d || _d.call(_c, transientStartAttrs, !1, {
         type: exports.AttributeUpdateType.ANIMATE_BIND
       });
     }
@@ -41685,7 +41813,10 @@
         }), this.completeBind(animator);
       }
       deleteSelfAttr(key) {
-        super.deleteSelfAttr(key), this._animator.deleteSelfAttr(key);
+        this.deleteSelfAttrs([key]);
+      }
+      deleteSelfAttrs(keys) {
+        super.deleteSelfAttrs(keys), this._animator.deleteSelfAttrs(keys);
       }
       tryPreventConflict() {}
     }
@@ -54543,7 +54674,7 @@
         return resolveLegacyApp().createStage(params);
     }
 
-    const version = "1.1.0-alpha.11";
+    const version = "1.1.0-alpha.13";
 
     exports.AComponentAnimate = AComponentAnimate;
     exports.ACustomAnimate = ACustomAnimate;