perf(animation): using will-change when using progressStep()

Author: manucorporat

src/animations/animation.ts

@@ -618,16 +618,21 @@ export class Animation {
     }
 
     if (Object.keys(this._fx).length) {
+      easing = (forcedLinearEasing ? 'linear' : this.getEasing());
       for (i = 0; i < this._el.length; i++) {
-        // all parent/child animations should have the same duration
-        // ******** DOM WRITE ****************
-        this._el[i].style[CSS.transitionDuration] = duration + 'ms';
-
-        // each animation can have a different easing
-        easing = (forcedLinearEasing ? 'linear' : this.getEasing());
-        if (easing) {
+        if (duration > 0) {
+          // all parent/child animations should have the same duration
           // ******** DOM WRITE ****************
-          this._el[i].style[CSS.transitionTimingFn] = easing;
+          this._el[i].style[CSS.transition] = '';
+          this._el[i].style[CSS.transitionDuration] = duration + 'ms';
+
+          // each animation can have a different easing
+          if (easing) {
+            // ******** DOM WRITE ****************
+            this._el[i].style[CSS.transitionTimingFn] = easing;
+          }
+        } else {
+          this._el[i].style[CSS.transition] = 'none';
         }
       }
     }
@@ -824,6 +829,9 @@ export class Animation {
       this._c[i].progressStart();
     }
 
+    // ******** DOM WRITE ****************
+    this._willChg(true);
+
     // ******** DOM WRITE ****************
     this._before();