diff --git a/player/index.html b/player/index.html
index 7004baa..73cde14 100644
--- a/player/index.html
+++ b/player/index.html
@@ -194,12 +194,12 @@
         container: elem,
         renderer: 'canvas',
         loop: false,
-        autoplay: false,
+        autoplay: true,
         rendererSettings: {
             progressiveLoad:false,
             imagePreserveAspectRatio: 'xMidYMid meet'
         },
-        path: 'exports/render/data.json'
+        path: 'exports/render/data2.json'
     };
     anim = lottie.loadAnimation(animData);
 
diff --git a/player/js/elements/canvasElements/CVShapeElement.js b/player/js/elements/canvasElements/CVShapeElement.js
index 2c0dae1..299481d 100644
--- a/player/js/elements/canvasElements/CVShapeElement.js
+++ b/player/js/elements/canvasElements/CVShapeElement.js
@@ -383,39 +383,40 @@
 
 CVShapeElement.prototype.renderGradientFill = function(styleData,itemData, groupTransform){
     var styleElem = itemData.style;
+    if(!styleElem.grd || itemData.g._mdf || itemData.s._mdf || itemData.e._mdf || (styleData.t !== 1 && (itemData.h._mdf || itemData.a._mdf))) {
+        var ctx = this.globalData.canvasContext;
+        var grd;
+        var pt1 = itemData.s.v, pt2 = itemData.e.v;
+        pt1 = groupTransform.mat.applyToPointArray(pt1[0], pt1[1], 0);
+        pt2 = groupTransform.mat.applyToPointArray(pt2[0], pt2[1], 0);
+        if(styleData.t === 1) {
+            grd=ctx.createLinearGradient(pt1[0],pt1[1],pt2[0],pt2[1]);
+        } else {
+            var rad;
+            rad = Math.sqrt(Math.pow(pt1[0] - pt2[0], 2) + Math.pow(pt1[1] - pt2[1], 2));
+            var ang = Math.atan2(pt2[1] - pt1[1], pt2[0] - pt1[0]);
 
-    var ctx = this.globalData.canvasContext;
-
-    var grd;
-    var pt1 = itemData.s.v, pt2 = itemData.e.v;
-    pt1 = groupTransform.mat.applyToPointArray(pt1[0], pt1[1], 0);
-    pt2 = groupTransform.mat.applyToPointArray(pt2[0], pt2[1], 0);
-    if(styleData.t === 1) {
-        grd=ctx.createLinearGradient(pt1[0],pt1[1],pt2[0],pt2[1]);
-    } else {
-        var rad;
-        rad = Math.sqrt(Math.pow(pt1[0] - pt2[0], 2) + Math.pow(pt1[1] - pt2[1], 2));
-        var ang = Math.atan2(pt2[1] - pt1[1], pt2[0] - pt1[0]);
-
-        var percent = itemData.h.v >= 1 ? 0.99 : itemData.h.v <= -1 ? -0.99: itemData.h.v;
-        var dist = rad * percent;
-        var x = Math.cos(ang + itemData.a.v) * dist + pt1[0];
-        var y = Math.sin(ang + itemData.a.v) * dist + pt1[1];
-        var grd=ctx.createRadialGradient(x,y,0,pt1[0],pt1[1],rad);
-    }
-
-    var i, len = styleData.g.p;
-    var cValues = itemData.g.c;
-    var opacity = 1;
-
-    for (i = 0; i < len; i += 1){
-        if(itemData.g._hasOpacity && itemData.g._collapsable) {
-            opacity = itemData.g.o[i*2 + 1];
+            var percent = itemData.h.v >= 1 ? 0.99 : itemData.h.v <= -1 ? -0.99: itemData.h.v;
+            var dist = rad * percent;
+            var x = Math.cos(ang + itemData.a.v) * dist + pt1[0];
+            var y = Math.sin(ang + itemData.a.v) * dist + pt1[1];
+            var grd=ctx.createRadialGradient(x,y,0,pt1[0],pt1[1],rad);
         }
-        grd.addColorStop(cValues[i * 4] / 100,'rgba('+ cValues[i * 4 + 1] + ',' + cValues[i * 4 + 2] + ','+cValues[i * 4 + 3] + ',' + opacity + ')');
+
+        var i, len = styleData.g.p;
+        var cValues = itemData.g.c;
+        var opacity = 1;
+
+        for (i = 0; i < len; i += 1){
+            if(itemData.g._hasOpacity && itemData.g._collapsable) {
+                opacity = itemData.g.o[i*2 + 1];
+            }
+            grd.addColorStop(cValues[i * 4] / 100,'rgba('+ cValues[i * 4 + 1] + ',' + cValues[i * 4 + 2] + ','+cValues[i * 4 + 3] + ',' + opacity + ')');
+        }
+        styleElem.grd = grd;
     }
+    styleElem.coOp = itemData.o.v*groupTransform.opacity;
     
-    styleElem.grd = grd;
 };
 
 CVShapeElement.prototype.renderStroke = function(styleData,itemData, groupTransform){