diff --git a/player/index.html b/player/index.html
index cb85320..9c0b10a 100644
--- a/player/index.html
+++ b/player/index.html
@@ -12,8 +12,8 @@
 
         #bodymovin{
             background-color:#333;
-            width:100%;
-            height:100%;
+            width:1024px;
+            height:768px;
             /*width:800px;
             height:500px;*/
             display:block;
@@ -128,6 +128,10 @@
         path: 'exports/render/data.json'
     };
     anim = bodymovin.loadAnimation(animData);
+    anim.addEventListener('complete', function(){
+        console.log('compeded');
+        anim.goToAndStop(0);
+    });
 
 </script>
 </body>
diff --git a/player/js/animation/AnimationItem.js b/player/js/animation/AnimationItem.js
index 7df5f96..0ad6e82 100644
--- a/player/js/animation/AnimationItem.js
+++ b/player/js/animation/AnimationItem.js
@@ -134,6 +134,7 @@
     if(prerender === 'false'){
         params.prerender = false;
     }
+    console.log('animElements:', params)
     this.setParams(params);
 };
 
diff --git a/player/js/elements/BaseElement.js b/player/js/elements/BaseElement.js
index 833c499..72b0931 100644
--- a/player/js/elements/BaseElement.js
+++ b/player/js/elements/BaseElement.js
@@ -108,7 +108,7 @@
     if(this.data.ty === 0 || this.data.xt){
         this.compInterface = CompExpressionInterface(this);
     } else if(this.data.ty === 4){
-        this.layerInterface.shapeInterface = ShapeExpressionInterface.createShapeInterface(this.shapesData,this.viewData,this.layerInterface);
+        this.layerInterface.shapeInterface = ShapeExpressionInterface.createShapeInterface(this.shapesData,this.itemsData,this.layerInterface);
     } else if(this.data.ty === 5){
         this.layerInterface.textInterface = TextExpressionInterface(this);
     }
diff --git a/player/js/elements/ShapeElement.js b/player/js/elements/ShapeElement.js
index 46e624b..51cc575 100644
--- a/player/js/elements/ShapeElement.js
+++ b/player/js/elements/ShapeElement.js
@@ -2,8 +2,10 @@
     this.shapes = [];
     this.shapesData = data.shapes;
     this.stylesList = [];
-    this.viewData = [];
+    this.itemsData = [];
+    this.prevViewData = [];
     this.shapeModifiers = [];
+    this.processedElements = [];
     this._parent.constructor.call(this,data,parentContainer,globalData,comp, placeholder);
 }
 createElement(SVGBaseElement, IShapeElement);
@@ -22,16 +24,43 @@
     '3': 'butt'
 }
 
+IShapeElement.prototype.searchProcessedElement = function(elem){
+    var i = this.processedElements.length;
+    while(i){
+        i -= 1;
+        if(this.processedElements[i].elem === elem){
+            return this.processedElements[i].pos;
+        }
+    }
+    return 0;
+};
+
+IShapeElement.prototype.addProcessedElement = function(elem, pos){
+    var i = this.processedElements.length;
+    while(i){
+        i -= 1;
+        if(this.processedElements[i].elem === elem){
+            this.processedElements[i].pos = pos;
+            break;
+        }
+    }
+    if(i === 0){
+        this.processedElements.push({
+            elem: elem,
+            pos: pos
+        })
+    }
+};
+
 IShapeElement.prototype.buildExpressionInterface = function(){};
 
 IShapeElement.prototype.createElements = function(){
     //TODO check if I can use symbol so i can set its viewBox
     this._parent.createElements.call(this);
-    this.searchShapes(this.shapesData,this.viewData,this.layerElement,this.dynamicProperties, 0);
+    this.searchShapes(this.shapesData,this.itemsData,this.prevViewData,this.layerElement,this.dynamicProperties, 0, [], true);
     if(!this.data.hd || this.data.td){
         styleUnselectableDiv(this.layerElement);
     }
-    //this.elemInterface.registerShapeExpressionInterface(ShapeExpressionInterface.createShapeInterface(this.shapesData,this.viewData,this.elemInterface));
 };
 
 IShapeElement.prototype.setGradientData = function(pathElement,arr,data){
@@ -98,140 +127,229 @@
     }
 };
 
