@lightningjs/renderer 3.0.0-beta18 → 3.0.0-beta19

package/dist/src/core/CoreNode.js

@@ -24,6 +24,7 @@ import { Matrix3d } from './lib/Matrix3d.js';
 import { RenderCoords } from './lib/RenderCoords.js';
 import { CoreAnimation } from './animations/CoreAnimation.js';
 import { CoreAnimationController } from './animations/CoreAnimationController.js';
+import { bucketSortByZIndex, incrementalRepositionByZIndex, removeChild, } from './lib/collectionUtils.js';
 export var CoreNodeRenderState;
 (function (CoreNodeRenderState) {
     CoreNodeRenderState[CoreNodeRenderState["Init"] = 0] = "Init";
@@ -31,6 +32,13 @@ export var CoreNodeRenderState;
     CoreNodeRenderState[CoreNodeRenderState["InBounds"] = 4] = "InBounds";
     CoreNodeRenderState[CoreNodeRenderState["InViewport"] = 8] = "InViewport";
 })(CoreNodeRenderState || (CoreNodeRenderState = {}));
+const NO_CLIPPING_RECT = {
+    x: 0,
+    y: 0,
+    width: 0,
+    height: 0,
+    valid: false,
+};
 const CoreNodeRenderStateMap = new Map();
 CoreNodeRenderStateMap.set(CoreNodeRenderState.Init, 'init');
 CoreNodeRenderStateMap.set(CoreNodeRenderState.OutOfBounds, 'outOfBounds');
@@ -69,21 +77,13 @@ export var UpdateType;
      */
     UpdateType[UpdateType["Clipping"] = 8] = "Clipping";
     /**
-     * Calculated ZIndex update
-     *
-     * @remarks
-     * CoreNode Properties Updated:
-     * - `calcZIndex`
-     */
-    UpdateType[UpdateType["CalculatedZIndex"] = 16] = "CalculatedZIndex";
-    /**
-     * Z-Index Sorted Children update
+     * Sort Z-Index Children update
      *
      * @remarks
      * CoreNode Properties Updated:
      * - `children` (sorts children by their `calcZIndex`)
      */
-    UpdateType[UpdateType["ZIndexSortedChildren"] = 32] = "ZIndexSortedChildren";
+    UpdateType[UpdateType["SortZIndexChildren"] = 16] = "SortZIndexChildren";
     /**
      * Premultiplied Colors update
      *
@@ -94,7 +94,7 @@ export var UpdateType;
      * - `premultipliedColorBl`
      * - `premultipliedColorBr`
      */
-    UpdateType[UpdateType["PremultipliedColors"] = 64] = "PremultipliedColors";
+    UpdateType[UpdateType["PremultipliedColors"] = 32] = "PremultipliedColors";
     /**
      * World Alpha update
      *
@@ -102,7 +102,7 @@ export var UpdateType;
      * CoreNode Properties Updated:
      * - `worldAlpha` = `parent.worldAlpha` * `alpha`
      */
-    UpdateType[UpdateType["WorldAlpha"] = 128] = "WorldAlpha";
+    UpdateType[UpdateType["WorldAlpha"] = 64] = "WorldAlpha";
     /**
      * Render State update
      *
@@ -110,7 +110,7 @@ export var UpdateType;
      * CoreNode Properties Updated:
      * - `renderState`
      */
-    UpdateType[UpdateType["RenderState"] = 256] = "RenderState";
+    UpdateType[UpdateType["RenderState"] = 128] = "RenderState";
     /**
      * Is Renderable update
      *
@@ -118,23 +118,23 @@ export var UpdateType;
      * CoreNode Properties Updated:
      * - `isRenderable`
      */
-    UpdateType[UpdateType["IsRenderable"] = 512] = "IsRenderable";
+    UpdateType[UpdateType["IsRenderable"] = 256] = "IsRenderable";
     /**
      * Render Texture update
      */
-    UpdateType[UpdateType["RenderTexture"] = 1024] = "RenderTexture";
+    UpdateType[UpdateType["RenderTexture"] = 512] = "RenderTexture";
     /**
      * Track if parent has render texture
      */
