@lightningjs/blits 0.10.0 → 1.1.0

package/src/components/FPScounter.js

@@ -23,52 +23,37 @@ export default () =>
   Component('FPScounter', {
     /* eslint-disable no-unused-vars */
     code: {
-      render: function anonymous(parent, component, context, components) {
+      render: function anonymous(parent, component, context, components, effect, getRaw) {
         const elms = []
-
-        if (!elms[0]) {
-          elms[0] = this.element({ parent: parent || 'root' }, component)
-        }
+        let componentType
+        const rootComponent = component
         const elementConfig0 = {}
 
-        if (!elms[0].nodeId) {
-          elms[0].populate(elementConfig0)
-        }
+        elms[0] = this.element({ parent: parent || 'root' }, component)
 
+        elms[0].populate(elementConfig0)
         parent = elms[0]
-
-        if (!elms[1]) {
-          elms[1] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig1 = {}
 
+        elms[1] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig1['y'] = 15
         elementConfig1['x'] = 20
-
-        if (!elms[1].nodeId) {
-          elms[1].populate(elementConfig1)
-        }
-
+        elms[1].populate(elementConfig1)
         parent = elms[1]
-
-        if (!elms[2]) {
-          elms[2] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig2 = {}
 
-        if (!elms[2].nodeId) {
-          elms[2].populate(elementConfig2)
-        }
+        elms[2] = this.element({ parent: parent || 'root' }, component)
+
+        elms[2].populate(elementConfig2)
 
         const cmp3 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[2]
-
-        if (!elms[3]) {
-          elms[3] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig3 = {}
 
+        elms[3] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig3['image'] = component.image
         elementConfig3['w'] = 43
         elementConfig3['h'] = 25
@@ -81,10 +66,7 @@ export default () =>
           }
         }
 
-        if (!elms[3].nodeId) {
-          elms[3].populate(elementConfig3)
-        }
-
+        elms[3].populate(elementConfig3)
         parent = elms[3]
         const props4 = {}
         props4['image'] = component.image
@@ -93,58 +75,50 @@ export default () =>
         props4['map'] = component.sprite
         props4['frame'] = 'fps'
 
-        if (!elms[4]) {
-          const componentType = props4['is'] || 'Sprite'
-
-          let component4
-          if (typeof componentType === 'string') {
-            component4 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component4) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component4 = componentType
-          }
-
-          elms[4] = component4.call(null, { props: props4 }, elms[3], component)
+        componentType = props4['is'] || 'Sprite'
 
-          if (elms[4][Symbol.for('slots')][0]) {
-            parent = elms[4][Symbol.for('slots')][0]
-            component = elms[4]
-          } else {
-            parent = elms[4][Symbol.for('children')][0]
+        let component4
+        if (typeof componentType === 'string') {
+          component4 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component4) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component4 = componentType
         }
 
-        parent = elms[2]
+        elms[4] = component4.call(null, { props: props4 }, elms[3], component)
 
-        if (!elms[5]) {
-          elms[5] = this.element({ parent: parent || 'root' }, component)
+        if (elms[4][Symbol.for('slots')][0]) {
+          parent = elms[4][Symbol.for('slots')][0]
+          component = elms[4]
+        } else {
+          parent = elms[4][Symbol.for('children')][0]
         }
+
+        parent = elms[2]
         const elementConfig5 = {}
 
+        elms[5] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig5['x'] = 58
         elementConfig5['y'] = 2
-
-        if (!elms[5].nodeId) {
-          elms[5].populate(elementConfig5)
-        }
+        elms[5].populate(elementConfig5)
 
         const cmp6 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[5]
-
-        if (!elms[6]) {
-          elms[6] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig6 = {}
 
+        elms[6] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig6['image'] = component.image
         elementConfig6['x'] = 0
         elementConfig6['h'] = 20
         elementConfig6['w'] = 20
         elementConfig6['map'] = component.sprite
+        elementConfig6['frame'] = component.fps[0]
 
         if (typeof cmp6 !== 'undefined') {
           for (let key in cmp6.config.props) {
@@ -152,10 +126,7 @@ export default () =>
           }
         }
 
-        if (!elms[6].nodeId) {
-          elms[6].populate(elementConfig6)
-        }
-
+        elms[6].populate(elementConfig6)
         parent = elms[6]
         const props7 = {}
         props7['image'] = component.image
@@ -165,44 +136,41 @@ export default () =>
         props7['map'] = component.sprite
         props7['frame'] = component.fps[0]
 
-        if (!elms[7]) {
-          const componentType = props7['is'] || 'Sprite'
-
-          let component7
-          if (typeof componentType === 'string') {
-            component7 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component7) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component7 = componentType
+        componentType = props7['is'] || 'Sprite'
+
+        let component7
+        if (typeof componentType === 'string') {
+          component7 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component7) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component7 = componentType
+        }
 
-          elms[7] = component7.call(null, { props: props7 }, elms[6], component)
+        elms[7] = component7.call(null, { props: props7 }, elms[6], component)
 
-          if (elms[7][Symbol.for('slots')][0]) {
-            parent = elms[7][Symbol.for('slots')][0]
-            component = elms[7]
-          } else {
-            parent = elms[7][Symbol.for('children')][0]
-          }
+        if (elms[7][Symbol.for('slots')][0]) {
+          parent = elms[7][Symbol.for('slots')][0]
+          component = elms[7]
+        } else {
+          parent = elms[7][Symbol.for('children')][0]
         }
 
         const cmp8 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[5]
-
-        if (!elms[8]) {
-          elms[8] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig8 = {}
 
+        elms[8] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig8['image'] = component.image
         elementConfig8['x'] = 18
         elementConfig8['h'] = 20
         elementConfig8['w'] = 20
         elementConfig8['map'] = component.sprite
+        elementConfig8['frame'] = component.fps[1]
 
         if (typeof cmp8 !== 'undefined') {
           for (let key in cmp8.config.props) {
@@ -210,10 +178,7 @@ export default () =>
           }
         }
 
-        if (!elms[8].nodeId) {
-          elms[8].populate(elementConfig8)
-        }
-
+        elms[8].populate(elementConfig8)
         parent = elms[8]
         const props9 = {}
         props9['image'] = component.image
@@ -223,44 +188,41 @@ export default () =>
         props9['map'] = component.sprite
         props9['frame'] = component.fps[1]
 
-        if (!elms[9]) {
-          const componentType = props9['is'] || 'Sprite'
-
-          let component9
-          if (typeof componentType === 'string') {
-            component9 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component9) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component9 = componentType
+        componentType = props9['is'] || 'Sprite'
+
+        let component9
+        if (typeof componentType === 'string') {
+          component9 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component9) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component9 = componentType
+        }
 
-          elms[9] = component9.call(null, { props: props9 }, elms[8], component)
+        elms[9] = component9.call(null, { props: props9 }, elms[8], component)
 
-          if (elms[9][Symbol.for('slots')][0]) {
-            parent = elms[9][Symbol.for('slots')][0]
-            component = elms[9]
-          } else {
-            parent = elms[9][Symbol.for('children')][0]
-          }
+        if (elms[9][Symbol.for('slots')][0]) {
+          parent = elms[9][Symbol.for('slots')][0]
+          component = elms[9]
+        } else {
+          parent = elms[9][Symbol.for('children')][0]
         }
 
         const cmp10 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[5]
-
-        if (!elms[10]) {
-          elms[10] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig10 = {}
 
+        elms[10] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig10['image'] = component.image
         elementConfig10['x'] = 36
         elementConfig10['h'] = 20
         elementConfig10['w'] = 20
         elementConfig10['map'] = component.sprite
+        elementConfig10['frame'] = component.fps[2]
 
         if (typeof cmp10 !== 'undefined') {
           for (let key in cmp10.config.props) {
@@ -268,10 +230,7 @@ export default () =>
           }
         }
 
-        if (!elms[10].nodeId) {
-          elms[10].populate(elementConfig10)
-        }
-
+        elms[10].populate(elementConfig10)
         parent = elms[10]
         const props11 = {}
         props11['image'] = component.image
@@ -281,52 +240,43 @@ export default () =>
         props11['map'] = component.sprite
         props11['frame'] = component.fps[2]
 
-        if (!elms[11]) {
-          const componentType = props11['is'] || 'Sprite'
-
-          let component11
-          if (typeof componentType === 'string') {
-            component11 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component11) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component11 = componentType
-          }
-
-          elms[11] = component11.call(null, { props: props11 }, elms[10], component)
+        componentType = props11['is'] || 'Sprite'
 
-          if (elms[11][Symbol.for('slots')][0]) {
-            parent = elms[11][Symbol.for('slots')][0]
-            component = elms[11]
-          } else {
-            parent = elms[11][Symbol.for('children')][0]
+        let component11
+        if (typeof componentType === 'string') {
+          component11 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component11) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component11 = componentType
         }
 
-        parent = elms[1]
+        elms[11] = component11.call(null, { props: props11 }, elms[10], component)
 
-        if (!elms[12]) {
-          elms[12] = this.element({ parent: parent || 'root' }, component)
+        if (elms[11][Symbol.for('slots')][0]) {
+          parent = elms[11][Symbol.for('slots')][0]
+          component = elms[11]
+        } else {
+          parent = elms[11][Symbol.for('children')][0]
         }
+
+        parent = elms[1]
         const elementConfig12 = {}
 
-        elementConfig12['x'] = 150
+        elms[12] = this.element({ parent: parent || 'root' }, component)
 
-        if (!elms[12].nodeId) {
-          elms[12].populate(elementConfig12)
-        }
+        elementConfig12['x'] = 150
+        elms[12].populate(elementConfig12)
 
         const cmp13 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[12]
-
-        if (!elms[13]) {
-          elms[13] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig13 = {}
 
+        elms[13] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig13['image'] = component.image
         elementConfig13['y'] = 2
         elementConfig13['w'] = 48
@@ -340,10 +290,7 @@ export default () =>
           }
         }
 
-        if (!elms[13].nodeId) {
-          elms[13].populate(elementConfig13)
-        }
-
+        elms[13].populate(elementConfig13)
         parent = elms[13]
         const props14 = {}
         props14['image'] = component.image
@@ -353,58 +300,50 @@ export default () =>
         props14['map'] = component.sprite
         props14['frame'] = 'avg'
 
-        if (!elms[14]) {
-          const componentType = props14['is'] || 'Sprite'
-
-          let component14
-          if (typeof componentType === 'string') {
-            component14 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component14) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component14 = componentType
-          }
+        componentType = props14['is'] || 'Sprite'
 
-          elms[14] = component14.call(null, { props: props14 }, elms[13], component)
-
-          if (elms[14][Symbol.for('slots')][0]) {
-            parent = elms[14][Symbol.for('slots')][0]
-            component = elms[14]
-          } else {
-            parent = elms[14][Symbol.for('children')][0]
+        let component14
+        if (typeof componentType === 'string') {
+          component14 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component14) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component14 = componentType
         }
 
-        parent = elms[12]
+        elms[14] = component14.call(null, { props: props14 }, elms[13], component)
 
-        if (!elms[15]) {
-          elms[15] = this.element({ parent: parent || 'root' }, component)
+        if (elms[14][Symbol.for('slots')][0]) {
+          parent = elms[14][Symbol.for('slots')][0]
+          component = elms[14]
+        } else {
+          parent = elms[14][Symbol.for('children')][0]
         }
+
+        parent = elms[12]
         const elementConfig15 = {}
 
+        elms[15] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig15['x'] = 63
         elementConfig15['y'] = 2
-
-        if (!elms[15].nodeId) {
-          elms[15].populate(elementConfig15)
-        }
+        elms[15].populate(elementConfig15)
 
         const cmp16 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[15]
-
-        if (!elms[16]) {
-          elms[16] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig16 = {}
 
+        elms[16] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig16['image'] = component.image
         elementConfig16['x'] = 0
         elementConfig16['h'] = 20
         elementConfig16['w'] = 20
         elementConfig16['map'] = component.sprite
+        elementConfig16['frame'] = component.avgFps[0]
 
         if (typeof cmp16 !== 'undefined') {
           for (let key in cmp16.config.props) {
@@ -412,10 +351,7 @@ export default () =>
           }
         }
 
-        if (!elms[16].nodeId) {
-          elms[16].populate(elementConfig16)
-        }
-
+        elms[16].populate(elementConfig16)
         parent = elms[16]
         const props17 = {}
         props17['image'] = component.image
@@ -425,44 +361,41 @@ export default () =>
         props17['map'] = component.sprite
         props17['frame'] = component.avgFps[0]
 
-        if (!elms[17]) {
-          const componentType = props17['is'] || 'Sprite'
-
-          let component17
-          if (typeof componentType === 'string') {
-            component17 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component17) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component17 = componentType
+        componentType = props17['is'] || 'Sprite'
+
+        let component17
+        if (typeof componentType === 'string') {
+          component17 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component17) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component17 = componentType
+        }
 
-          elms[17] = component17.call(null, { props: props17 }, elms[16], component)
+        elms[17] = component17.call(null, { props: props17 }, elms[16], component)
 
-          if (elms[17][Symbol.for('slots')][0]) {
-            parent = elms[17][Symbol.for('slots')][0]
-            component = elms[17]
-          } else {
-            parent = elms[17][Symbol.for('children')][0]
-          }
+        if (elms[17][Symbol.for('slots')][0]) {
+          parent = elms[17][Symbol.for('slots')][0]
+          component = elms[17]
+        } else {
+          parent = elms[17][Symbol.for('children')][0]
         }
 
         const cmp18 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[15]
-
-        if (!elms[18]) {
-          elms[18] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig18 = {}
 
+        elms[18] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig18['image'] = component.image
         elementConfig18['x'] = 18
         elementConfig18['h'] = 20
         elementConfig18['w'] = 20
         elementConfig18['map'] = component.sprite
+        elementConfig18['frame'] = component.avgFps[1]
 
         if (typeof cmp18 !== 'undefined') {
           for (let key in cmp18.config.props) {
@@ -470,10 +403,7 @@ export default () =>
           }
         }
 
-        if (!elms[18].nodeId) {
-          elms[18].populate(elementConfig18)
-        }
-
+        elms[18].populate(elementConfig18)
         parent = elms[18]
         const props19 = {}
         props19['image'] = component.image
@@ -483,44 +413,41 @@ export default () =>
         props19['map'] = component.sprite
         props19['frame'] = component.avgFps[1]
 
-        if (!elms[19]) {
-          const componentType = props19['is'] || 'Sprite'
-
-          let component19
-          if (typeof componentType === 'string') {
-            component19 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component19) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component19 = componentType
+        componentType = props19['is'] || 'Sprite'
+
+        let component19
+        if (typeof componentType === 'string') {
+          component19 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component19) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component19 = componentType
+        }
 
-          elms[19] = component19.call(null, { props: props19 }, elms[18], component)
+        elms[19] = component19.call(null, { props: props19 }, elms[18], component)
 
-          if (elms[19][Symbol.for('slots')][0]) {
-            parent = elms[19][Symbol.for('slots')][0]
-            component = elms[19]
-          } else {
-            parent = elms[19][Symbol.for('children')][0]
-          }
+        if (elms[19][Symbol.for('slots')][0]) {
+          parent = elms[19][Symbol.for('slots')][0]
+          component = elms[19]
+        } else {
+          parent = elms[19][Symbol.for('children')][0]
         }
 
         const cmp20 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[15]
-
-        if (!elms[20]) {
-          elms[20] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig20 = {}
 
+        elms[20] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig20['image'] = component.image
         elementConfig20['x'] = 36
         elementConfig20['h'] = 20
         elementConfig20['w'] = 20
         elementConfig20['map'] = component.sprite
+        elementConfig20['frame'] = component.avgFps[2]
 
         if (typeof cmp20 !== 'undefined') {
           for (let key in cmp20.config.props) {
@@ -528,10 +455,7 @@ export default () =>
           }
         }
 
-        if (!elms[20].nodeId) {
-          elms[20].populate(elementConfig20)
-        }
-
+        elms[20].populate(elementConfig20)
         parent = elms[20]
         const props21 = {}
         props21['image'] = component.image
@@ -541,53 +465,44 @@ export default () =>
         props21['map'] = component.sprite
         props21['frame'] = component.avgFps[2]
 
-        if (!elms[21]) {
-          const componentType = props21['is'] || 'Sprite'
-
-          let component21
-          if (typeof componentType === 'string') {
-            component21 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component21) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component21 = componentType
-          }
-
-          elms[21] = component21.call(null, { props: props21 }, elms[20], component)
+        componentType = props21['is'] || 'Sprite'
 
-          if (elms[21][Symbol.for('slots')][0]) {
-            parent = elms[21][Symbol.for('slots')][0]
-            component = elms[21]
-          } else {
-            parent = elms[21][Symbol.for('children')][0]
+        let component21
+        if (typeof componentType === 'string') {
+          component21 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component21) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component21 = componentType
         }
 
-        parent = elms[1]
+        elms[21] = component21.call(null, { props: props21 }, elms[20], component)
 
-        if (!elms[22]) {
-          elms[22] = this.element({ parent: parent || 'root' }, component)
+        if (elms[21][Symbol.for('slots')][0]) {
+          parent = elms[21][Symbol.for('slots')][0]
+          component = elms[21]
+        } else {
+          parent = elms[21][Symbol.for('children')][0]
         }
+
+        parent = elms[1]
         const elementConfig22 = {}
 
+        elms[22] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig22['x'] = 0
         elementConfig22['y'] = 40
-
-        if (!elms[22].nodeId) {
-          elms[22].populate(elementConfig22)
-        }
+        elms[22].populate(elementConfig22)
 
         const cmp23 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[22]
-
-        if (!elms[23]) {
-          elms[23] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig23 = {}
 
+        elms[23] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig23['image'] = component.image
         elementConfig23['x'] = -2
         elementConfig23['w'] = 47
@@ -601,10 +516,7 @@ export default () =>
           }
         }
 
-        if (!elms[23].nodeId) {
-          elms[23].populate(elementConfig23)
-        }
-
+        elms[23].populate(elementConfig23)
         parent = elms[23]
         const props24 = {}
         props24['image'] = component.image
@@ -614,58 +526,50 @@ export default () =>
         props24['map'] = component.sprite
         props24['frame'] = 'min'
 
-        if (!elms[24]) {
-          const componentType = props24['is'] || 'Sprite'
-
-          let component24
-          if (typeof componentType === 'string') {
-            component24 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component24) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component24 = componentType
-          }
-
-          elms[24] = component24.call(null, { props: props24 }, elms[23], component)
+        componentType = props24['is'] || 'Sprite'
 
-          if (elms[24][Symbol.for('slots')][0]) {
-            parent = elms[24][Symbol.for('slots')][0]
-            component = elms[24]
-          } else {
-            parent = elms[24][Symbol.for('children')][0]
+        let component24
+        if (typeof componentType === 'string') {
+          component24 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component24) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component24 = componentType
         }
 
-        parent = elms[22]
+        elms[24] = component24.call(null, { props: props24 }, elms[23], component)
 
-        if (!elms[25]) {
-          elms[25] = this.element({ parent: parent || 'root' }, component)
+        if (elms[24][Symbol.for('slots')][0]) {
+          parent = elms[24][Symbol.for('slots')][0]
+          component = elms[24]
+        } else {
+          parent = elms[24][Symbol.for('children')][0]
         }
+
+        parent = elms[22]
         const elementConfig25 = {}
 
+        elms[25] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig25['x'] = 58
         elementConfig25['y'] = 2
-
-        if (!elms[25].nodeId) {
-          elms[25].populate(elementConfig25)
-        }
+        elms[25].populate(elementConfig25)
 
         const cmp26 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[25]
-
-        if (!elms[26]) {
-          elms[26] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig26 = {}
 
+        elms[26] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig26['image'] = component.image
         elementConfig26['x'] = 0
         elementConfig26['h'] = 20
         elementConfig26['w'] = 20
         elementConfig26['map'] = component.sprite
+        elementConfig26['frame'] = component.minFps[0]
 
         if (typeof cmp26 !== 'undefined') {
           for (let key in cmp26.config.props) {
@@ -673,10 +577,7 @@ export default () =>
           }
         }
 
-        if (!elms[26].nodeId) {
-          elms[26].populate(elementConfig26)
-        }
-
+        elms[26].populate(elementConfig26)
         parent = elms[26]
         const props27 = {}
         props27['image'] = component.image
@@ -686,44 +587,41 @@ export default () =>
         props27['map'] = component.sprite
         props27['frame'] = component.minFps[0]
 
-        if (!elms[27]) {
-          const componentType = props27['is'] || 'Sprite'
-
-          let component27
-          if (typeof componentType === 'string') {
-            component27 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component27) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component27 = componentType
+        componentType = props27['is'] || 'Sprite'
+
+        let component27
+        if (typeof componentType === 'string') {
+          component27 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component27) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component27 = componentType
+        }
 
-          elms[27] = component27.call(null, { props: props27 }, elms[26], component)
+        elms[27] = component27.call(null, { props: props27 }, elms[26], component)
 
-          if (elms[27][Symbol.for('slots')][0]) {
-            parent = elms[27][Symbol.for('slots')][0]
-            component = elms[27]
-          } else {
-            parent = elms[27][Symbol.for('children')][0]
-          }
+        if (elms[27][Symbol.for('slots')][0]) {
+          parent = elms[27][Symbol.for('slots')][0]
+          component = elms[27]
+        } else {
+          parent = elms[27][Symbol.for('children')][0]
         }
 
         const cmp28 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[25]
-
-        if (!elms[28]) {
-          elms[28] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig28 = {}
 
+        elms[28] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig28['image'] = component.image
         elementConfig28['x'] = 18
         elementConfig28['h'] = 20
         elementConfig28['w'] = 20
         elementConfig28['map'] = component.sprite
+        elementConfig28['frame'] = component.minFps[1]
 
         if (typeof cmp28 !== 'undefined') {
           for (let key in cmp28.config.props) {
@@ -731,10 +629,7 @@ export default () =>
           }
         }
 
-        if (!elms[28].nodeId) {
-          elms[28].populate(elementConfig28)
-        }
-
+        elms[28].populate(elementConfig28)
         parent = elms[28]
         const props29 = {}
         props29['image'] = component.image
@@ -744,44 +639,41 @@ export default () =>
         props29['map'] = component.sprite
         props29['frame'] = component.minFps[1]
 
-        if (!elms[29]) {
-          const componentType = props29['is'] || 'Sprite'
-
-          let component29
-          if (typeof componentType === 'string') {
-            component29 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component29) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component29 = componentType
+        componentType = props29['is'] || 'Sprite'
+
+        let component29
+        if (typeof componentType === 'string') {
+          component29 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component29) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component29 = componentType
+        }
 
-          elms[29] = component29.call(null, { props: props29 }, elms[28], component)
+        elms[29] = component29.call(null, { props: props29 }, elms[28], component)
 
-          if (elms[29][Symbol.for('slots')][0]) {
-            parent = elms[29][Symbol.for('slots')][0]
-            component = elms[29]
-          } else {
-            parent = elms[29][Symbol.for('children')][0]
-          }
+        if (elms[29][Symbol.for('slots')][0]) {
+          parent = elms[29][Symbol.for('slots')][0]
+          component = elms[29]
+        } else {
+          parent = elms[29][Symbol.for('children')][0]
         }
 
         const cmp30 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[25]
-
-        if (!elms[30]) {
-          elms[30] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig30 = {}
 
+        elms[30] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig30['image'] = component.image
         elementConfig30['x'] = 36
         elementConfig30['h'] = 20
         elementConfig30['w'] = 20
         elementConfig30['map'] = component.sprite
+        elementConfig30['frame'] = component.minFps[2]
 
         if (typeof cmp30 !== 'undefined') {
           for (let key in cmp30.config.props) {
@@ -789,10 +681,7 @@ export default () =>
           }
         }
 
-        if (!elms[30].nodeId) {
-          elms[30].populate(elementConfig30)
-        }
-
+        elms[30].populate(elementConfig30)
         parent = elms[30]
         const props31 = {}
         props31['image'] = component.image
@@ -802,53 +691,44 @@ export default () =>
         props31['map'] = component.sprite
         props31['frame'] = component.minFps[2]
 
-        if (!elms[31]) {
-          const componentType = props31['is'] || 'Sprite'
-
-          let component31
-          if (typeof componentType === 'string') {
-            component31 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component31) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component31 = componentType
-          }
-
-          elms[31] = component31.call(null, { props: props31 }, elms[30], component)
+        componentType = props31['is'] || 'Sprite'
 
-          if (elms[31][Symbol.for('slots')][0]) {
-            parent = elms[31][Symbol.for('slots')][0]
-            component = elms[31]
-          } else {
-            parent = elms[31][Symbol.for('children')][0]
+        let component31
+        if (typeof componentType === 'string') {
+          component31 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component31) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component31 = componentType
         }
 
-        parent = elms[1]
+        elms[31] = component31.call(null, { props: props31 }, elms[30], component)
 
-        if (!elms[32]) {
-          elms[32] = this.element({ parent: parent || 'root' }, component)
+        if (elms[31][Symbol.for('slots')][0]) {
+          parent = elms[31][Symbol.for('slots')][0]
+          component = elms[31]
+        } else {
+          parent = elms[31][Symbol.for('children')][0]
         }
+
+        parent = elms[1]
         const elementConfig32 = {}
 
+        elms[32] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig32['x'] = 150
         elementConfig32['y'] = 40
-
-        if (!elms[32].nodeId) {
-          elms[32].populate(elementConfig32)
-        }
+        elms[32].populate(elementConfig32)
 
         const cmp33 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[32]
-
-        if (!elms[33]) {
-          elms[33] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig33 = {}
 
+        elms[33] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig33['image'] = component.image
         elementConfig33['w'] = 53
         elementConfig33['h'] = 25
@@ -861,10 +741,7 @@ export default () =>
           }
         }
 
-        if (!elms[33].nodeId) {
-          elms[33].populate(elementConfig33)
-        }
-
+        elms[33].populate(elementConfig33)
         parent = elms[33]
         const props34 = {}
         props34['image'] = component.image
@@ -873,58 +750,50 @@ export default () =>
         props34['map'] = component.sprite
         props34['frame'] = 'max'
 
-        if (!elms[34]) {
-          const componentType = props34['is'] || 'Sprite'
-
-          let component34
-          if (typeof componentType === 'string') {
-            component34 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component34) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component34 = componentType
-          }
-
-          elms[34] = component34.call(null, { props: props34 }, elms[33], component)
+        componentType = props34['is'] || 'Sprite'
 
-          if (elms[34][Symbol.for('slots')][0]) {
-            parent = elms[34][Symbol.for('slots')][0]
-            component = elms[34]
-          } else {
-            parent = elms[34][Symbol.for('children')][0]
+        let component34
+        if (typeof componentType === 'string') {
+          component34 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component34) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component34 = componentType
         }
 
-        parent = elms[32]
+        elms[34] = component34.call(null, { props: props34 }, elms[33], component)
 
-        if (!elms[35]) {
-          elms[35] = this.element({ parent: parent || 'root' }, component)
+        if (elms[34][Symbol.for('slots')][0]) {
+          parent = elms[34][Symbol.for('slots')][0]
+          component = elms[34]
+        } else {
+          parent = elms[34][Symbol.for('children')][0]
         }
+
+        parent = elms[32]
         const elementConfig35 = {}
 
+        elms[35] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig35['x'] = 63
         elementConfig35['y'] = 2
-
-        if (!elms[35].nodeId) {
-          elms[35].populate(elementConfig35)
-        }
+        elms[35].populate(elementConfig35)
 
         const cmp36 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[35]
-
-        if (!elms[36]) {
-          elms[36] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig36 = {}
 
+        elms[36] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig36['image'] = component.image
         elementConfig36['x'] = 0
         elementConfig36['h'] = 20
         elementConfig36['w'] = 20
         elementConfig36['map'] = component.sprite
+        elementConfig36['frame'] = component.maxFps[0]
 
         if (typeof cmp36 !== 'undefined') {
           for (let key in cmp36.config.props) {
@@ -932,10 +801,7 @@ export default () =>
           }
         }
 
-        if (!elms[36].nodeId) {
-          elms[36].populate(elementConfig36)
-        }
-
+        elms[36].populate(elementConfig36)
         parent = elms[36]
         const props37 = {}
         props37['image'] = component.image
@@ -945,44 +811,41 @@ export default () =>
         props37['map'] = component.sprite
         props37['frame'] = component.maxFps[0]
 
-        if (!elms[37]) {
-          const componentType = props37['is'] || 'Sprite'
-
-          let component37
-          if (typeof componentType === 'string') {
-            component37 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component37) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component37 = componentType
+        componentType = props37['is'] || 'Sprite'
+
+        let component37
+        if (typeof componentType === 'string') {
+          component37 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component37) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component37 = componentType
+        }
 
-          elms[37] = component37.call(null, { props: props37 }, elms[36], component)
+        elms[37] = component37.call(null, { props: props37 }, elms[36], component)
 
-          if (elms[37][Symbol.for('slots')][0]) {
-            parent = elms[37][Symbol.for('slots')][0]
-            component = elms[37]
-          } else {
-            parent = elms[37][Symbol.for('children')][0]
-          }
+        if (elms[37][Symbol.for('slots')][0]) {
+          parent = elms[37][Symbol.for('slots')][0]
+          component = elms[37]
+        } else {
+          parent = elms[37][Symbol.for('children')][0]
         }
 
         const cmp38 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[35]
-
-        if (!elms[38]) {
-          elms[38] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig38 = {}
 
+        elms[38] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig38['image'] = component.image
         elementConfig38['x'] = 18
         elementConfig38['h'] = 20
         elementConfig38['w'] = 20
         elementConfig38['map'] = component.sprite
+        elementConfig38['frame'] = component.maxFps[1]
 
         if (typeof cmp38 !== 'undefined') {
           for (let key in cmp38.config.props) {
@@ -990,10 +853,7 @@ export default () =>
           }
         }
 
-        if (!elms[38].nodeId) {
-          elms[38].populate(elementConfig38)
-        }
-
+        elms[38].populate(elementConfig38)
         parent = elms[38]
         const props39 = {}
         props39['image'] = component.image
@@ -1003,44 +863,41 @@ export default () =>
         props39['map'] = component.sprite
         props39['frame'] = component.maxFps[1]
 
-        if (!elms[39]) {
-          const componentType = props39['is'] || 'Sprite'
-
-          let component39
-          if (typeof componentType === 'string') {
-            component39 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component39) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component39 = componentType
+        componentType = props39['is'] || 'Sprite'
+
+        let component39
+        if (typeof componentType === 'string') {
+          component39 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component39) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component39 = componentType
+        }
 
-          elms[39] = component39.call(null, { props: props39 }, elms[38], component)
+        elms[39] = component39.call(null, { props: props39 }, elms[38], component)
 
-          if (elms[39][Symbol.for('slots')][0]) {
-            parent = elms[39][Symbol.for('slots')][0]
-            component = elms[39]
-          } else {
-            parent = elms[39][Symbol.for('children')][0]
-          }
+        if (elms[39][Symbol.for('slots')][0]) {
+          parent = elms[39][Symbol.for('slots')][0]
+          component = elms[39]
+        } else {
+          parent = elms[39][Symbol.for('children')][0]
         }
 
         const cmp40 = (context.components && context.components['Sprite']) || components['Sprite']
 
         parent = elms[35]
-
-        if (!elms[40]) {
-          elms[40] = this.element({ parent: parent || 'root' }, component)
-        }
         const elementConfig40 = {}
 
+        elms[40] = this.element({ parent: parent || 'root' }, component)
+
         elementConfig40['image'] = component.image
         elementConfig40['x'] = 36
         elementConfig40['h'] = 20
         elementConfig40['w'] = 20
         elementConfig40['map'] = component.sprite
+        elementConfig40['frame'] = component.maxFps[2]
 
         if (typeof cmp40 !== 'undefined') {
           for (let key in cmp40.config.props) {
@@ -1048,10 +905,7 @@ export default () =>
           }
         }
 
-        if (!elms[40].nodeId) {
-          elms[40].populate(elementConfig40)
-        }
-
+        elms[40].populate(elementConfig40)
         parent = elms[40]
         const props41 = {}
         props41['image'] = component.image
@@ -1061,103 +915,101 @@ export default () =>
         props41['map'] = component.sprite
         props41['frame'] = component.maxFps[2]
 
-        if (!elms[41]) {
-          const componentType = props41['is'] || 'Sprite'
-
-          let component41
-          if (typeof componentType === 'string') {
-            component41 =
-              (context.components && context.components[componentType]) || components[componentType]
-            if (!component41) {
-              throw new Error('Component "Sprite" not found')
-            }
-          } else if (typeof componentType === 'function' && componentType.name === 'factory') {
-            component41 = componentType
+        componentType = props41['is'] || 'Sprite'
+
+        let component41
+        if (typeof componentType === 'string') {
+          component41 =
+            (context.components && context.components[componentType]) || components[componentType]
+          if (!component41) {
+            throw new Error('Component "Sprite" not found')
           }
+        } else if (typeof componentType === 'function' && componentType.name === 'factory') {
+          component41 = componentType
+        }
 
-          elms[41] = component41.call(null, { props: props41 }, elms[40], component)
+        elms[41] = component41.call(null, { props: props41 }, elms[40], component)
 
-          if (elms[41][Symbol.for('slots')][0]) {
-            parent = elms[41][Symbol.for('slots')][0]
-            component = elms[41]
-          } else {
-            parent = elms[41][Symbol.for('children')][0]
-          }
+        if (elms[41][Symbol.for('slots')][0]) {
+          parent = elms[41][Symbol.for('slots')][0]
+          component = elms[41]
+        } else {
+          parent = elms[41][Symbol.for('children')][0]
         }
 
         return elms
       },
       effects: [
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[6].set('frame', component.fps[0])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[7][Symbol.for('props')]['frame'] = component.fps[0]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[8].set('frame', component.fps[1])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[9][Symbol.for('props')]['frame'] = component.fps[1]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[10].set('frame', component.fps[2])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[11][Symbol.for('props')]['frame'] = component.fps[2]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[16].set('frame', component.avgFps[0])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[17][Symbol.for('props')]['frame'] = component.avgFps[0]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[18].set('frame', component.avgFps[1])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[19][Symbol.for('props')]['frame'] = component.avgFps[1]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[20].set('frame', component.avgFps[2])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[21][Symbol.for('props')]['frame'] = component.avgFps[2]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[26].set('frame', component.minFps[0])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[27][Symbol.for('props')]['frame'] = component.minFps[0]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[28].set('frame', component.minFps[1])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[29][Symbol.for('props')]['frame'] = component.minFps[1]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[30].set('frame', component.minFps[2])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[31][Symbol.for('props')]['frame'] = component.minFps[2]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[36].set('frame', component.maxFps[0])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[37][Symbol.for('props')]['frame'] = component.maxFps[0]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[38].set('frame', component.maxFps[1])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[39][Symbol.for('props')]['frame'] = component.maxFps[1]
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[40].set('frame', component.maxFps[2])
         },
-        function anonymous(component, elms, context, components) {
+        function anonymous(component, elms, context, components, rootComponent, effect) {
           elms[41][Symbol.for('props')]['frame'] = component.maxFps[2]
         },
       ],