-IShapeElement.prototype.searchShapes = function(arr,data,container,dynamicProperties, level, transformers){
-    transformers = transformers || [];
+IShapeElement.prototype.createStyleElement = function(data, level, dynamicProperties){
+    var elementData = {
+    };
+    styleOb = {
+        data: data,
+        type: data.ty,
+        d: '',
+        ld: '',
+        lvl: level,
+        mdf: false,
+        closed: false
+    };
+    var pathElement = document.createElementNS(svgNS, "path");
+    elementData.o = PropertyFactory.getProp(this,data.o,0,0.01,dynamicProperties);
+    if(data.ty == 'st' || data.ty == 'gs') {
+        pathElement.setAttribute('stroke-linecap', this.lcEnum[data.lc] || 'round');
+        ////pathElement.style.strokeLinecap = this.lcEnum[data.lc] || 'round';
+        pathElement.setAttribute('stroke-linejoin',this.ljEnum[data.lj] || 'round');
+        ////pathElement.style.strokeLinejoin = this.ljEnum[data.lj] || 'round';
+        pathElement.setAttribute('fill-opacity','0');
+        ////pathElement.style.fillOpacity = 0;
+        if(data.lj == 1) {
+            pathElement.setAttribute('stroke-miterlimit',data.ml);
+            ////pathElement.style.strokeMiterlimit = data.ml;
+        }
+
+        elementData.w = PropertyFactory.getProp(this,data.w,0,null,dynamicProperties);
+        if(data.d){
+            var d = PropertyFactory.getDashProp(this,data.d,'svg',dynamicProperties);
+            if(!d.k){
+                pathElement.setAttribute('stroke-dasharray', d.dasharray);
+                ////pathElement.style.strokeDasharray = d.dasharray;
+                pathElement.setAttribute('stroke-dashoffset', d.dashoffset);
+                ////pathElement.style.strokeDashoffset = d.dashoffset;
+            }
+            elementData.d = d;
+        }
+
+    }
+    if(data.ty == 'fl' || data.ty == 'st'){
+        elementData.c = PropertyFactory.getProp(this,data.c,1,255,dynamicProperties);
+    } else {
+        elementData.g = PropertyFactory.getGradientProp(this,data.g,dynamicProperties);
+        if(data.t == 2){
+            elementData.h = PropertyFactory.getProp(this,data.h,1,0.01,dynamicProperties);
+            elementData.a = PropertyFactory.getProp(this,data.a,1,degToRads,dynamicProperties);
+        }
+        elementData.s = PropertyFactory.getProp(this,data.s,1,null,dynamicProperties);
+        elementData.e = PropertyFactory.getProp(this,data.e,1,null,dynamicProperties);
+        this.setGradientData(pathElement,data,elementData, styleOb);
+        var maskId = this.setGradientOpacity(data,elementData, styleOb);
+        if(maskId){
+            pathElement.setAttribute('mask','url(#'+maskId+')');
+        }
+    }
+    elementData.elem = pathElement;
+    //container.appendChild(pathElement);
+    if(data.r === 2) {
+        pathElement.setAttribute('fill-rule', 'evenodd');
+    }
+
+    if(data.ln){
+        pathElement.setAttribute('id',data.ln);
+    }
+    if(data.cl){
+        pathElement.setAttribute('class',data.cl);
+    }
+    styleOb.pElem = pathElement;
+    this.stylesList.push(styleOb);
+    elementData.style = styleOb;
+    return elementData;
+}
+
+IShapeElement.prototype.createGroupElement = function(data) {
+    var elementData = {
+        it: [],
+        prevViewData: []
+    };
+    var g = document.createElementNS(svgNS,'g');
+    elementData.gr = g;
+    if(data.ln){
+        elementData.gr.setAttribute('id',data.ln);
+    }
+    return elementData;
+}
+
+IShapeElement.prototype.createTransformElement = function(data, dynamicProperties) {
+    var elementData = {
+        transform : {
+            op: PropertyFactory.getProp(this,data.o,0,0.01,dynamicProperties),
+            mProps: PropertyFactory.getProp(this,data,2,null,dynamicProperties)
+        },
+        elements: []
+    };
+    return elementData;
+}
+
+IShapeElement.prototype.createShapeElement = function(data, ownTransformers, level, dynamicProperties) {
+    var elementData = {
+        elements : [],
+        caches:[],
+        styles : [],
+        transformers: ownTransformers,
+        lStr: ''
+    };
+    var ty = 4;
+    if(data.ty == 'rc'){
+        ty = 5;
+    }else if(data.ty == 'el'){
+        ty = 6;
+    }else if(data.ty == 'sr'){
+        ty = 7;
+    }
+    elementData.sh = ShapePropertyFactory.getShapeProp(this,data,ty,dynamicProperties);
+    elementData.lvl = level;
+    this.shapes.push(elementData.sh);
+    this.addShapeToModifiers(elementData);
+    return elementData;
+}
+
+var cont = 0;
+
+IShapeElement.prototype.setElementStyles = function(){
+    var j, jLen = this.stylesList.length;
+    var arr = [];
+    for(j=0;j<jLen;j+=1){
+        if(!this.stylesList[j].closed){
+            arr.push(this.stylesList[j]);
+        }
+    }
+    return arr;
+}
+
+IShapeElement.prototype.reloadShapes = function(){
+    this.firstFrame = true;
+    var i, len = this.itemsData.length;
+    for(i=0;i<len;i+=1){
+        this.prevViewData[i] = this.itemsData[i];
+    }
+    this.searchShapes(this.shapesData,this.itemsData,this.prevViewData,this.layerElement,this.dynamicProperties, 0, [], true);
+    var i, len = this.dynamicProperties.length;
+    for(i=0;i<len;i+=1){
+        this.dynamicProperties[i].getValue();
+    }
+    this.renderModifiers();
+}
+
+IShapeElement.prototype.searchShapes = function(arr,itemsData,prevViewData,container,dynamicProperties, level, transformers, render){
     var ownTransformers = [].concat(transformers);
     var i, len = arr.length - 1;
     var j, jLen;
-    var ownArrays = [], ownModifiers = [], styleOb, currentTransform;
+    var ownStyles = [], ownModifiers = [], styleOb, currentTransform, modifier, processedPos;
     for(i=len;i>=0;i-=1){
+        processedPos = this.searchProcessedElement(arr[i]);
+        if(!processedPos){
+            arr[i]._render = render;
+        } else {
+            itemsData[i] = prevViewData[processedPos - 1];
+        }
         if(arr[i].ty == 'fl' || arr[i].ty == 'st' || arr[i].ty == 'gf' || arr[i].ty == 'gs'){
-            data[i] = {};
-            styleOb = {
-                type: arr[i].ty,
-                d: '',
-                ld: '',
-                lvl: level,
-                mdf: false
-            };
-            var pathElement = document.createElementNS(svgNS, "path");
-            data[i].o = PropertyFactory.getProp(this,arr[i].o,0,0.01,dynamicProperties);
-            if(arr[i].ty == 'st' || arr[i].ty == 'gs') {
-                pathElement.setAttribute('stroke-linecap', this.lcEnum[arr[i].lc] || 'round');
-                ////pathElement.style.strokeLinecap = this.lcEnum[arr[i].lc] || 'round';
-                pathElement.setAttribute('stroke-linejoin',this.ljEnum[arr[i].lj] || 'round');
-                ////pathElement.style.strokeLinejoin = this.ljEnum[arr[i].lj] || 'round';
-                pathElement.setAttribute('fill-opacity','0');
-                ////pathElement.style.fillOpacity = 0;
-                if(arr[i].lj == 1) {
-                    pathElement.setAttribute('stroke-miterlimit',arr[i].ml);
-                    ////pathElement.style.strokeMiterlimit = arr[i].ml;
-                }
-
-                data[i].w = PropertyFactory.getProp(this,arr[i].w,0,null,dynamicProperties);
-                if(arr[i].d){
-                    var d = PropertyFactory.getDashProp(this,arr[i].d,'svg',dynamicProperties);
-                    if(!d.k){
-                        pathElement.setAttribute('stroke-dasharray', d.dasharray);
-                        ////pathElement.style.strokeDasharray = d.dasharray;
-                        pathElement.setAttribute('stroke-dashoffset', d.dashoffset);
-                        ////pathElement.style.strokeDashoffset = d.dashoffset;
-                    }
-                    data[i].d = d;
-                }
-
-            }
-            if(arr[i].ty == 'fl' || arr[i].ty == 'st'){
-                data[i].c = PropertyFactory.getProp(this,arr[i].c,1,255,dynamicProperties);
-                container.appendChild(pathElement);
+            if(!processedPos){
+                itemsData[i] = this.createStyleElement(arr[i], level, dynamicProperties);
             } else {
-                data[i].g = PropertyFactory.getGradientProp(this,arr[i].g,dynamicProperties);
-                if(arr[i].t == 2){
-                    data[i].h = PropertyFactory.getProp(this,arr[i].h,1,0.01,dynamicProperties);
-                    data[i].a = PropertyFactory.getProp(this,arr[i].a,1,degToRads,dynamicProperties);
-                }
-                data[i].s = PropertyFactory.getProp(this,arr[i].s,1,null,dynamicProperties);
-                data[i].e = PropertyFactory.getProp(this,arr[i].e,1,null,dynamicProperties);
-                this.setGradientData(pathElement,arr[i],data[i], styleOb);
-                var maskId = this.setGradientOpacity(arr[i],data[i], styleOb);
-                if(maskId){
-                    pathElement.setAttribute('mask','url(#'+maskId+')');
-                }
-                data[i].elem = pathElement;
-                container.appendChild(pathElement);
+                itemsData[i].style.closed = false;
             }
-            if(arr[i].r === 2) {
-                pathElement.setAttribute('fill-rule', 'evenodd');
+            if(arr[i]._render){
+                container.appendChild(itemsData[i].elem);
             }
-
-            if(arr[i].ln){
-                pathElement.setAttribute('id',arr[i].ln);
-            }
-            if(arr[i].cl){
-                pathElement.setAttribute('class',arr[i].cl);
-            }
-            styleOb.pElem = pathElement;
-            this.stylesList.push(styleOb);
-            data[i].style = styleOb;
-            ownArrays.push(styleOb);
+            ownStyles.push(itemsData[i].style);
         }else if(arr[i].ty == 'gr'){
-            data[i] = {
-                it: []
-            };
-            var g = document.createElementNS(svgNS,'g');
-            container.appendChild(g);
-            data[i].gr = g;
-            this.searchShapes(arr[i].it,data[i].it,g,dynamicProperties, level + 1, ownTransformers);
+            if(!processedPos){
+                itemsData[i] = this.createGroupElement(arr[i]);
+            } else {
+                jLen = itemsData[i].it.length;
+                for(j=0;j<jLen;j+=1){
+                    itemsData[i].prevViewData[j] = itemsData[i].it[j];
+                }
+            }
+            this.searchShapes(arr[i].it,itemsData[i].it,itemsData[i].prevViewData,itemsData[i].gr,dynamicProperties, level + 1, ownTransformers, render);
+            if(arr[i]._render){
+                container.appendChild(itemsData[i].gr);
+            }
         }else if(arr[i].ty == 'tr'){
-            data[i] = {
-                transform : {
-                    op: PropertyFactory.getProp(this,arr[i].o,0,0.01,dynamicProperties),
-                    mProps: PropertyFactory.getProp(this,arr[i],2,null,dynamicProperties)
-                },
-                elements: []
-            };
-            currentTransform = data[i].transform;
+            if(!processedPos){
+                itemsData[i] = this.createTransformElement(arr[i], dynamicProperties);
+            }
+            currentTransform = itemsData[i].transform;
             ownTransformers.push(currentTransform);
         }else if(arr[i].ty == 'sh' || arr[i].ty == 'rc' || arr[i].ty == 'el' || arr[i].ty == 'sr'){
-            data[i] = {
-                elements : [],
-                caches:[],
-                styles : [],
-                transformers: ownTransformers,
-                lStr: ''
-            };
-            var ty = 4;
-            if(arr[i].ty == 'rc'){
-                ty = 5;
-            }else if(arr[i].ty == 'el'){
-                ty = 6;
-            }else if(arr[i].ty == 'sr'){
-                ty = 7;
+            if(!processedPos){
+                itemsData[i] = this.createShapeElement(arr[i], ownTransformers, level, dynamicProperties);
             }
-            data[i].sh = ShapePropertyFactory.getShapeProp(this,arr[i],ty,dynamicProperties);
-            data[i].lvl = level;
-            this.shapes.push(data[i].sh);
-            this.addShapeToModifiers(data[i]);
-            jLen = this.stylesList.length;
-            for(j=0;j<jLen;j+=1){
-                if(!this.stylesList[j].closed){
-                    data[i].elements.push({
-                        ty:this.stylesList[j].type,
-                        st: this.stylesList[j]
-                    });
-                }
+            itemsData[i].elements = this.setElementStyles();
+
+        }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'ms'){
+            if(!processedPos){
+                modifier = ShapeModifiers.getModifier(arr[i].ty);
+                modifier.init(this,arr[i],dynamicProperties);
+                itemsData[i] = modifier;
+                this.shapeModifiers.push(modifier);
+            } else {
+                modifier = itemsData[i];
+                modifier.closed = false;
             }
-        }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'ms' || arr[i].ty == 'rp'){
-            var modifier = ShapeModifiers.getModifier(arr[i].ty);
-            modifier.init(this,arr[i],dynamicProperties);
-            this.shapeModifiers.push(modifier);
             ownModifiers.push(modifier);
-            data[i] = modifier;
+        }else if(arr[i].ty == 'rp'){
+            if(!processedPos){
+                modifier = ShapeModifiers.getModifier(arr[i].ty);
+                itemsData[i] = modifier;
+                modifier.init(this,arr,i,itemsData,dynamicProperties);
+                this.shapeModifiers.push(modifier);
+                render = false;
+            }else{
+                modifier = itemsData[i];
+                modifier.closed = true;
+            }
+            ownModifiers.push(modifier);
         }
+        this.addProcessedElement(arr[i], i + 1);
     }
-    len = ownArrays.length;
+    len = ownStyles.length;
     for(i=0;i<len;i+=1){
-        ownArrays[i].closed = true;
+        ownStyles[i].closed = true;
     }
     len = ownModifiers.length;
     for(i=0;i<len;i+=1){
@@ -264,18 +382,40 @@
 };
 
 IShapeElement.prototype.renderFrame = function(parentMatrix){
+    //this.reloadShapes();
     var renderParent = this._parent.renderFrame.call(this,parentMatrix);
     if(renderParent===false){
         this.hide();
         return;
     }
-    this.globalToLocal([0,0,0]);
     if(this.hidden){
         this.layerElement.style.display = 'block';
         this.hidden = false;
     }
     this.renderModifiers();
-    this.renderShape(null,null,true, null);
+    var i, len = this.stylesList.length;
+    for(i=0;i<len;i+=1){
+        this.stylesList[i].d = '';
+        this.stylesList[i].mdf = false;
+    }
+    this.renderShape(this.shapesData,this.itemsData, null);
+
+    for (i = 0; i < len; i += 1) {
+        if (this.stylesList[i].ld === '0') {
+            this.stylesList[i].ld = '1';
+            this.stylesList[i].pElem.style.display = 'block';
+            //this.stylesList[i].parent.appendChild(this.stylesList[i].pElem);
+        }
+        if (this.stylesList[i].mdf || this.firstFrame) {
+            this.stylesList[i].pElem.setAttribute('d', this.stylesList[i].d);
+            if(this.stylesList[i].msElem){
+                this.stylesList[i].msElem.setAttribute('d', this.stylesList[i].d);
+            }
+        }
+    }
+    if (this.firstFrame) {
+        this.firstFrame = false;
+    }
 };
 
 IShapeElement.prototype.hide = function(){
@@ -296,22 +436,8 @@
     }
 };
 
-IShapeElement.prototype.renderShape = function(items,data,isMain, container){
-    var i, len;
-    if(!items){
-        items = this.shapesData;
-        len = this.stylesList.length;
-        for(i=0;i<len;i+=1){
-            this.stylesList[i].d = '';
-            this.stylesList[i].mdf = false;
-        }
-    }
-    if(!data){
-        data = this.viewData;
-    }
-    ///
-    ///
-    len = items.length - 1;
+IShapeElement.prototype.renderShape = function(items,data, container){
+    var i, len = items.length - 1;
     var ty;
     for(i=len;i>=0;i-=1){
         ty = items[i].ty;
@@ -334,30 +460,11 @@
         }else if(ty == 'st'){
             this.renderStroke(items[i],data[i]);
         }else if(ty == 'gr'){
-            this.renderShape(items[i].it,data[i].it,false, data[i].gr);
+            this.renderShape(items[i].it,data[i].it, data[i].gr);
         }else if(ty == 'tm'){
             //
         }
     }
-    if(isMain) {
-        len = this.stylesList.length;
-        for (i = 0; i < len; i += 1) {
-            if (this.stylesList[i].ld === '0') {
-                this.stylesList[i].ld = '1';
-                this.stylesList[i].pElem.style.display = 'block';
-                //this.stylesList[i].parent.appendChild(this.stylesList[i].pElem);
-            }
-            if (this.stylesList[i].mdf || this.firstFrame) {
-                this.stylesList[i].pElem.setAttribute('d', this.stylesList[i].d);
-                if(this.stylesList[i].msElem){
-                    this.stylesList[i].msElem.setAttribute('d', this.stylesList[i].d);
-                }
-            }
-        }
-        if (this.firstFrame) {
-            this.firstFrame = false;
-        }
-    }
 
 };
 
@@ -377,80 +484,86 @@
         shapeString += 'z';
     }
     return shapeString;
-}
+};
 