-    UpdateType[UpdateType["ParentRenderTexture"] = 2048] = "ParentRenderTexture";
+    UpdateType[UpdateType["ParentRenderTexture"] = 1024] = "ParentRenderTexture";
     /**
      * Render Bounds update
      */
-    UpdateType[UpdateType["RenderBounds"] = 4096] = "RenderBounds";
+    UpdateType[UpdateType["RenderBounds"] = 2048] = "RenderBounds";
     /**
      * RecalcUniforms
      */
-    UpdateType[UpdateType["RecalcUniforms"] = 8192] = "RecalcUniforms";
+    UpdateType[UpdateType["RecalcUniforms"] = 4096] = "RecalcUniforms";
     /**
      * None
      */
@@ -142,7 +142,7 @@ export var UpdateType;
     /**
      * All
      */
-    UpdateType[UpdateType["All"] = 14335] = "All";
+    UpdateType[UpdateType["All"] = 7167] = "All";
 })(UpdateType || (UpdateType = {}));
 /**
  * A visual Node in the Renderer scene graph.
@@ -158,7 +158,12 @@ export class CoreNode extends EventEmitter {
     _id = getNewId();
     props;
     hasShaderUpdater = false;
+    hasShaderTimeFn = false;
     hasColorProps = false;
+    zIndexMin = 0;
+    zIndexMax = 0;
+    previousZIndex = -1;
+    zIndexSortList = [];
     updateType = UpdateType.All;
     childUpdateType = UpdateType.None;
     globalTransform;
@@ -177,7 +182,6 @@ export class CoreNode extends EventEmitter {
         valid: false,
     };
     textureCoords;
-    updateTextureCoords = false;
     updateShaderUniforms = false;
     isRenderable = false;
     renderState = CoreNodeRenderState.Init;
@@ -226,7 +230,6 @@ export class CoreNode extends EventEmitter {
         p.mount = props.mount;
         p.pivot = props.pivot;
         p.zIndex = props.zIndex;
-        p.zIndexLocked = props.zIndexLocked;
         p.textureOptions = props.textureOptions;
         p.data = props.data;
         p.imageType = props.imageType;
@@ -234,14 +237,20 @@ export class CoreNode extends EventEmitter {
         p.srcY = props.srcY;
         p.srcWidth = props.srcWidth;
         p.srcHeight = props.srcHeight;
-        p.parent = null;
+        p.parent = props.parent;
         p.texture = null;
         p.shader = null;
         p.src = null;
         p.rtt = false;
         p.boundsMargin = null;
+        // Only set non-default values
+        if (props.zIndex !== 0) {
+            this.zIndex = props.zIndex;
+        }
+        if (props.parent !== null) {
+            props.parent.addChild(this);
+        }
         // Assign props to instances
-        this.parent = props.parent;
         this.texture = props.texture;
         this.shader = props.shader;
         this.src = props.src;
@@ -258,43 +267,49 @@ export class CoreNode extends EventEmitter {
     }
     //#region Textures
     loadTexture() {
-        const { texture } = this.props;
-        if (!texture) {
+        if (this.props.texture === null) {
             return;
         }
         // If texture is already loaded / failed, trigger loaded event manually
         // so that users get a consistent event experience.
         // We do this in a microtask to allow listeners to be attached in the same
         // synchronous task after calling loadTexture()
-        queueMicrotask(() => {
-            if (this.textureOptions.preload === true) {
-                this.stage.txManager.loadTexture(texture);
-            }
-            texture.preventCleanup =
-                this.props.textureOptions?.preventCleanup ?? false;
-            texture.on('loaded', this.onTextureLoaded);
-            texture.on('failed', this.onTextureFailed);
-            texture.on('freed', this.onTextureFreed);
-            // If the parent is a render texture, the initial texture status
-            // will be set to freed until the texture is processed by the
-            // Render RTT nodes. So we only need to listen fo changes and
-            // no need to check the texture.state until we restructure how
-            // textures are being processed.
-            if (this.parentHasRenderTexture) {
-                this.notifyParentRTTOfUpdate();
-                return;
-            }
-            if (texture.state === 'loaded') {
-                this.onTextureLoaded(texture, texture.dimensions);
-            }
-            else if (texture.state === 'failed') {
-                this.onTextureFailed(texture, texture.error);
-            }
-            else if (texture.state === 'freed') {
-                this.onTextureFreed(texture);
-            }
-        });
+        queueMicrotask(this.loadTextureTask);
     }
+    /**
+     * Task for queueMicrotask to loadTexture
+     *
+     * @remarks
+     * This method is called in a microtask to release the texture.
+     */
+    loadTextureTask = () => {
+        const texture = this.texture;
+        if (this.textureOptions.preload === true) {
+            this.stage.txManager.loadTexture(texture);
+        }
+        texture.preventCleanup = this.props.textureOptions?.preventCleanup ?? false;
+        texture.on('loaded', this.onTextureLoaded);
+        texture.on('failed', this.onTextureFailed);
+        texture.on('freed', this.onTextureFreed);
+        // If the parent is a render texture, the initial texture status
+        // will be set to freed until the texture is processed by the
+        // Render RTT nodes. So we only need to listen fo changes and
+        // no need to check the texture.state until we restructure how
+        // textures are being processed.
+        if (this.parentHasRenderTexture) {
+            this.notifyParentRTTOfUpdate();
+            return;
+        }
+        if (texture.state === 'loaded') {
+            this.onTextureLoaded(texture, texture.dimensions);
+        }
+        else if (texture.state === 'failed') {
+            this.onTextureFailed(texture, texture.error);
+        }
+        else if (texture.state === 'freed') {
+            this.onTextureFreed(texture);
+        }
+    };
     unloadTexture() {
         if (this.texture === null) {
             return;
@@ -303,7 +318,7 @@ export class CoreNode extends EventEmitter {
         texture.off('loaded', this.onTextureLoaded);
         texture.off('failed', this.onTextureFailed);
         texture.off('freed', this.onTextureFreed);
-        texture.setRenderableOwner(this, false);
+        texture.setRenderableOwner(this._id, false);
     }
     onTextureLoaded = (_, dimensions) => {
         if (this.autosize === true) {
@@ -325,6 +340,10 @@ export class CoreNode extends EventEmitter {
                 dimensions,
             });
         }
+        if (this.stage.calculateTextureCoord === true &&
+            this.props.textureOptions !== null) {
+            this.textureCoords = this.stage.renderer.getTextureCoords(this);
+        }
         // Trigger a local update if the texture is loaded and the resizeMode is 'contain'
         if (this.props.textureOptions?.resizeMode?.type === 'contain') {
             this.setUpdateType(UpdateType.Local);
@@ -334,20 +353,25 @@ export class CoreNode extends EventEmitter {
         // immediately set isRenderable to false, so that we handle the error
         // without waiting for the next frame loop
         this.isRenderable = false;
+        this.updateTextureOwnership(false);
         this.setUpdateType(UpdateType.IsRenderable);
         // If parent has a render texture, flag that we need to update
         if (this.parentHasRenderTexture) {
             this.notifyParentRTTOfUpdate();
         }
-        this.emit('failed', {
-            type: 'texture',
-            error,
-        });
+        if (this.texture !== null &&
+            this.texture.retryCount > this.texture.maxRetryCount) {
+            this.emit('failed', {
+                type: 'texture',
+                error,
+            });
+        }
     };
     onTextureFreed = () => {
         // immediately set isRenderable to false, so that we handle the error
         // without waiting for the next frame loop
         this.isRenderable = false;
+        this.updateTextureOwnership(false);
         this.setUpdateType(UpdateType.IsRenderable);
         // If parent has a render texture, flag that we need to update
         if (this.parentHasRenderTexture) {
@@ -373,9 +397,6 @@ export class CoreNode extends EventEmitter {
             return;
         parent.setUpdateType(UpdateType.Children);
     }
-    sortChildren() {
-        this.children.sort((a, b) => a.calcZIndex - b.calcZIndex);
-    }
     updateLocalTransform() {
         const p = this.props;
         const { x, y, w, h } = p;
@@ -433,9 +454,6 @@ export class CoreNode extends EventEmitter {
      * @param delta
      */
     update(delta, parentClippingRect) {
-        if (this.updateType === UpdateType.None) {
-            return;
-        }
         const props = this.props;
         const parent = props.parent;
         const parentHasRenderTexture = this.parentHasRenderTexture;
@@ -444,6 +462,9 @@ export class CoreNode extends EventEmitter {
         let updateType = this.updateType;
         let childUpdateType = this.childUpdateType;
         let updateParent = false;
+        // reset update type
+        this.updateType = 0;
+        this.childUpdateType = 0;
         if (updateType & UpdateType.Local) {
             this.updateLocalTransform();
             updateType |= UpdateType.Global;
@@ -549,14 +570,9 @@ export class CoreNode extends EventEmitter {
         if (updateParent === true) {
             parent.setUpdateType(UpdateType.Children);
         }
-        // No need to update zIndex if there is no parent
-        if (updateType & UpdateType.CalculatedZIndex && parent !== null) {
-            this.calculateZIndex();
-            // Tell parent to re-sort children
-            parent.setUpdateType(UpdateType.ZIndexSortedChildren);
-        }
         if (this.renderState === CoreNodeRenderState.OutOfBounds) {
             updateType &= ~UpdateType.RenderBounds; // remove render bounds update
+            this.updateType = updateType;
             return;
         }
         if (updateType & UpdateType.RecalcUniforms &&
@@ -569,22 +585,18 @@ export class CoreNode extends EventEmitter {
             this.shader.update();
         }
         if (updateType & UpdateType.Children && this.children.length > 0) {
+            let childClippingRect = this.clippingRect;
+            if (this.rtt === true) {
+                childClippingRect = NO_CLIPPING_RECT;
+            }
             for (let i = 0, length = this.children.length; i < length; i++) {
                 const child = this.children[i];
-                child.setUpdateType(childUpdateType);
+                if (childUpdateType !== 0) {
+                    child.setUpdateType(childUpdateType);
+                }
                 if (child.updateType === 0) {
                     continue;
                 }
-                let childClippingRect = this.clippingRect;
-                if (this.rtt === true) {
-                    childClippingRect = {
-                        x: 0,
-                        y: 0,
-                        width: 0,
-                        height: 0,
-                        valid: false,
-                    };
-                }
                 child.update(delta, childClippingRect);
             }
         }
@@ -594,16 +606,11 @@ export class CoreNode extends EventEmitter {
         if (parentHasRenderTexture === true) {
             this.notifyParentRTTOfUpdate();
         }
-        // Sorting children MUST happen after children have been updated so
-        // that they have the oppotunity to update their calculated zIndex.
-        if (updateType & UpdateType.ZIndexSortedChildren) {
+        //Resort children if needed
+        if (updateType & UpdateType.SortZIndexChildren) {
             // reorder z-index
             this.sortChildren();
         }
-        if (this.updateTextureCoords === true) {
-            this.updateTextureCoords = false;
-            this.textureCoords = this.stage.renderer.getTextureCoords(this);
-        }
         // If we're out of bounds, apply the render state now
         // this is done so nodes can finish their entire update loop before
         // being marked as out of bounds
@@ -617,9 +624,6 @@ export class CoreNode extends EventEmitter {
                 this.notifyChildrenRTTOfUpdate(renderState);
             }
         }
-        // reset update type
-        this.updateType = 0;
-        this.childUpdateType = 0;
     }
     findParentRTTNode() {
         let rttNode = this.parent;
@@ -730,6 +734,17 @@ export class CoreNode extends EventEmitter {
             current: renderState,
         });
     }
+    /**
+     * Checks if the node is renderable based on world alpha, dimensions and out of bounds status.
+     */
+    checkBasicRenderability() {
+        if (this.worldAlpha === 0 || this.isOutOfBounds() === true) {
+            return false;
+        }
+        else {
+            return true;
+        }
+    }
     /**
      * Updates the `isRenderable` property based on various conditions.
      */
@@ -737,13 +752,20 @@ export class CoreNode extends EventEmitter {
         let newIsRenderable = false;
         let needsTextureOwnership = false;
         // If the node is out of bounds or has an alpha of 0, it is not renderable
-        if (this.worldAlpha === 0 ||
-            this.renderState <= CoreNodeRenderState.OutOfBounds) {
+        if (this.checkBasicRenderability() === false) {
             this.updateTextureOwnership(false);
             this.setRenderable(false);
             return;
         }
         if (this.texture !== null) {
+            // preemptive check for failed textures this will mark the current node as non-renderable
+            // and will prevent further checks until the texture is reloaded or retry is reset on the texture
+            if (this.texture.retryCount > this.texture.maxRetryCount) {
+                // texture has failed to load, we cannot render
+                this.updateTextureOwnership(false);
+                this.setRenderable(false);
+                return;
+            }
             needsTextureOwnership = true;
             // we're only renderable if the texture state is loaded
             newIsRenderable = this.texture.state === 'loaded';
@@ -752,7 +774,7 @@ export class CoreNode extends EventEmitter {
         // check shader
         (this.props.shader !== null || this.hasColorProps === true) &&
             // check dimensions
-            (this.props.w !== 0 && this.props.h !== 0) === true) {
+            this.hasDimensions() === true) {
             // This mean we have dimensions and a color set, so we can render a ColorTexture
             if (this.stage.defaultTexture &&
                 this.stage.defaultTexture.state === 'loaded') {
@@ -776,17 +798,24 @@ export class CoreNode extends EventEmitter {
                 isRenderable,
             });
         }
-        if (isRenderable === true &&
-            this.stage.calculateTextureCoord === true &&
-            this.textureCoords === undefined) {
-            this.updateTextureCoords = true;
-        }
     }
     /**
      * Changes the renderable state of the node.
      */
     updateTextureOwnership(isRenderable) {
-        this.texture?.setRenderableOwner(this, isRenderable);
+        this.texture?.setRenderableOwner(this._id, isRenderable);
+    }
+    /**
+     * Checks if the node is out of the viewport bounds.
+     */
+    isOutOfBounds() {
+        return this.renderState <= CoreNodeRenderState.OutOfBounds;
+    }
+    /**
+     * Checks if the node has dimensions (width/height)
+     */
+    hasDimensions() {
+        return this.props.w !== 0 && this.props.h !== 0;
     }
     calculateRenderCoords() {
         const { w, h } = this.props;
@@ -881,16 +910,6 @@ export class CoreNode extends EventEmitter {
             clippingRect.valid = true;
         }
     }
-    calculateZIndex() {
-        const props = this.props;
-        const z = props.zIndex || 0;
-        const p = props.parent?.zIndex || 0;
-        let zIndex = z;
-        if (props.parent?.zIndexLocked) {
-            zIndex = z < p ? z : p;
-        }
-        this.calcZIndex = zIndex;
-    }
     /**
      * Destroy the node and cleanup all resources
      */
@@ -902,21 +921,23 @@ export class CoreNode extends EventEmitter {
         this.destroyed = true;
         this.unloadTexture();
         this.isRenderable = false;
+        if (this.hasShaderTimeFn === true) {
+            this.stage.untrackTimedNode(this);
+        }
         // Kill children
         while (this.children.length > 0) {
             this.children[0].destroy();
         }
         const parent = this.parent;
         if (parent !== null) {
-            const index = parent.children.indexOf(this);
-            parent.children.splice(index, 1);
-            parent.setUpdateType(UpdateType.Children | UpdateType.ZIndexSortedChildren);
+            parent.removeChild(this);
         }
         this.props.parent = null;
         this.props.texture = null;
         if (this.rtt === true) {
             this.stage.renderer.removeRTTNode(this);
         }
+        this.stage.requestRender();
     }
     renderQuads(renderer) {
         if (this.parentHasRenderTexture === true) {
@@ -928,6 +949,7 @@ export class CoreNode extends EventEmitter {
         const t = this.globalTransform;
         const coords = this.renderCoords;
         const texture = p.texture || this.stage.defaultTexture;
+        const textureCoords = this.textureCoords || this.stage.renderer.defaultTextureCoords;
         // There is a race condition where the texture can be null
         // with RTT nodes. Adding this defensively to avoid errors.
         if (texture && texture.state !== 'loaded') {
@@ -942,7 +964,7 @@ export class CoreNode extends EventEmitter {
             colorBr: this.premultipliedColorBr,
             texture,
             textureOptions: p.textureOptions,
-            textureCoords: this.textureCoords,
+            textureCoords: textureCoords,
             shader: p.shader,
             alpha: this.worldAlpha,
             clippingRect: this.clippingRect,
@@ -959,8 +981,85 @@ export class CoreNode extends EventEmitter {
             framebufferDimensions: this.parentHasRenderTexture
                 ? this.parentFramebufferDimensions
                 : null,
+            time: this.hasShaderTimeFn === true ? this.getTimerValue() : null,
         });
     }
+    getTimerValue() {
+        if (typeof this.shader.time === 'function') {
+            return this.shader.time(this.stage);
+        }
+        return this.stage.elapsedTime;
+    }
+    sortChildren() {
+        const changedCount = this.zIndexSortList.length;
+        if (changedCount === 0) {
+            return;
+        }
+        const children = this.children;
+        let min = Infinity;
+        let max = -Infinity;
+        // find min and max zIndex
+        for (let i = 0; i < children.length; i++) {
+            const zIndex = children[i].props.zIndex;
+            if (zIndex < min) {
+                min = zIndex;
+            }
+            if (zIndex > max) {
+                max = zIndex;
+            }
+        }
+        // update min and max zIndex
+        this.zIndexMin = min;
+        this.zIndexMax = max;
+        // if min and max are the same, no need to sort
+        if (min === max) {
+            return;
+        }
+        const n = children.length;
+        // decide whether to use incremental sort or bucket sort
+        const useIncremental = changedCount <= 2 || changedCount < n * 0.05;
+        // when changed count is less than 2 or 5% of total children, use incremental sort
+        if (useIncremental === true) {
+            incrementalRepositionByZIndex(this.zIndexSortList, children);
+        }
+        else {
+            bucketSortByZIndex(children, min);
+        }
+        this.zIndexSortList.length = 0;
+        this.zIndexSortList = [];
+    }
+    removeChild(node, targetParent = null) {
+        if (targetParent === null &&
+            this.props.rtt === true &&
+            this.parentHasRenderTexture === true) {
+            node.clearRTTInheritance();
+        }
+        removeChild(node, this.children);
+    }
+    addChild(node, previousParent = null) {
+        const inRttCluster = this.props.rtt === true || this.parentHasRenderTexture === true;
+        const children = this.children;
+        const min = this.zIndexMin;
+        const max = this.zIndexMax;
+        const zIndex = node.zIndex;
+        node.parentHasRenderTexture = inRttCluster;
+        if (previousParent !== null) {
+            const previousParentInRttCluster = previousParent.props.rtt === true ||
+                previousParent.parentHasRenderTexture === true;
+            if (inRttCluster === false && previousParentInRttCluster === true) {
+                // update child RTT status
+                node.clearRTTInheritance();
+            }
+        }
+        if (inRttCluster === true) {
+            node.markChildrenWithRTT(this);
+        }
+        children.push(node);
+        if (min !== max || (zIndex !== min && zIndex !== max)) {
+            this.zIndexSortList.push(node);
+            this.setUpdateType(UpdateType.SortZIndexChildren);
+        }
+    }
     //#region Properties
     get id() {
         return this._id;
@@ -1004,7 +1103,6 @@ export class CoreNode extends EventEmitter {
     }
     set w(value) {
         if (this.props.w !== value) {
-            this.updateTextureCoords = true;
             this.props.w = value;
             this.setUpdateType(UpdateType.Local);
             if (this.props.rtt === true) {
@@ -1019,7 +1117,6 @@ export class CoreNode extends EventEmitter {
     }
     set h(value) {
         if (this.props.h !== value) {
-            this.updateTextureCoords = true;
             this.props.h = value;
             this.setUpdateType(UpdateType.Local);
             if (this.props.rtt === true) {
@@ -1279,29 +1376,35 @@ export class CoreNode extends EventEmitter {
         this.hasColorProps = value > 0;
         this.setUpdateType(UpdateType.PremultipliedColors);
     }
-    // we're only interested in parent zIndex to test
-    // if we should use node zIndex is higher then parent zIndex
-    get zIndexLocked() {
-        return this.props.zIndexLocked || 0;
-    }
-    set zIndexLocked(value) {
-        this.props.zIndexLocked = value;
-        this.setUpdateType(UpdateType.CalculatedZIndex | UpdateType.Children);
-        for (let i = 0, length = this.children.length; i < length; i++) {
-            this.children[i].setUpdateType(UpdateType.CalculatedZIndex);
-        }
-    }
     get zIndex() {
         return this.props.zIndex;
     }
     set zIndex(value) {
-        if (this.props.zIndex === value) {
+        let sanitizedValue = value;
+        if (isNaN(sanitizedValue) || Number.isFinite(sanitizedValue) === false) {
+            console.warn(`zIndex was set to an invalid value: ${value}, defaulting to 0`);
+            sanitizedValue = 0;
+        }
+        //Clamp to safe integer range
+        if (sanitizedValue > Number.MAX_SAFE_INTEGER) {
+            sanitizedValue = 1000;
+        }
+        else if (sanitizedValue < Number.MIN_SAFE_INTEGER) {
+            sanitizedValue = -1000;
+        }
+        if (this.props.zIndex === sanitizedValue) {
             return;
         }
-        this.props.zIndex = value;
-        this.setUpdateType(UpdateType.CalculatedZIndex | UpdateType.Children);
-        for (let i = 0, length = this.children.length; i < length; i++) {
-            this.children[i].setUpdateType(UpdateType.CalculatedZIndex);
+        this.previousZIndex = this.props.zIndex;
+        this.props.zIndex = sanitizedValue;
+        const parent = this.parent;
+        if (parent !== null) {
+            const min = parent.zIndexMin;
+            const max = parent.zIndexMax;
+            if (min !== max || sanitizedValue < min || sanitizedValue > max) {
+                parent.zIndexSortList.push(this);
+                parent.setUpdateType(UpdateType.SortZIndexChildren);
+            }
         }
     }
     get parent() {
@@ -1314,23 +1417,13 @@ export class CoreNode extends EventEmitter {
         }
         this.props.parent = newParent;
         if (oldParent) {
-            const index = oldParent.children.indexOf(this);
-            oldParent.children.splice(index, 1);
-            oldParent.setUpdateType(UpdateType.Children | UpdateType.ZIndexSortedChildren);
-        }
-        if (newParent) {
-            newParent.children.push(this);
-            // Since this node has a new parent, to be safe, have it do a full update.
-            this.setUpdateType(UpdateType.All);
-            // Tell parent that it's children need to be updated and sorted.
-            newParent.setUpdateType(UpdateType.Children | UpdateType.ZIndexSortedChildren);
-            // If the new parent has an RTT enabled, apply RTT inheritance
-            if (newParent.rtt || newParent.parentHasRenderTexture) {
-                this.applyRTTInheritance(newParent);
-            }
+            oldParent.removeChild(this, newParent);
         }
-        // fetch render bounds from parent
-        this.setUpdateType(UpdateType.RenderBounds | UpdateType.Children);
+        if (newParent !== null) {
+            newParent.addChild(this, oldParent);
+        }
+        //since this node has a new parent, recalc global and render bounds
+        this.setUpdateType(UpdateType.Global | UpdateType.RenderBounds);
     }
     get rtt() {
         return this.props.rtt;
@@ -1414,8 +1507,15 @@ export class CoreNode extends EventEmitter {
         }
         if (shader.shaderKey !== 'default') {
             this.hasShaderUpdater = shader.update !== undefined;
+            this.hasShaderTimeFn = shader.time !== undefined;
             shader.attachNode(this);
         }
+        if (this.hasShaderTimeFn === true) {
+            this.stage.trackTimedNode(this);
+        }
+        else {
+            this.stage.untrackTimedNode(this);
+        }
         this.props.shader = shader;
         this.setUpdateType(UpdateType.IsRenderable | UpdateType.RecalcUniforms);
     }
@@ -1512,13 +1612,16 @@ export class CoreNode extends EventEmitter {
         this.textureCoords = undefined;
         this.props.texture = value;
         if (value !== null) {
-            value.setRenderableOwner(this, this.isRenderable);
+            value.setRenderableOwner(this._id, this.isRenderable);
             this.loadTexture();
         }
         this.setUpdateType(UpdateType.IsRenderable);
     }
     set textureOptions(value) {
         this.props.textureOptions = value;
+        if (this.stage.calculateTextureCoord === true && value !== null) {
+            this.textureCoords = this.stage.renderer.getTextureCoords(this);
+        }
     }
     get textureOptions() {
         return this.props.textureOptions;