-IShapeElement.prototype.renderPath = function(pathData,viewData){
-    var len, i, j, jLen,pathStringTransformed,redraw,pathNodes,l, lLen = viewData.elements.length;
-    var lvl = viewData.lvl;
+IShapeElement.prototype.renderPath = function(pathData,itemData){
+    var len, i, j, jLen,pathStringTransformed,redraw,pathNodes,l, lLen = itemData.elements.length;
+    var lvl = itemData.lvl;
+    if(!pathData._render){
+        return;
+    }
     for(l=0;l<lLen;l+=1){
-        redraw = viewData.sh.mdf || this.firstFrame;
-        pathStringTransformed = 'M0 0';
-        var paths = viewData.sh.paths;
-        jLen = paths._length;
-        if(viewData.elements[l].st.lvl < lvl){
-            var mat = this.mHelper.reset(), props;
-            var iterations = lvl - viewData.elements[l].st.lvl;
-            var k = viewData.transformers.length-1;
-            while(iterations > 0) {
-                redraw = viewData.transformers[k].mProps.mdf || redraw;
-                props = viewData.transformers[k].mProps.v.props;
-                mat.transform(props[0],props[1],props[2],props[3],props[4],props[5],props[6],props[7],props[8],props[9],props[10],props[11],props[12],props[13],props[14],props[15]);
-                iterations --;
-                k --;
-            }
-            if(redraw){
-                for(j=0;j<jLen;j+=1){
-                    pathNodes = paths.shapes[j];
-                    if(pathNodes && pathNodes._length){
-                        pathStringTransformed += this.buildShapeString(pathNodes, pathNodes._length, pathNodes.c, mat);
-                    }
+        if(itemData.elements[l].data._render){
+            redraw = itemData.sh.mdf || this.firstFrame;
+            pathStringTransformed = 'M0 0';
+            var paths = itemData.sh.paths;
+            jLen = paths._length;
+            if(itemData.elements[l].lvl < lvl){
+                var mat = this.mHelper.reset(), props;
+                var iterations = lvl - itemData.elements[l].lvl;
+                var k = itemData.transformers.length-1;
+                while(iterations > 0) {
+                    redraw = itemData.transformers[k].mProps.mdf || redraw;
+                    props = itemData.transformers[k].mProps.v.props;
+                    mat.transform(props[0],props[1],props[2],props[3],props[4],props[5],props[6],props[7],props[8],props[9],props[10],props[11],props[12],props[13],props[14],props[15]);
+                    iterations --;
+                    k --;
                 }
-                viewData.caches[l] = pathStringTransformed;
+                if(redraw){
+                    for(j=0;j<jLen;j+=1){
+                        pathNodes = paths.shapes[j];
+                        if(pathNodes && pathNodes._length){
+                            pathStringTransformed += this.buildShapeString(pathNodes, pathNodes._length, pathNodes.c, mat);
+                        }
+                    }
+                    itemData.caches[l] = pathStringTransformed;
+                } else {
+                    pathStringTransformed = itemData.caches[l];
+                }
             } else {
-                pathStringTransformed = viewData.caches[l];
+                if(redraw){
+                    for(j=0;j<jLen;j+=1){
+                        pathNodes = paths.shapes[j];
+                        if(pathNodes && pathNodes._length){
+                            pathStringTransformed += this.buildShapeString(pathNodes, pathNodes._length, pathNodes.c, this.identityMatrix);
+                        }
+                    }
+                    itemData.caches[l] = pathStringTransformed;
+                } else {
+                    pathStringTransformed = itemData.caches[l];
+                }
             }
+            itemData.elements[l].d += pathStringTransformed;
+            itemData.elements[l].mdf = redraw || itemData.elements[l].mdf;
         } else {
-            if(redraw){
-                for(j=0;j<jLen;j+=1){
-                    pathNodes = paths.shapes[j];
-                    if(pathNodes && pathNodes._length){
-                        pathStringTransformed += this.buildShapeString(pathNodes, pathNodes._length, pathNodes.c, this.identityMatrix);
-                    }
-                }
-                viewData.caches[l] = pathStringTransformed;
-            } else {
-                pathStringTransformed = viewData.caches[l];
-            }
+            itemData.elements[l].mdf = true;
         }
-        viewData.elements[l].st.d += pathStringTransformed;
-        viewData.elements[l].st.mdf = redraw || viewData.elements[l].st.mdf;
-    }
-
-};
-
-IShapeElement.prototype.renderFill = function(styleData,viewData){
-    var styleElem = viewData.style;
-
-    if(viewData.c.mdf || this.firstFrame){
-        styleElem.pElem.setAttribute('fill','rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')');
-        ////styleElem.pElem.style.fill = 'rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')';
-    }
-    if(viewData.o.mdf || this.firstFrame){
-        styleElem.pElem.setAttribute('fill-opacity',viewData.o.v);
     }
 };
 
-IShapeElement.prototype.renderGradient = function(styleData,viewData){
-    var gfill = viewData.gf;
-    var opFill = viewData.of;
-    var pt1 = viewData.s.v,pt2 = viewData.e.v;
+IShapeElement.prototype.renderFill = function(styleData,itemData){
+    var styleElem = itemData.style;
 
-    if(viewData.o.mdf || this.firstFrame){
+    if(itemData.c.mdf || this.firstFrame){
+        styleElem.pElem.setAttribute('fill','rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')');
+        ////styleElem.pElem.style.fill = 'rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')';
+    }
+    if(itemData.o.mdf || this.firstFrame){
+        styleElem.pElem.setAttribute('fill-opacity',itemData.o.v);
+    }
+};
+
+IShapeElement.prototype.renderGradient = function(styleData,itemData){
+    var gfill = itemData.gf;
+    var opFill = itemData.of;
+    var pt1 = itemData.s.v,pt2 = itemData.e.v;
+
+    if(itemData.o.mdf || this.firstFrame){
         var attr = styleData.ty === 'gf' ? 'fill-opacity':'stroke-opacity';
-        viewData.elem.setAttribute(attr,viewData.o.v);
+        itemData.elem.setAttribute(attr,itemData.o.v);
     }
     //clippedElement.setAttribute('transform','matrix(1,0,0,1,-100,0)');
-    if(viewData.s.mdf || this.firstFrame){
+    if(itemData.s.mdf || this.firstFrame){
         var attr1 = styleData.t === 1 ? 'x1':'cx';
         var attr2 = attr1 === 'x1' ? 'y1':'cy';
         gfill.setAttribute(attr1,pt1[0]);
@@ -461,9 +574,9 @@
         }
     }
     var stops, i, len, stop;
-    if(viewData.g.cmdf || this.firstFrame){
-        stops = viewData.cst;
-        var cValues = viewData.g.c;
+    if(itemData.g.cmdf || this.firstFrame){
+        stops = itemData.cst;
+        var cValues = itemData.g.c;
         len = stops.length;
         for(i=0;i<len;i+=1){
             stop = stops[i];
@@ -471,9 +584,9 @@
             stop.setAttribute('stop-color','rgb('+cValues[i*4+1]+','+cValues[i*4+2]+','+cValues[i*4+3]+')');
         }
     }
-    if(opFill && (viewData.g.omdf || this.firstFrame)){
-        stops = viewData.ost;
-        var oValues = viewData.g.o;
+    if(opFill && (itemData.g.omdf || this.firstFrame)){
+        stops = itemData.ost;
+        var oValues = itemData.g.o;
         len = stops.length;
         for(i=0;i<len;i+=1){
             stop = stops[i];
@@ -482,7 +595,7 @@
         }
     }
     if(styleData.t === 1){
-        if(viewData.e.mdf  || this.firstFrame){
+        if(itemData.e.mdf  || this.firstFrame){
             gfill.setAttribute('x2',pt2[0]);
             gfill.setAttribute('y2',pt2[1]);
             if(opFill){
@@ -492,23 +605,23 @@
         }
     } else {
         var rad;
-        if(viewData.s.mdf || viewData.e.mdf || this.firstFrame){
+        if(itemData.s.mdf || itemData.e.mdf || this.firstFrame){
             rad = Math.sqrt(Math.pow(pt1[0]-pt2[0],2)+Math.pow(pt1[1]-pt2[1],2));
             gfill.setAttribute('r',rad);
             if(opFill){
                 opFill.setAttribute('r',rad);
             }
         }
-        if(viewData.e.mdf || viewData.h.mdf || viewData.a.mdf || this.firstFrame){
+        if(itemData.e.mdf || itemData.h.mdf || itemData.a.mdf || this.firstFrame){
             if(!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 = viewData.h.v >= 1 ? 0.99 : viewData.h.v <= -1 ? -0.99:viewData.h.v;
+            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 + viewData.a.v)*dist + pt1[0];
-            var y = Math.sin(ang + viewData.a.v)*dist + pt1[1];
+            var x = Math.cos(ang + itemData.a.v)*dist + pt1[0];
+            var y = Math.sin(ang + itemData.a.v)*dist + pt1[1];
             gfill.setAttribute('fx',x);
             gfill.setAttribute('fy',y);
             if(opFill){
@@ -520,10 +633,10 @@
     }
 };
 
-IShapeElement.prototype.renderStroke = function(styleData,viewData){
-    var styleElem = viewData.style;
+IShapeElement.prototype.renderStroke = function(styleData,itemData){
+    var styleElem = itemData.style;
     //TODO fix dashes
-    var d = viewData.d;
+    var d = itemData.d;
     var dasharray,dashoffset;
     if(d && d.k && (d.mdf || this.firstFrame)){
         styleElem.pElem.setAttribute('stroke-dasharray', d.dasharray);
@@ -531,26 +644,26 @@
         styleElem.pElem.setAttribute('stroke-dashoffset', d.dashoffset);
         ////styleElem.pElem.style.strokeDashoffset = d.dashoffset;
     }
-    if(viewData.c && (viewData.c.mdf || this.firstFrame)){
-        styleElem.pElem.setAttribute('stroke','rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')');
-        ////styleElem.pElem.style.stroke = 'rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')';
+    if(itemData.c && (itemData.c.mdf || this.firstFrame)){
+        styleElem.pElem.setAttribute('stroke','rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')');
+        ////styleElem.pElem.style.stroke = 'rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')';
     }
-    if(viewData.o.mdf || this.firstFrame){
-        styleElem.pElem.setAttribute('stroke-opacity',viewData.o.v);
+    if(itemData.o.mdf || this.firstFrame){
+        styleElem.pElem.setAttribute('stroke-opacity',itemData.o.v);
     }
-    if(viewData.w.mdf || this.firstFrame){
-        styleElem.pElem.setAttribute('stroke-width',viewData.w.v);
+    if(itemData.w.mdf || this.firstFrame){
+        styleElem.pElem.setAttribute('stroke-width',itemData.w.v);
         if(styleElem.msElem){
-            styleElem.msElem.setAttribute('stroke-width',viewData.w.v);
+            styleElem.msElem.setAttribute('stroke-width',itemData.w.v);
         }
-        ////styleElem.pElem.style.strokeWidth = viewData.w.v;
+        ////styleElem.pElem.style.strokeWidth = itemData.w.v;
     }
 };
 
 IShapeElement.prototype.destroy = function(){
     this._parent.destroy.call(this._parent);
     this.shapeData = null;
-    this.viewData = null;
+    this.itemsData = null;
     this.parentContainer = null;
     this.placeholder = null;
 };
diff --git a/player/js/elements/canvasElements/CVShapeElement.js b/player/js/elements/canvasElements/CVShapeElement.js
index c09a6dd..5c9cd53 100644
--- a/player/js/elements/canvasElements/CVShapeElement.js
+++ b/player/js/elements/canvasElements/CVShapeElement.js
@@ -1,25 +1,15 @@
 function CVShapeElement(data, comp,globalData){
     this.shapes = [];
-    this.stylesList = [];
-    this.viewData = [];
-    this.shapeModifiers = [];
     this.shapesData = data.shapes;
-    this.firstFrame = true;
+    this.stylesList = [];
+    this.itemsData = [];
+    this.prevViewData = [];
+    this.shapeModifiers = [];
+    this.processedElements = [];
     this._parent.constructor.call(this,data, comp,globalData);
 }
 createElement(CVBaseElement, CVShapeElement);
 
-CVShapeElement.prototype.lcEnum = {
-    '1': 'butt',
-    '2': 'round',
-    '3': 'butt'
-}
-
-CVShapeElement.prototype.ljEnum = {
-    '1': 'miter',
-    '2': 'round',
-    '3': 'butt'
-};
 CVShapeElement.prototype.transformHelper = {opacity:1,mat:new Matrix(),matMdf:false,opMdf:false};
 
 CVShapeElement.prototype.dashResetter = [];
@@ -27,107 +17,185 @@
 CVShapeElement.prototype.createElements = function(){
 
     this._parent.createElements.call(this);
-    this.searchShapes(this.shapesData,this.viewData,this.dynamicProperties);
+    this.searchShapes(this.shapesData,this.itemsData,this.prevViewData,this.dynamicProperties, true);
 };
-CVShapeElement.prototype.searchShapes = function(arr,data,dynamicProperties){
+
+CVShapeElement.prototype.createStyleElement = function(data, dynamicProperties){
+    var styleElem = {
+        data: data,
+        type: data.ty,
+        elements: []
+    };
+    var elementData = {};
+    if(data.ty == 'fl' || data.ty == 'st'){
+        elementData.c = PropertyFactory.getProp(this,data.c,1,255,dynamicProperties);
+        if(!elementData.c.k){
+            styleElem.co = 'rgb('+bm_floor(elementData.c.v[0])+','+bm_floor(elementData.c.v[1])+','+bm_floor(elementData.c.v[2])+')';
+        }
+    }
+    elementData.o = PropertyFactory.getProp(this,data.o,0,0.01,dynamicProperties);
+    if(data.ty == 'st') {
+        styleElem.lc = this.lcEnum[data.lc] || 'round';
+        styleElem.lj = this.ljEnum[data.lj] || 'round';
+        if(data.lj == 1) {
+            styleElem.ml = data.ml;
+        }
+        elementData.w = PropertyFactory.getProp(this,data.w,0,null,dynamicProperties);
+        if(!elementData.w.k){
+            styleElem.wi = elementData.w.v;
+        }
+        if(data.d){
+            var d = PropertyFactory.getDashProp(this,data.d,'canvas',dynamicProperties);
+            elementData.d = d;
+            if(!elementData.d.k){
+                styleElem.da = elementData.d.dasharray;
+                styleElem.do = elementData.d.dashoffset;
+            }
+        }
+
+    } else {
+
+        styleElem.r = data.r === 2 ? 'evenodd' : 'nonzero';
+    }
+    this.stylesList.push(styleElem);
+    elementData.style = styleElem;
+    return elementData;
+}
+
+CVShapeElement.prototype.createGroupElement = function(data) {
+    var elementData = {
+        it: [],
+        prevViewData: []
+    };
+    return elementData;
+}
+
+CVShapeElement.prototype.createTransformElement = function(data, dynamicProperties) {
+    var elementData = {
+        transform : {
+            mat: new Matrix(),
+            opacity: 1,
+            matMdf:false,
+            opMdf:false,
+            op: PropertyFactory.getProp(this,data.o,0,0.01,dynamicProperties),
+            mProps: PropertyFactory.getProp(this,data,2,null,dynamicProperties)
+        },
+        elements: []
+    };
+    return elementData;
+}
+
+CVShapeElement.prototype.createShapeElement = function(data, dynamicProperties) {
+    var elementData = {
+        nodes:[],
+        trNodes:[],
+        tr:[0,0,0,0,0,0]
+    };
+    var ty = 4;
+    if(data.ty == 'rc'){
+        ty = 5;
+    }else if(data.ty == 'el'){
+        ty = 6;
+    }else if(data.ty == 'sr'){
+        ty = 7;
+    }
+    elementData.sh = ShapePropertyFactory.getShapeProp(this,data,ty,dynamicProperties);
+    this.shapes.push(elementData.sh);
+    this.addShapeToModifiers(elementData);
+    jLen = this.stylesList.length;
+    var hasStrokes = false, hasFills = false;
+    for(j=0;j<jLen;j+=1){
+        if(!this.stylesList[j].closed){
+            this.stylesList[j].elements.push(elementData);
+            if(this.stylesList[j].type === 'st'){
+                hasStrokes = true;
+            }else{
+                hasFills = true;
+            }
+        }
+    }
+    elementData.st = hasStrokes;
+    elementData.fl = hasFills;
+    return elementData;
+}
+
+CVShapeElement.prototype.reloadShapes = function(){
+    this.firstFrame = true;
+    var i, len = this.itemsData.length;
+    for(i=0;i<len;i+=1){
+        this.prevViewData[i] = this.itemsData[i];
+    }
+    this.searchShapes(this.shapesData,this.itemsData,this.prevViewData,this.dynamicProperties, true);
+    var i, len = this.dynamicProperties.length;
+    for(i=0;i<len;i+=1){
+        this.dynamicProperties[i].getValue();
+    }
+    this.renderModifiers();
+}
+
+CVShapeElement.prototype.searchShapes = function(arr,itemsData, prevViewData,dynamicProperties, render){
     var i, len = arr.length - 1;
     var j, jLen;
-    var ownArrays = [], ownModifiers = [], styleElem;
+    var ownArrays = [], ownModifiers = [], processedPos;
     for(i=len;i>=0;i-=1){
-        if(arr[i].ty == 'fl' || arr[i].ty == 'st'){
-            styleElem = {
-                type: arr[i].ty,
-                elements: []
-            };
-            data[i] = {};
-            if(arr[i].ty == 'fl' || arr[i].ty == 'st'){
-                data[i].c = PropertyFactory.getProp(this,arr[i].c,1,255,dynamicProperties);
-                if(!data[i].c.k){
-                    styleElem.co = 'rgb('+bm_floor(data[i].c.v[0])+','+bm_floor(data[i].c.v[1])+','+bm_floor(data[i].c.v[2])+')';
-                }
-            }
-            data[i].o = PropertyFactory.getProp(this,arr[i].o,0,0.01,dynamicProperties);
-            if(arr[i].ty == 'st') {
-                styleElem.lc = this.lcEnum[arr[i].lc] || 'round';
-                styleElem.lj = this.ljEnum[arr[i].lj] || 'round';
-                if(arr[i].lj == 1) {
-                    styleElem.ml = arr[i].ml;
-                }
-                data[i].w = PropertyFactory.getProp(this,arr[i].w,0,null,dynamicProperties);
-                if(!data[i].w.k){
-                    styleElem.wi = data[i].w.v;
-                }
-                if(arr[i].d){
-                    var d = PropertyFactory.getDashProp(this,arr[i].d,'canvas',dynamicProperties);
-                    data[i].d = d;
-                    if(!data[i].d.k){
-                        styleElem.da = data[i].d.dasharray;
-                        styleElem.do = data[i].d.dashoffset;
-                    }
-                }
-
-            } else {
-
-                styleElem.r = arr[i].r === 2 ? 'evenodd' : 'nonzero';
-            }
-            this.stylesList.push(styleElem);
-            data[i].style = styleElem;
-            ownArrays.push(data[i].style);
-        }else if(arr[i].ty == 'gr'){
-            data[i] = {
-                it: []
-            };
-            this.searchShapes(arr[i].it,data[i].it,dynamicProperties);
-        }else if(arr[i].ty == 'tr'){
-            data[i] = {
-                transform : {
-                    mat: new Matrix(),
-                    opacity: 1,
-                    matMdf:false,
-                    opMdf:false,
-                    op: PropertyFactory.getProp(this,arr[i].o,0,0.01,dynamicProperties),
-                    mProps: PropertyFactory.getProp(this,arr[i],2,null,dynamicProperties)
-                },
-                elements: []
-            };
-        }else if(arr[i].ty == 'sh' || arr[i].ty == 'rc' || arr[i].ty == 'el' || arr[i].ty == 'sr'){
-            data[i] = {
-                nodes:[],
-                trNodes:[],
-                tr:[0,0,0,0,0,0]
-            };
-            var ty = 4;
-            if(arr[i].ty == 'rc'){
-                ty = 5;
-            }else if(arr[i].ty == 'el'){
-                ty = 6;
-            }else if(arr[i].ty == 'sr'){
-                ty = 7;
-            }
-            data[i].sh = ShapePropertyFactory.getShapeProp(this,arr[i],ty,dynamicProperties);
-            this.shapes.push(data[i].sh);
-            this.addShapeToModifiers(data[i]);
-            jLen = this.stylesList.length;
-            var hasStrokes = false, hasFills = false;
-            for(j=0;j<jLen;j+=1){
-                if(!this.stylesList[j].closed){
-                    this.stylesList[j].elements.push(data[i]);
-                    if(this.stylesList[j].type === 'st'){
-                        hasStrokes = true;
-                    }else{
-                        hasFills = true;
-                    }
-                }
-            }
-            data[i].st = hasStrokes;
-            data[i].fl = hasFills;
-        }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'rp'){
-            var modifier = ShapeModifiers.getModifier(arr[i].ty);
-            modifier.init(this,arr[i],dynamicProperties);
-            this.shapeModifiers.push(modifier);
-            ownModifiers.push(modifier);
-            data[i] = modifier;
+        processedPos = this.searchProcessedElement(arr[i]);
+        if(!processedPos){
+            arr[i]._render = render;
+        } else {
+            itemsData[i] = prevViewData[processedPos - 1];
         }
+        if(arr[i].ty == 'fl' || arr[i].ty == 'st'){
+            if(!processedPos){
+                itemsData[i] = this.createStyleElement(arr[i], dynamicProperties);
+            } else {
+                itemsData[i].style.closed = false;
+            }
+            
+            ownArrays.push(itemsData[i].style);
+        }else if(arr[i].ty == 'gr'){
+            if(!processedPos){
+                itemsData[i] = this.createGroupElement(arr[i]);
+            } else {
+                jLen = itemsData[i].it.length;
+                for(j=0;j<jLen;j+=1){
+                    itemsData[i].prevViewData[j] = itemsData[i].it[j];
+                }
+            }
+            this.searchShapes(arr[i].it,itemsData[i].it,itemsData[i].prevViewData,dynamicProperties, render);
+        }else if(arr[i].ty == 'tr'){
+            if(!processedPos){
+                itemsData[i] = this.createTransformElement(arr[i], dynamicProperties);
+            }
+        }else if(arr[i].ty == 'sh' || arr[i].ty == 'rc' || arr[i].ty == 'el' || arr[i].ty == 'sr'){
+            if(!processedPos){
+                itemsData[i] = this.createShapeElement(arr[i], dynamicProperties);
+            }
+            
+        }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd'){
+            if(!processedPos){
+                var modifier = ShapeModifiers.getModifier(arr[i].ty);
+                modifier.init(this,arr[i],dynamicProperties);
+                itemsData[i] = modifier;
+                this.shapeModifiers.push(modifier);
+            } else {
+                modifier = itemsData[i];
+                modifier.closed = false;
+            }
+            ownModifiers.push(modifier);
+        } else if(arr[i].ty == 'rp'){
+            if(!processedPos){
+                modifier = ShapeModifiers.getModifier(arr[i].ty);
+                itemsData[i] = modifier;
+                modifier.init(this,arr,i,itemsData,dynamicProperties);
+                this.shapeModifiers.push(modifier);
+                render = false;
+            }else{
+                modifier = itemsData[i];
+                modifier.closed = true;
+            }
+            ownModifiers.push(modifier);
+        }
+        this.addProcessedElement(arr[i], i + 1);
     }
     len = ownArrays.length;
     for(i=0;i<len;i+=1){
@@ -141,6 +209,10 @@
 
 CVShapeElement.prototype.addShapeToModifiers = IShapeElement.prototype.addShapeToModifiers;
 CVShapeElement.prototype.renderModifiers = IShapeElement.prototype.renderModifiers;
+CVShapeElement.prototype.lcEnum = IShapeElement.prototype.lcEnum;
+CVShapeElement.prototype.ljEnum = IShapeElement.prototype.ljEnum;
+CVShapeElement.prototype.searchProcessedElement = IShapeElement.prototype.searchProcessedElement;
+CVShapeElement.prototype.addProcessedElement = IShapeElement.prototype.addProcessedElement;
 
 CVShapeElement.prototype.renderFrame = function(parentMatrix){
     if(this._parent.renderFrame.call(this, parentMatrix)===false){
@@ -168,7 +240,7 @@
         }
     }
     if(!data){
-        data = this.viewData;
+        data = this.itemsData;
     }
     ///
     ///
@@ -214,7 +286,7 @@
     renderer.ctxTransform(this.finalTransform.mat.props);
     for(i=0;i<len;i+=1){
         type = this.stylesList[i].type;
-        if(type === 'st' && this.stylesList[i].wi === 0){
+        if((type === 'st' && this.stylesList[i].wi === 0) || !this.stylesList[i].data._render){
             continue;
         }
         renderer.save();
@@ -271,13 +343,13 @@
         this.firstFrame = false;
     }
 };
-CVShapeElement.prototype.renderPath = function(pathData,viewData,groupTransform){
+CVShapeElement.prototype.renderPath = function(pathData,itemData,groupTransform){
     var len, i, j,jLen;
-    var redraw = groupTransform.matMdf || viewData.sh.mdf || this.firstFrame;
+    var redraw = groupTransform.matMdf || itemData.sh.mdf || this.firstFrame;
     if(redraw) {
-        var paths = viewData.sh.paths;
+        var paths = itemData.sh.paths;
         jLen = paths._length;
-        var pathStringTransformed = viewData.trNodes;
+        var pathStringTransformed = itemData.trNodes;
         pathStringTransformed.length = 0;
         for(j=0;j<jLen;j+=1){
             var pathNodes = paths.shapes[j];
@@ -314,51 +386,51 @@
                         t: 'z'
                     });
                 }
-                viewData.lStr = pathStringTransformed;
+                itemData.lStr = pathStringTransformed;
             }
 
         }
 
-        if (viewData.st) {
+        if (itemData.st) {
             for (i = 0; i < 16; i += 1) {
-                viewData.tr[i] = groupTransform.mat.props[i];
+                itemData.tr[i] = groupTransform.mat.props[i];
             }
         }
-        viewData.trNodes = pathStringTransformed;
+        itemData.trNodes = pathStringTransformed;
 
     }
 };
 
 
 
-CVShapeElement.prototype.renderFill = function(styleData,viewData, groupTransform){
-    var styleElem = viewData.style;
+CVShapeElement.prototype.renderFill = function(styleData,itemData, groupTransform){
+    var styleElem = itemData.style;
 
-    if(viewData.c.mdf || this.firstFrame){
-        styleElem.co = 'rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')';
+    if(itemData.c.mdf || this.firstFrame){
+        styleElem.co = 'rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')';
     }
-    if(viewData.o.mdf || groupTransform.opMdf || this.firstFrame){
-        styleElem.coOp = viewData.o.v*groupTransform.opacity;
+    if(itemData.o.mdf || groupTransform.opMdf || this.firstFrame){
+        styleElem.coOp = itemData.o.v*groupTransform.opacity;
     }
 };
 
-CVShapeElement.prototype.renderStroke = function(styleData,viewData, groupTransform){
-    var styleElem = viewData.style;
+CVShapeElement.prototype.renderStroke = function(styleData,itemData, groupTransform){
+    var styleElem = itemData.style;
     //TODO fix dashes
-    var d = viewData.d;
+    var d = itemData.d;
     var dasharray,dashoffset;
     if(d && (d.mdf  || this.firstFrame)){
         styleElem.da = d.dasharray;
         styleElem.do = d.dashoffset;
     }
-    if(viewData.c.mdf || this.firstFrame){
-        styleElem.co = 'rgb('+bm_floor(viewData.c.v[0])+','+bm_floor(viewData.c.v[1])+','+bm_floor(viewData.c.v[2])+')';
+    if(itemData.c.mdf || this.firstFrame){
+        styleElem.co = 'rgb('+bm_floor(itemData.c.v[0])+','+bm_floor(itemData.c.v[1])+','+bm_floor(itemData.c.v[2])+')';
     }
-    if(viewData.o.mdf || groupTransform.opMdf || this.firstFrame){
-        styleElem.coOp = viewData.o.v*groupTransform.opacity;
+    if(itemData.o.mdf || groupTransform.opMdf || this.firstFrame){
+        styleElem.coOp = itemData.o.v*groupTransform.opacity;
     }
-    if(viewData.w.mdf || this.firstFrame){
-        styleElem.wi = viewData.w.v;
+    if(itemData.w.mdf || this.firstFrame){
+        styleElem.wi = itemData.w.v;
     }
 };
 
@@ -368,7 +440,7 @@
     this.globalData = null;
     this.canvasContext = null;
     this.stylesList.length = 0;
-    this.viewData.length = 0;
+    this.itemData.length = 0;
     this._parent.destroy.call(this._parent);
 };
 
diff --git a/player/js/elements/htmlElements/HShapeElement.js b/player/js/elements/htmlElements/HShapeElement.js
index a00e2c8..f6aef9d 100644
--- a/player/js/elements/htmlElements/HShapeElement.js
+++ b/player/js/elements/htmlElements/HShapeElement.js
@@ -1,14 +1,12 @@
 function HShapeElement(data,parentContainer,globalData,comp, placeholder){
     this.shapes = [];
-    this.shapeModifiers = [];
     this.shapesData = data.shapes;
     this.stylesList = [];
-    this.viewData = [];
+    this.itemsData = [];
+    this.prevViewData = [];
+    this.shapeModifiers = [];
+    this.processedElements = [];
     this._parent.constructor.call(this,data,parentContainer,globalData,comp, placeholder);
-    this.addedTransforms = {
-        mdf: false,
-        mats: [this.finalTransform.mat]
-    };
     this.currentBBox = {
         x:999999,
         y: -999999,
@@ -20,6 +18,7 @@
 var parent = HShapeElement.prototype._parent;
 extendPrototype(IShapeElement, HShapeElement);
 HShapeElement.prototype._parent = parent;
+HShapeElement.prototype._renderShapeFrame = HShapeElement.prototype.renderFrame;
 
 HShapeElement.prototype.createElements = function(){
     var parent = document.createElement('div');
@@ -50,7 +49,8 @@
     if(this.data.ln){
         this.innerElem.setAttribute('id',this.data.ln);
     }
-    this.searchShapes(this.shapesData,this.viewData,this.layerElement,this.dynamicProperties,0);
+
+    this.searchShapes(this.shapesData,this.itemsData,this.prevViewData,this.layerElement,this.dynamicProperties,0, [], true);
     this.buildExpressionInterface();
     this.layerElement = parent;
     this.transformedElement = parent;
@@ -62,22 +62,10 @@
 };
 
 HShapeElement.prototype.renderFrame = function(parentMatrix){
-    var renderParent = this._parent.renderFrame.call(this,parentMatrix);
-    if(renderParent===false){
-        this.hide();
-        return;
-    }
-    if(this.hidden){
-        this.layerElement.style.display = 'block';
-        this.hidden = false;
-    }
-    this.renderModifiers();
-    this.addedTransforms.mdf = this.finalTransform.matMdf;
-    this.addedTransforms.mats.length = 1;
-    this.addedTransforms.mats[0] = this.finalTransform.mat;
-    this.renderShape(null,null,true, null);
+    var firstFrame = this.firstFrame;
+    this._renderShapeFrame();
 
-    if(this.isVisible && (this.elemMdf || this.firstFrame)){
+    if(this.isVisible && (this.elemMdf || firstFrame)){
         var boundingBox = this.shapeCont.getBBox();
         var changed = false;
         if(this.currentBBox.w !== boundingBox.width){
diff --git a/player/js/utils/DataManager.js b/player/js/utils/DataManager.js
index 8719af6..5b3375b 100644
--- a/player/js/utils/DataManager.js
+++ b/player/js/utils/DataManager.js
@@ -52,7 +52,11 @@
         var i = 0, len = comps.length;
         while(i<len){
             if(comps[i].id === id){
-                return comps[i].layers;
+                if(!comps[i].layers.__used) {
+                    comps[i].layers.__used = true;
+                    return comps[i].layers;
+                }
+                return JSON.parse(JSON.stringify(comps[i].layers));
             }
             i += 1;
         }
diff --git a/player/js/utils/common.js b/player/js/utils/common.js
index 05a3632..a5452f0 100644
--- a/player/js/utils/common.js
+++ b/player/js/utils/common.js
@@ -1,4 +1,4 @@
-var subframeEnabled = true;
+var subframeEnabled = false;
 var expressionsPlugin;
 var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
 var cachedColors = {};
diff --git a/player/js/utils/shapes/RepeaterModifier.js b/player/js/utils/shapes/RepeaterModifier.js
index 87cb7cc..a78b937 100644
--- a/player/js/utils/shapes/RepeaterModifier.js
+++ b/player/js/utils/shapes/RepeaterModifier.js
@@ -1,11 +1,9 @@
 function RepeaterModifier(){};
-extendPrototype(ShapeModifier,RepeaterModifier);
 RepeaterModifier.prototype.processKeys = function(forceRender){
     if(this.elem.globalData.frameId === this.frameId && !forceRender){
         return;
     }
     this.mdf = forceRender ? true : false;
-    this.frameId = this.elem.globalData.frameId;
     var i, len = this.dynamicProperties.length;
 
     for(i=0;i<len;i+=1){
@@ -15,11 +13,13 @@
         }
     }
 };
+
 RepeaterModifier.prototype.initModifierProperties = function(elem,data){
     this.getValue = this.processKeys;
     this.c = PropertyFactory.getProp(elem,data.c,0,null,this.dynamicProperties);
     this.o = PropertyFactory.getProp(elem,data.o,0,null,this.dynamicProperties);
     this.tr = PropertyFactory.getProp(elem,data.tr,2,null,this.dynamicProperties);
+    this.data = data;
     if(!this.dynamicProperties.length){
         this.getValue(true);
     }
@@ -43,98 +43,164 @@
     sMatrix.translate(transform.a.v[0], transform.a.v[1], transform.a.v[2]);
 }
 
+RepeaterModifier.prototype.init = function(elem, arr, pos, elemsData, dynamicProperties) {
+    this.elem = elem;
+    this.arr = arr;
+    this.pos = pos;
+    this.elemsData = elemsData;
+    this._currentCopies = 0;
+    this._elements = [];
+    this._groups = [];
+    this.dynamicProperties = [];
+    this.frameId = -1;
+    this.initModifierProperties(elem,arr[pos]);
+    var cont = 0;
+    while(pos>0){
+        pos -= 1;
+        //this._elements.unshift(arr.splice(pos,1)[0]);
+        this._elements.unshift(arr[pos]);
+        cont += 1;
+    }
+    if(this.dynamicProperties.length){
+        this.k = true;
+        dynamicProperties.push(this);
+    }else{
+        this.getValue(true);
+    }
+}
+
+RepeaterModifier.prototype.resetElements = function(elements){
+    var i, len = elements.length;
+    for(i = 0; i < len; i += 1) {
+        elements[i]._processed = false;
+        if(elements[i].ty === 'gr'){
+            this.resetElements(elements[i].it);
+        }
+    }
+}
+
+RepeaterModifier.prototype.cloneElements = function(elements){
+    var i, len = elements.length;
+    var newElements = JSON.parse(JSON.stringify(elements));
+    this.resetElements(newElements);
+    return newElements;
+}
+
+RepeaterModifier.prototype.changeGroupRender = function(elements, renderFlag) {
+    var i, len = elements.length;
+    for(i = 0; i < len ; i += 1) {
+        elements[i]._render = renderFlag;
+        if(elements[i].ty === 'gr') {
+            this.changeGroupRender(elements[i].it, renderFlag);
+        }
+    }
+}
+
 RepeaterModifier.prototype.processShapes = function(firstFrame){
-    if(!this.dynamicProperties.length){
+
+    if(this.elem.globalData.frameId === this.frameId){
+        return;
+    }
+    this.frameId = this.elem.globalData.frameId;
+    if(!this.dynamicProperties.length && !firstFrame){
         this.mdf = false;
     }
-    var i, len = this.shapes.length;
-    var j, jLen;
-    var shapeData, localShapeCollection, currentPath;
-    var copies = Math.ceil(this.c.v);
-    var offset = this.o.v;
-    var offsetModulo = offset%1;
-    var roundOffset = offset > 0 ? Math.floor(offset) : Math.ceil(offset);
-    var k, pathData, shapeCollection, shapeCollectionList;
-    var tMat = this.tr.v.props;
-    var pProps = this.pMatrix.props;
-    var rProps = this.rMatrix.props;
-    var sProps = this.sMatrix.props;
-    var iteration = 0;
-    var l, lLen, tProps,transformers, maxLvl;
-    for(i=0;i<len;i+=1){
-        shapeData = this.shapes[i];
-        localShapeCollection = shapeData.localShapeCollection;
-        if(!(!shapeData.shape.mdf && !this.mdf && !firstFrame)){
-            localShapeCollection.releaseShapes();
-            shapeData.shape.mdf = true;
-            shapeCollection = shapeData.shape.paths;
-            shapeCollectionList = shapeCollection.shapes;
-            jLen = shapeCollection._length;
-            iteration = 0;
-            this.pMatrix.reset();
-            this.rMatrix.reset();
-            this.sMatrix.reset();
-            this.tMatrix.reset();
-            this.matrix.reset();
-
-            if(offset > 0) {
-                while(iteration<roundOffset){
-                    this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false);
-                    iteration += 1;
+    if(this.mdf){
+        var copies = Math.ceil(this.c.v);
+        if(this._groups.length < copies){
+            while(this._groups.length < copies){
+                var group = {
+                    it:this.cloneElements(this._elements),
+                    ty:'gr'
                 }
-                if(offsetModulo){
-                    this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, offsetModulo, false);
-                    iteration += offsetModulo;
-                }
-            } else if(roundOffset < 0) {
-                while(iteration>roundOffset){
-                    this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, true);
-                    iteration -= 1;
-                }
-                if(offsetModulo){
-                    this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, - offsetModulo, true);
-                    iteration -= offsetModulo;
-                }
+                group.it.push({"a":{"a":0,"ix":1,"k":[0,0]},"nm":"Transform","o":{"a":0,"ix":7,"k":100},"p":{"a":0,"ix":2,"k":[0,0]},"r":{"a":0,"ix":6,"k":0},"s":{"a":0,"ix":3,"k":[100,100]},"sa":{"a":0,"ix":5,"k":0},"sk":{"a":0,"ix":4,"k":0},"ty":"tr"});
+                
+                this.arr.splice(0,0,group);
+                this._groups.splice(0,0,group);
+                this._currentCopies += 1;
             }
-            for(j=0;j<jLen;j+=1){
-                currentPath = shapeCollectionList[j];
-                for(k=0;k<copies;k+=1) {
-                    if(k !== 0) {
-                        this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false);
-                    }
-                    if(shapeData.data.transformers) {
-                        shapeData.data.lvl = 0;
-                        maxLvl = 0;
-                        lLen = shapeData.data.elements.length;
-                        for(l = 0; l < lLen; l += 1) {
-                            maxLvl = Math.max(maxLvl, shapeData.data.elements[l].st.lvl);
-                        } 
-                        transformers = shapeData.data.transformers;
-                        lLen = transformers.length;
-                        for(l = lLen - 1; l >= maxLvl; l -= 1) {
-                            tProps = transformers[l].mProps.v.props;
-                            this.matrix.transform(tProps[0],tProps[1],tProps[2],tProps[3],tProps[4],tProps[5],tProps[6],tProps[7],tProps[8],tProps[9],tProps[10],tProps[11],tProps[12],tProps[13],tProps[14],tProps[15]);
-                        }
-                    }
-                    if(iteration !== 0){
-                        this.matrix.transform(rProps[0],rProps[1],rProps[2],rProps[3],rProps[4],rProps[5],rProps[6],rProps[7],rProps[8],rProps[9],rProps[10],rProps[11],rProps[12],rProps[13],rProps[14],rProps[15]);
-                        this.matrix.transform(sProps[0],sProps[1],sProps[2],sProps[3],sProps[4],sProps[5],sProps[6],sProps[7],sProps[8],sProps[9],sProps[10],sProps[11],sProps[12],sProps[13],sProps[14],sProps[15]);
-                        this.matrix.transform(pProps[0],pProps[1],pProps[2],pProps[3],pProps[4],pProps[5],pProps[6],pProps[7],pProps[8],pProps[9],pProps[10],pProps[11],pProps[12],pProps[13],pProps[14],pProps[15]);
-                    }
-                    localShapeCollection.addShape(this.processPath(currentPath, this.matrix));
-                    this.matrix.reset();
-                    iteration += 1;
-                }
+            this.elem.reloadShapes();
+        }
+        var i, cont = 0, renderFlag;
+        for(i = 0; i  <= this._groups.length - 1; i += 1){
+            renderFlag = cont < copies;
+            this._groups[i]._render = renderFlag;
+            this.changeGroupRender(this._groups[i].it, renderFlag);
+            cont += 1;
+        }
+        
+        this._currentCopies = copies;
+        this.elem.firstFrame = true;
+        ////
+
+        var offset = this.o.v;
+        var offsetModulo = offset%1;
+        var roundOffset = offset > 0 ? Math.floor(offset) : Math.ceil(offset);
+        var k;
+        var tMat = this.tr.v.props;
+        var pProps = this.pMatrix.props;
+        var rProps = this.rMatrix.props;
+        var sProps = this.sMatrix.props;
+        this.pMatrix.reset();
+        this.rMatrix.reset();
+        this.sMatrix.reset();
+        this.tMatrix.reset();
+        this.matrix.reset();
+        var iteration = 0;
+
+        if(offset > 0) {
+            while(iteration<roundOffset){
+                this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false);
+                iteration += 1;
+            }
+            if(offsetModulo){
+                this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, offsetModulo, false);
+                iteration += offsetModulo;
+            }
+        } else if(offset < 0) {
+            while(iteration>roundOffset){
+                this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, true);
+                iteration -= 1;
+            }
+            if(offsetModulo){
+                this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, - offsetModulo, true);
+                iteration -= offsetModulo;
             }
         }
-        shapeData.shape.paths = localShapeCollection;
+        i = this.data.m === 1 ? 0 : this._currentCopies - 1;
+        var dir = this.data.m === 1 ? 1 : -1;
+        cont = this._currentCopies;
+        while(cont){
+            if(iteration !== 0){
+                if((i !== 0 && dir === 1) || (i !== this._currentCopies - 1 && dir === -1)){
+                    this.applyTransforms(this.pMatrix, this.rMatrix, this.sMatrix, this.tr, 1, false);
+                }
+                this.matrix.transform(rProps[0],rProps[1],rProps[2],rProps[3],rProps[4],rProps[5],rProps[6],rProps[7],rProps[8],rProps[9],rProps[10],rProps[11],rProps[12],rProps[13],rProps[14],rProps[15]);
+                this.matrix.transform(sProps[0],sProps[1],sProps[2],sProps[3],sProps[4],sProps[5],sProps[6],sProps[7],sProps[8],sProps[9],sProps[10],sProps[11],sProps[12],sProps[13],sProps[14],sProps[15]);
+                this.matrix.transform(pProps[0],pProps[1],pProps[2],pProps[3],pProps[4],pProps[5],pProps[6],pProps[7],pProps[8],pProps[9],pProps[10],pProps[11],pProps[12],pProps[13],pProps[14],pProps[15]);
+                var items = this.elemsData[i].it;
+                var itemsTransform = items[items.length - 1].transform.mProps.v.props;
+                var j, jLen = itemsTransform.length;
+                for(j=0;j<jLen;j+=1) {
+                    itemsTransform[j] = this.matrix.props[j];
+                }
+                this.matrix.reset();
+            } else {
+                this.matrix.reset();
+                var items = this.elemsData[i].it;
+                var itemsTransform = items[items.length - 1].transform.mProps.v.props;
+                var j, jLen = itemsTransform.length;
+                for(j=0;j<jLen;j+=1) {
+                    itemsTransform[j] = this.matrix.props[j];
+                }
+            }
+            iteration += 1;
+            cont -= 1;
+            i += dir;
+        }
     }
-};
+}
 
-RepeaterModifier.prototype.processPath = function(path, transform) {
-    var clonedPath = shape_pool.clone(path, transform);
-    return clonedPath;
-};
-
+RepeaterModifier.prototype.addShape = function(){}
 
 ShapeModifiers.registerModifier('rp',RepeaterModifier);
\ No newline at end of file
diff --git a/player/js/utils/shapes/ShapeModifiers.js b/player/js/utils/shapes/ShapeModifiers.js
index 9f44740..00cf36b 100644
--- a/player/js/utils/shapes/ShapeModifiers.js
+++ b/player/js/utils/shapes/ShapeModifiers.js
@@ -34,7 +34,6 @@
     this.mdf = false;
     this.closed = false;
     this.k = false;
-    this.isTrimming = false;
     this.comp = elem.comp;
     this.initModifierProperties(elem,data);
     if(this.dynamicProperties.length){