Nightly

dist/preview release/babylon.max.js

@@ -14894,7 +14894,7 @@ var BABYLON;
                 if (this._renderingCanvas) {
                     this._renderingCanvas.removeEventListener("focus", this._onCanvasFocus);
                     this._renderingCanvas.removeEventListener("blur", this._onCanvasBlur);
-                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasBlur);
+                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasPointerOut);
                     if (!this._doNotHandleContextLost) {
                         this._renderingCanvas.removeEventListener("webglcontextlost", this._onContextLost);
                         this._renderingCanvas.removeEventListener("webglcontextrestored", this._onContextRestored);
@@ -14930,6 +14930,7 @@ var BABYLON;
             this._currentBufferPointers = [];
             this._renderingCanvas = null;
             this._currentProgram = null;
+            this._bindedRenderFunction = null;
             this.onResizeObservable.clear();
             this.onCanvasBlurObservable.clear();
             this.onCanvasFocusObservable.clear();
@@ -18535,6 +18536,9 @@ var BABYLON;
             var _this = this;
             if (disposeMaterialAndTextures === void 0) { disposeMaterialAndTextures = false; }
             var index;
+            // Smart Array Retainers.
+            this.getScene().freeActiveMeshes();
+            this.getScene().freeRenderingGroups();
             // Action manager
             if (this.actionManager !== undefined && this.actionManager !== null) {
                 this.actionManager.dispose();
@@ -20809,13 +20813,19 @@ var BABYLON;
             }
         };
         RenderingManager.prototype.dispose = function () {
+            this.freeRenderingGroups();
+            this._renderingGroups.length = 0;
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        RenderingManager.prototype.freeRenderingGroups = function () {
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.dispose();
                 }
             }
-            this._renderingGroups.length = 0;
         };
         RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (this._renderingGroups[renderingGroupId] === undefined) {
@@ -24009,6 +24019,45 @@ var BABYLON;
                 }
             }
         };
+        /**
+         * Clear the processed materials smart array preventing retention point in material dispose.
+         */
+        Scene.prototype.freeProcessedMaterials = function () {
+            this._processedMaterials.dispose();
+        };
+        /**
+         * Clear the active meshes smart array preventing retention point in mesh dispose.
+         */
+        Scene.prototype.freeActiveMeshes = function () {
+            this._activeMeshes.dispose();
+            if (this.activeCamera && this.activeCamera._activeMeshes) {
+                this.activeCamera._activeMeshes.dispose();
+            }
+            if (this.activeCameras) {
+                for (var i = 0; i < this.activeCameras.length; i++) {
+                    var activeCamera = this.activeCameras[i];
+                    if (activeCamera && activeCamera._activeMeshes) {
+                        activeCamera._activeMeshes.dispose();
+                    }
+                }
+            }
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        Scene.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+            if (this.textures) {
+                for (var i = 0; i < this.textures.length; i++) {
+                    var texture = this.textures[i];
+                    if (texture && texture.isRenderTarget) {
+                        texture.freeRenderingGroups();
+                    }
+                }
+            }
+        };
         Scene.prototype._isInIntermediateRendering = function () {
             return this._intermediateRendering;
         };
@@ -31810,6 +31859,7 @@ var BABYLON;
         Material.prototype.dispose = function (forceDisposeEffect, forceDisposeTextures) {
             // Animations
             this.getScene().stopAnimation(this);
+            this.getScene().freeProcessedMaterials();
             // Remove from scene
             var index = this._scene.materials.indexOf(this);
             if (index >= 0) {
@@ -59002,6 +59052,14 @@ var BABYLON;
                 this._postProcessManager._rebuild();
             }
         };
+        /**
+         * Clear the info related to rendering groups preventing retention point in material dispose.
+         */
+        RenderTargetTexture.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+        };
         RenderTargetTexture._REFRESHRATE_RENDER_ONCE = 0;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYFRAME = 1;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYTWOFRAMES = 2;
@@ -60342,10 +60400,11 @@ var BABYLON;
 (function (BABYLON) {
     var PassPostProcess = /** @class */ (function (_super) {
         __extends(PassPostProcess, _super);
-        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (camera === void 0) { camera = null; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType, undefined, null, blockCompilation) || this;
         }
         return PassPostProcess;
     }(BABYLON.PostProcess));
@@ -68974,10 +69033,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType) {
+        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * The amount of seperation of rgb channels (default: 0)
              */
@@ -69029,10 +69090,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * How much of the original color should be applied. Setting this to 0 will display edge detection. (default: 1)
              */
@@ -69074,13 +69137,16 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines) {
+        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines, blockCompilation) {
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
             if (defines === void 0) { defines = ""; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, name, "kernelBlur", ["delta", "direction", "cameraMinMaxZ"], ["circleOfConfusionSampler"], options, camera, samplingMode, engine, reusable, null, textureType, "kernelBlur", { varyingCount: 0, depCount: 0 }, true) || this;
             _this.direction = direction;
+            _this.blockCompilation = blockCompilation;
             _this._packedFloat = false;
             _this._staticDefines = "";
             _this._staticDefines = defines;
@@ -69107,7 +69173,9 @@ var BABYLON;
                 v = Math.max(v, 1);
                 this._idealKernel = v;
                 this._kernel = this._nearestBestKernel(v);
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
@@ -69127,12 +69195,29 @@ var BABYLON;
                     return;
                 }
                 this._packedFloat = v;
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
         });
-        BlurPostProcess.prototype._updateParameters = function () {
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        BlurPostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            this._updateParameters(onCompiled, onError);
+        };
+        BlurPostProcess.prototype._updateParameters = function (onCompiled, onError) {
             // Generate sampling offsets and weights
             var N = this._kernel;
             var centerIndex = (N - 1) / 2;
@@ -69202,10 +69287,10 @@ var BABYLON;
             if (this.packedFloat) {
                 defines += "#define PACKEDFLOAT 1";
             }
-            this.updateEffect(defines, null, null, {
+            _super.prototype.updateEffect.call(this, defines, null, null, {
                 varyingCount: varyingCount,
                 depCount: depCount
-            });
+            }, onCompiled, onError);
         };
         /**
          * Best kernels are odd numbers that when divided by 2, their integer part is even, so 5, 9 or 13.
@@ -69286,12 +69371,14 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (imageToBlur === void 0) { imageToBlur = null; }
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n") || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n", blockCompilation) || this;
             _this.direction = direction;
             _this.onApplyObservable.add(function (effect) {
                 if (imageToBlur != null) {
@@ -69331,10 +69418,13 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, "#define BLUR_LEVEL " + blurSteps.length + "\n", textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, true) || this;
+            _this.blurSteps = blurSteps;
             _this.onApplyObservable.add(function (effect) {
                 effect.setTextureFromPostProcess("circleOfConfusionSampler", circleOfConfusion);
                 effect.setTextureFromPostProcess("originalSampler", original);
@@ -69342,8 +69432,26 @@ var BABYLON;
                     effect.setTextureFromPostProcess("blurStep" + (index + 1), step);
                 });
             });
+            if (!blockCompilation) {
+                _this.updateEffect();
+            }
             return _this;
         }
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        DepthOfFieldMergePostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            _super.prototype.updateEffect.call(this, defines ? defines : "#define BLUR_LEVEL " + this.blurSteps.length + "\n", uniforms, samplers, indexParameters, onCompiled, onError);
+        };
         return DepthOfFieldMergePostProcess;
     }(BABYLON.PostProcess));
     BABYLON.DepthOfFieldMergePostProcess = DepthOfFieldMergePostProcess;
@@ -69369,10 +69477,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType) {
+        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * Max lens size in scene units/1000 (eg. millimeter). Standard cameras are 50mm. (default: 50) The diamater of the resulting aperture can be computed by lensSize/fStop.
              */
@@ -69455,18 +69565,20 @@ var BABYLON;
          * @param scene The scene the effect belongs to.
          * @param depthTexture The depth texture of the scene to compute the circle of confusion.This must be set in order for this to function but may be set after initialization if needed.
          * @param pipelineTextureType The type of texture to be used when performing the post processing.
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType) {
+        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType, blockCompilation) {
             if (blurLevel === void 0) { blurLevel = DepthOfFieldEffectBlurLevel.Low; }
             if (pipelineTextureType === void 0) { pipelineTextureType = 0; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, scene.getEngine(), "depth of field", function () {
                 return _this._effects;
             }, true) || this;
             _this._effects = [];
             // Circle of confusion value for each pixel is used to determine how much to blur that pixel
-            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             // Capture circle of confusion texture
-            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldPass.autoClear = false;
             // Create a pyramid of blurred images (eg. fullSize 1/4 blur, half size 1/2 blur, quarter size 3/4 blur, eith size 4/4 blur)
             // Blur the image but do not blur on sharp far to near distance changes to avoid bleeding artifacts 
@@ -69494,15 +69606,15 @@ var BABYLON;
             }
             var adjustedKernelSize = kernelSize / Math.pow(2, blurCount - 1);
             for (var i = 0; i < blurCount; i++) {
-                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurY.autoClear = false;
-                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurX.autoClear = false;
                 _this._depthOfFieldBlurY.push(blurY);
                 _this._depthOfFieldBlurX.push(blurX);
             }
             // Merge blurred images with original image based on circleOfConfusion
-            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldMerge.autoClear = false;
             // Set all post processes on the effect.
             _this._effects = [_this._circleOfConfusion, _this._depthOfFieldPass];
@@ -69590,6 +69702,26 @@ var BABYLON;
             });
             this._depthOfFieldMerge.dispose(camera);
         };
+        /**
+         * Internal
+         */
+        DepthOfFieldEffect.prototype._updateEffects = function () {
+            for (var effect in this._effects) {
+                this._effects[effect].updateEffect();
+            }
+        };
+        /**
+         * Internal
+         * @returns if all the contained post processes are ready.
+         */
+        DepthOfFieldEffect.prototype._isReady = function () {
+            for (var effect in this._effects) {
+                if (!this._effects[effect].isReady()) {
+                    return false;
+                }
+            }
+            return true;
+        };
         return DepthOfFieldEffect;
     }(BABYLON.PostProcessRenderEffect));
     BABYLON.DepthOfFieldEffect = DepthOfFieldEffect;
@@ -69710,10 +69842,12 @@ var BABYLON;
             // Attach
             scene.postProcessRenderPipelineManager.addPipeline(_this);
             var engine = _this._scene.getEngine();
-            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            // Create post processes before hand so they can be modified before enabled.
+            // Block compilation flag is set to true to avoid compilation prior to use, these will be updated on first use in build pipeline.
+            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._sharpenEffect = new BABYLON.PostProcessRenderEffect(engine, _this.SharpenPostProcessId, function () { return _this.sharpen; }, true);
-            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType);
-            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType, true);
+            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._chromaticAberrationEffect = new BABYLON.PostProcessRenderEffect(engine, _this.ChromaticAberrationPostProcessId, function () { return _this.chromaticAberration; }, true);
             _this._buildPipeline();
             return _this;
@@ -69946,12 +70080,18 @@ var BABYLON;
             this._prevPostProcess = null;
             this._prevPrevPostProcess = null;
             if (this.sharpenEnabled) {
+                if (!this.sharpen.isReady()) {
+                    this.sharpen.updateEffect();
+                }
                 this.addEffect(this._sharpenEffect);
                 this._setAutoClearAndTextureSharing(this.sharpen);
             }
             if (this.depthOfFieldEnabled) {
                 var depthTexture = this._scene.enableDepthRenderer(this._cameras[0]).getDepthMap();
                 this.depthOfField.depthTexture = depthTexture;
+                if (!this.depthOfField._isReady()) {
+                    this.depthOfField._updateEffects();
+                }
                 this.addEffect(this.depthOfField);
                 this._setAutoClearAndTextureSharing(this.depthOfField._depthOfFieldMerge);
             }
@@ -70033,6 +70173,9 @@ var BABYLON;
                 this._setAutoClearAndTextureSharing(this.fxaa);
             }
             if (this.chromaticAberrationEnabled) {
+                if (!this.chromaticAberration.isReady()) {
+                    this.chromaticAberration.updateEffect();
+                }
                 this.addEffect(this._chromaticAberrationEffect);
                 this._setAutoClearAndTextureSharing(this.chromaticAberration);
             }

dist/preview release/customConfigurations/minimalGLTFViewer/babylon.max.js

@@ -14894,7 +14894,7 @@ var BABYLON;
                 if (this._renderingCanvas) {
                     this._renderingCanvas.removeEventListener("focus", this._onCanvasFocus);
                     this._renderingCanvas.removeEventListener("blur", this._onCanvasBlur);
-                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasBlur);
+                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasPointerOut);
                     if (!this._doNotHandleContextLost) {
                         this._renderingCanvas.removeEventListener("webglcontextlost", this._onContextLost);
                         this._renderingCanvas.removeEventListener("webglcontextrestored", this._onContextRestored);
@@ -14930,6 +14930,7 @@ var BABYLON;
             this._currentBufferPointers = [];
             this._renderingCanvas = null;
             this._currentProgram = null;
+            this._bindedRenderFunction = null;
             this.onResizeObservable.clear();
             this.onCanvasBlurObservable.clear();
             this.onCanvasFocusObservable.clear();
@@ -18535,6 +18536,9 @@ var BABYLON;
             var _this = this;
             if (disposeMaterialAndTextures === void 0) { disposeMaterialAndTextures = false; }
             var index;
+            // Smart Array Retainers.
+            this.getScene().freeActiveMeshes();
+            this.getScene().freeRenderingGroups();
             // Action manager
             if (this.actionManager !== undefined && this.actionManager !== null) {
                 this.actionManager.dispose();
@@ -20809,13 +20813,19 @@ var BABYLON;
             }
         };
         RenderingManager.prototype.dispose = function () {
+            this.freeRenderingGroups();
+            this._renderingGroups.length = 0;
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        RenderingManager.prototype.freeRenderingGroups = function () {
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.dispose();
                 }
             }
-            this._renderingGroups.length = 0;
         };
         RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (this._renderingGroups[renderingGroupId] === undefined) {
@@ -24009,6 +24019,45 @@ var BABYLON;
                 }
             }
         };
+        /**
+         * Clear the processed materials smart array preventing retention point in material dispose.
+         */
+        Scene.prototype.freeProcessedMaterials = function () {
+            this._processedMaterials.dispose();
+        };
+        /**
+         * Clear the active meshes smart array preventing retention point in mesh dispose.
+         */
+        Scene.prototype.freeActiveMeshes = function () {
+            this._activeMeshes.dispose();
+            if (this.activeCamera && this.activeCamera._activeMeshes) {
+                this.activeCamera._activeMeshes.dispose();
+            }
+            if (this.activeCameras) {
+                for (var i = 0; i < this.activeCameras.length; i++) {
+                    var activeCamera = this.activeCameras[i];
+                    if (activeCamera && activeCamera._activeMeshes) {
+                        activeCamera._activeMeshes.dispose();
+                    }
+                }
+            }
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        Scene.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+            if (this.textures) {
+                for (var i = 0; i < this.textures.length; i++) {
+                    var texture = this.textures[i];
+                    if (texture && texture.isRenderTarget) {
+                        texture.freeRenderingGroups();
+                    }
+                }
+            }
+        };
         Scene.prototype._isInIntermediateRendering = function () {
             return this._intermediateRendering;
         };
@@ -31810,6 +31859,7 @@ var BABYLON;
         Material.prototype.dispose = function (forceDisposeEffect, forceDisposeTextures) {
             // Animations
             this.getScene().stopAnimation(this);
+            this.getScene().freeProcessedMaterials();
             // Remove from scene
             var index = this._scene.materials.indexOf(this);
             if (index >= 0) {
@@ -58304,6 +58354,14 @@ var BABYLON;
                 this._postProcessManager._rebuild();
             }
         };
+        /**
+         * Clear the info related to rendering groups preventing retention point in material dispose.
+         */
+        RenderTargetTexture.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+        };
         RenderTargetTexture._REFRESHRATE_RENDER_ONCE = 0;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYFRAME = 1;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYTWOFRAMES = 2;
@@ -59644,10 +59702,11 @@ var BABYLON;
 (function (BABYLON) {
     var PassPostProcess = /** @class */ (function (_super) {
         __extends(PassPostProcess, _super);
-        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (camera === void 0) { camera = null; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType, undefined, null, blockCompilation) || this;
         }
         return PassPostProcess;
     }(BABYLON.PostProcess));
@@ -68276,10 +68335,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType) {
+        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * The amount of seperation of rgb channels (default: 0)
              */
@@ -68331,10 +68392,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * How much of the original color should be applied. Setting this to 0 will display edge detection. (default: 1)
              */
@@ -68376,13 +68439,16 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines) {
+        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines, blockCompilation) {
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
             if (defines === void 0) { defines = ""; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, name, "kernelBlur", ["delta", "direction", "cameraMinMaxZ"], ["circleOfConfusionSampler"], options, camera, samplingMode, engine, reusable, null, textureType, "kernelBlur", { varyingCount: 0, depCount: 0 }, true) || this;
             _this.direction = direction;
+            _this.blockCompilation = blockCompilation;
             _this._packedFloat = false;
             _this._staticDefines = "";
             _this._staticDefines = defines;
@@ -68409,7 +68475,9 @@ var BABYLON;
                 v = Math.max(v, 1);
                 this._idealKernel = v;
                 this._kernel = this._nearestBestKernel(v);
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
@@ -68429,12 +68497,29 @@ var BABYLON;
                     return;
                 }
                 this._packedFloat = v;
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
         });
-        BlurPostProcess.prototype._updateParameters = function () {
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        BlurPostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            this._updateParameters(onCompiled, onError);
+        };
+        BlurPostProcess.prototype._updateParameters = function (onCompiled, onError) {
             // Generate sampling offsets and weights
             var N = this._kernel;
             var centerIndex = (N - 1) / 2;
@@ -68504,10 +68589,10 @@ var BABYLON;
             if (this.packedFloat) {
                 defines += "#define PACKEDFLOAT 1";
             }
-            this.updateEffect(defines, null, null, {
+            _super.prototype.updateEffect.call(this, defines, null, null, {
                 varyingCount: varyingCount,
                 depCount: depCount
-            });
+            }, onCompiled, onError);
         };
         /**
          * Best kernels are odd numbers that when divided by 2, their integer part is even, so 5, 9 or 13.
@@ -68588,12 +68673,14 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (imageToBlur === void 0) { imageToBlur = null; }
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n") || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n", blockCompilation) || this;
             _this.direction = direction;
             _this.onApplyObservable.add(function (effect) {
                 if (imageToBlur != null) {
@@ -68633,10 +68720,13 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, "#define BLUR_LEVEL " + blurSteps.length + "\n", textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, true) || this;
+            _this.blurSteps = blurSteps;
             _this.onApplyObservable.add(function (effect) {
                 effect.setTextureFromPostProcess("circleOfConfusionSampler", circleOfConfusion);
                 effect.setTextureFromPostProcess("originalSampler", original);
@@ -68644,8 +68734,26 @@ var BABYLON;
                     effect.setTextureFromPostProcess("blurStep" + (index + 1), step);
                 });
             });
+            if (!blockCompilation) {
+                _this.updateEffect();
+            }
             return _this;
         }
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        DepthOfFieldMergePostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            _super.prototype.updateEffect.call(this, defines ? defines : "#define BLUR_LEVEL " + this.blurSteps.length + "\n", uniforms, samplers, indexParameters, onCompiled, onError);
+        };
         return DepthOfFieldMergePostProcess;
     }(BABYLON.PostProcess));
     BABYLON.DepthOfFieldMergePostProcess = DepthOfFieldMergePostProcess;
@@ -68671,10 +68779,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType) {
+        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * Max lens size in scene units/1000 (eg. millimeter). Standard cameras are 50mm. (default: 50) The diamater of the resulting aperture can be computed by lensSize/fStop.
              */
@@ -68757,18 +68867,20 @@ var BABYLON;
          * @param scene The scene the effect belongs to.
          * @param depthTexture The depth texture of the scene to compute the circle of confusion.This must be set in order for this to function but may be set after initialization if needed.
          * @param pipelineTextureType The type of texture to be used when performing the post processing.
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType) {
+        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType, blockCompilation) {
             if (blurLevel === void 0) { blurLevel = DepthOfFieldEffectBlurLevel.Low; }
             if (pipelineTextureType === void 0) { pipelineTextureType = 0; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, scene.getEngine(), "depth of field", function () {
                 return _this._effects;
             }, true) || this;
             _this._effects = [];
             // Circle of confusion value for each pixel is used to determine how much to blur that pixel
-            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             // Capture circle of confusion texture
-            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldPass.autoClear = false;
             // Create a pyramid of blurred images (eg. fullSize 1/4 blur, half size 1/2 blur, quarter size 3/4 blur, eith size 4/4 blur)
             // Blur the image but do not blur on sharp far to near distance changes to avoid bleeding artifacts 
@@ -68796,15 +68908,15 @@ var BABYLON;
             }
             var adjustedKernelSize = kernelSize / Math.pow(2, blurCount - 1);
             for (var i = 0; i < blurCount; i++) {
-                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurY.autoClear = false;
-                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurX.autoClear = false;
                 _this._depthOfFieldBlurY.push(blurY);
                 _this._depthOfFieldBlurX.push(blurX);
             }
             // Merge blurred images with original image based on circleOfConfusion
-            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldMerge.autoClear = false;
             // Set all post processes on the effect.
             _this._effects = [_this._circleOfConfusion, _this._depthOfFieldPass];
@@ -68892,6 +69004,26 @@ var BABYLON;
             });
             this._depthOfFieldMerge.dispose(camera);
         };
+        /**
+         * Internal
+         */
+        DepthOfFieldEffect.prototype._updateEffects = function () {
+            for (var effect in this._effects) {
+                this._effects[effect].updateEffect();
+            }
+        };
+        /**
+         * Internal
+         * @returns if all the contained post processes are ready.
+         */
+        DepthOfFieldEffect.prototype._isReady = function () {
+            for (var effect in this._effects) {
+                if (!this._effects[effect].isReady()) {
+                    return false;
+                }
+            }
+            return true;
+        };
         return DepthOfFieldEffect;
     }(BABYLON.PostProcessRenderEffect));
     BABYLON.DepthOfFieldEffect = DepthOfFieldEffect;
@@ -69012,10 +69144,12 @@ var BABYLON;
             // Attach
             scene.postProcessRenderPipelineManager.addPipeline(_this);
             var engine = _this._scene.getEngine();
-            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            // Create post processes before hand so they can be modified before enabled.
+            // Block compilation flag is set to true to avoid compilation prior to use, these will be updated on first use in build pipeline.
+            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._sharpenEffect = new BABYLON.PostProcessRenderEffect(engine, _this.SharpenPostProcessId, function () { return _this.sharpen; }, true);
-            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType);
-            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType, true);
+            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._chromaticAberrationEffect = new BABYLON.PostProcessRenderEffect(engine, _this.ChromaticAberrationPostProcessId, function () { return _this.chromaticAberration; }, true);
             _this._buildPipeline();
             return _this;
@@ -69248,12 +69382,18 @@ var BABYLON;
             this._prevPostProcess = null;
             this._prevPrevPostProcess = null;
             if (this.sharpenEnabled) {
+                if (!this.sharpen.isReady()) {
+                    this.sharpen.updateEffect();
+                }
                 this.addEffect(this._sharpenEffect);
                 this._setAutoClearAndTextureSharing(this.sharpen);
             }
             if (this.depthOfFieldEnabled) {
                 var depthTexture = this._scene.enableDepthRenderer(this._cameras[0]).getDepthMap();
                 this.depthOfField.depthTexture = depthTexture;
+                if (!this.depthOfField._isReady()) {
+                    this.depthOfField._updateEffects();
+                }
                 this.addEffect(this.depthOfField);
                 this._setAutoClearAndTextureSharing(this.depthOfField._depthOfFieldMerge);
             }
@@ -69335,6 +69475,9 @@ var BABYLON;
                 this._setAutoClearAndTextureSharing(this.fxaa);
             }
             if (this.chromaticAberrationEnabled) {
+                if (!this.chromaticAberration.isReady()) {
+                    this.chromaticAberration.updateEffect();
+                }
                 this.addEffect(this._chromaticAberrationEffect);
                 this._setAutoClearAndTextureSharing(this.chromaticAberration);
             }
@@ -93916,15 +94059,15 @@ var BABYLON;
                     if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                         babylonMesh._delayInfo.push(kind);
                     }
+                    if (attribute === "COLOR_0") {
+                        // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
+                        babylonMesh.hasVertexAlpha = true;
+                    }
                     var accessor = GLTFLoader._GetProperty(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
                     promises.push(_this._loadAccessorAsync("#/accessors/" + accessor._index, accessor).then(function (data) {
                         var attributeData = GLTFLoader._ConvertToFloat32Array(context, accessor, data);
-                        if (attribute === "COLOR_0") {
-                            // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
-                            babylonMesh.hasVertexAlpha = true;
-                            if (accessor.type === "VEC3") {
-                                attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
-                            }
+                        if (attribute === "COLOR_0" && accessor.type === "VEC3") {
+                            attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
                         }
                         babylonVertexData.set(attributeData, kind);
                     }));
@@ -94782,6 +94925,8 @@ var BABYLON;
                         if (babylonMaterial && babylonMeshes) {
                             for (var _b = 0, babylonMeshes_1 = babylonMeshes; _b < babylonMeshes_1.length; _b++) {
                                 var babylonMesh = babylonMeshes_1[_b];
+                                // Ensure nonUniformScaling is set if necessary.
+                                babylonMesh.computeWorldMatrix(true);
                                 promises.push(babylonMaterial.forceCompilationAsync(babylonMesh));
                                 if (this.useClipPlane) {
                                     promises.push(babylonMaterial.forceCompilationAsync(babylonMesh, { clipPlane: true }));

dist/preview release/customConfigurations/minimalGLTFViewer/es6.js

@@ -14867,7 +14867,7 @@ var BABYLON;
                 if (this._renderingCanvas) {
                     this._renderingCanvas.removeEventListener("focus", this._onCanvasFocus);
                     this._renderingCanvas.removeEventListener("blur", this._onCanvasBlur);
-                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasBlur);
+                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasPointerOut);
                     if (!this._doNotHandleContextLost) {
                         this._renderingCanvas.removeEventListener("webglcontextlost", this._onContextLost);
                         this._renderingCanvas.removeEventListener("webglcontextrestored", this._onContextRestored);
@@ -14903,6 +14903,7 @@ var BABYLON;
             this._currentBufferPointers = [];
             this._renderingCanvas = null;
             this._currentProgram = null;
+            this._bindedRenderFunction = null;
             this.onResizeObservable.clear();
             this.onCanvasBlurObservable.clear();
             this.onCanvasFocusObservable.clear();
@@ -18508,6 +18509,9 @@ var BABYLON;
             var _this = this;
             if (disposeMaterialAndTextures === void 0) { disposeMaterialAndTextures = false; }
             var index;
+            // Smart Array Retainers.
+            this.getScene().freeActiveMeshes();
+            this.getScene().freeRenderingGroups();
             // Action manager
             if (this.actionManager !== undefined && this.actionManager !== null) {
                 this.actionManager.dispose();
@@ -20782,13 +20786,19 @@ var BABYLON;
             }
         };
         RenderingManager.prototype.dispose = function () {
+            this.freeRenderingGroups();
+            this._renderingGroups.length = 0;
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        RenderingManager.prototype.freeRenderingGroups = function () {
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.dispose();
                 }
             }
-            this._renderingGroups.length = 0;
         };
         RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (this._renderingGroups[renderingGroupId] === undefined) {
@@ -23982,6 +23992,45 @@ var BABYLON;
                 }
             }
         };
+        /**
+         * Clear the processed materials smart array preventing retention point in material dispose.
+         */
+        Scene.prototype.freeProcessedMaterials = function () {
+            this._processedMaterials.dispose();
+        };
+        /**
+         * Clear the active meshes smart array preventing retention point in mesh dispose.
+         */
+        Scene.prototype.freeActiveMeshes = function () {
+            this._activeMeshes.dispose();
+            if (this.activeCamera && this.activeCamera._activeMeshes) {
+                this.activeCamera._activeMeshes.dispose();
+            }
+            if (this.activeCameras) {
+                for (var i = 0; i < this.activeCameras.length; i++) {
+                    var activeCamera = this.activeCameras[i];
+                    if (activeCamera && activeCamera._activeMeshes) {
+                        activeCamera._activeMeshes.dispose();
+                    }
+                }
+            }
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        Scene.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+            if (this.textures) {
+                for (var i = 0; i < this.textures.length; i++) {
+                    var texture = this.textures[i];
+                    if (texture && texture.isRenderTarget) {
+                        texture.freeRenderingGroups();
+                    }
+                }
+            }
+        };
         Scene.prototype._isInIntermediateRendering = function () {
             return this._intermediateRendering;
         };
@@ -31783,6 +31832,7 @@ var BABYLON;
         Material.prototype.dispose = function (forceDisposeEffect, forceDisposeTextures) {
             // Animations
             this.getScene().stopAnimation(this);
+            this.getScene().freeProcessedMaterials();
             // Remove from scene
             var index = this._scene.materials.indexOf(this);
             if (index >= 0) {
@@ -58277,6 +58327,14 @@ var BABYLON;
                 this._postProcessManager._rebuild();
             }
         };
+        /**
+         * Clear the info related to rendering groups preventing retention point in material dispose.
+         */
+        RenderTargetTexture.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+        };
         RenderTargetTexture._REFRESHRATE_RENDER_ONCE = 0;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYFRAME = 1;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYTWOFRAMES = 2;
@@ -59617,10 +59675,11 @@ var BABYLON;
 (function (BABYLON) {
     var PassPostProcess = /** @class */ (function (_super) {
         __extends(PassPostProcess, _super);
-        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (camera === void 0) { camera = null; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType, undefined, null, blockCompilation) || this;
         }
         return PassPostProcess;
     }(BABYLON.PostProcess));
@@ -68249,10 +68308,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType) {
+        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * The amount of seperation of rgb channels (default: 0)
              */
@@ -68304,10 +68365,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * How much of the original color should be applied. Setting this to 0 will display edge detection. (default: 1)
              */
@@ -68349,13 +68412,16 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines) {
+        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines, blockCompilation) {
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
             if (defines === void 0) { defines = ""; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, name, "kernelBlur", ["delta", "direction", "cameraMinMaxZ"], ["circleOfConfusionSampler"], options, camera, samplingMode, engine, reusable, null, textureType, "kernelBlur", { varyingCount: 0, depCount: 0 }, true) || this;
             _this.direction = direction;
+            _this.blockCompilation = blockCompilation;
             _this._packedFloat = false;
             _this._staticDefines = "";
             _this._staticDefines = defines;
@@ -68382,7 +68448,9 @@ var BABYLON;
                 v = Math.max(v, 1);
                 this._idealKernel = v;
                 this._kernel = this._nearestBestKernel(v);
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
@@ -68402,12 +68470,29 @@ var BABYLON;
                     return;
                 }
                 this._packedFloat = v;
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
         });
-        BlurPostProcess.prototype._updateParameters = function () {
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        BlurPostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            this._updateParameters(onCompiled, onError);
+        };
+        BlurPostProcess.prototype._updateParameters = function (onCompiled, onError) {
             // Generate sampling offsets and weights
             var N = this._kernel;
             var centerIndex = (N - 1) / 2;
@@ -68477,10 +68562,10 @@ var BABYLON;
             if (this.packedFloat) {
                 defines += "#define PACKEDFLOAT 1";
             }
-            this.updateEffect(defines, null, null, {
+            _super.prototype.updateEffect.call(this, defines, null, null, {
                 varyingCount: varyingCount,
                 depCount: depCount
-            });
+            }, onCompiled, onError);
         };
         /**
          * Best kernels are odd numbers that when divided by 2, their integer part is even, so 5, 9 or 13.
@@ -68561,12 +68646,14 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (imageToBlur === void 0) { imageToBlur = null; }
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n") || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n", blockCompilation) || this;
             _this.direction = direction;
             _this.onApplyObservable.add(function (effect) {
                 if (imageToBlur != null) {
@@ -68606,10 +68693,13 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, "#define BLUR_LEVEL " + blurSteps.length + "\n", textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, true) || this;
+            _this.blurSteps = blurSteps;
             _this.onApplyObservable.add(function (effect) {
                 effect.setTextureFromPostProcess("circleOfConfusionSampler", circleOfConfusion);
                 effect.setTextureFromPostProcess("originalSampler", original);
@@ -68617,8 +68707,26 @@ var BABYLON;
                     effect.setTextureFromPostProcess("blurStep" + (index + 1), step);
                 });
             });
+            if (!blockCompilation) {
+                _this.updateEffect();
+            }
             return _this;
         }
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        DepthOfFieldMergePostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            _super.prototype.updateEffect.call(this, defines ? defines : "#define BLUR_LEVEL " + this.blurSteps.length + "\n", uniforms, samplers, indexParameters, onCompiled, onError);
+        };
         return DepthOfFieldMergePostProcess;
     }(BABYLON.PostProcess));
     BABYLON.DepthOfFieldMergePostProcess = DepthOfFieldMergePostProcess;
@@ -68644,10 +68752,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType) {
+        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * Max lens size in scene units/1000 (eg. millimeter). Standard cameras are 50mm. (default: 50) The diamater of the resulting aperture can be computed by lensSize/fStop.
              */
@@ -68730,18 +68840,20 @@ var BABYLON;
          * @param scene The scene the effect belongs to.
          * @param depthTexture The depth texture of the scene to compute the circle of confusion.This must be set in order for this to function but may be set after initialization if needed.
          * @param pipelineTextureType The type of texture to be used when performing the post processing.
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType) {
+        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType, blockCompilation) {
             if (blurLevel === void 0) { blurLevel = DepthOfFieldEffectBlurLevel.Low; }
             if (pipelineTextureType === void 0) { pipelineTextureType = 0; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, scene.getEngine(), "depth of field", function () {
                 return _this._effects;
             }, true) || this;
             _this._effects = [];
             // Circle of confusion value for each pixel is used to determine how much to blur that pixel
-            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             // Capture circle of confusion texture
-            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldPass.autoClear = false;
             // Create a pyramid of blurred images (eg. fullSize 1/4 blur, half size 1/2 blur, quarter size 3/4 blur, eith size 4/4 blur)
             // Blur the image but do not blur on sharp far to near distance changes to avoid bleeding artifacts 
@@ -68769,15 +68881,15 @@ var BABYLON;
             }
             var adjustedKernelSize = kernelSize / Math.pow(2, blurCount - 1);
             for (var i = 0; i < blurCount; i++) {
-                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurY.autoClear = false;
-                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurX.autoClear = false;
                 _this._depthOfFieldBlurY.push(blurY);
                 _this._depthOfFieldBlurX.push(blurX);
             }
             // Merge blurred images with original image based on circleOfConfusion
-            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldMerge.autoClear = false;
             // Set all post processes on the effect.
             _this._effects = [_this._circleOfConfusion, _this._depthOfFieldPass];
@@ -68865,6 +68977,26 @@ var BABYLON;
             });
             this._depthOfFieldMerge.dispose(camera);
         };
+        /**
+         * Internal
+         */
+        DepthOfFieldEffect.prototype._updateEffects = function () {
+            for (var effect in this._effects) {
+                this._effects[effect].updateEffect();
+            }
+        };
+        /**
+         * Internal
+         * @returns if all the contained post processes are ready.
+         */
+        DepthOfFieldEffect.prototype._isReady = function () {
+            for (var effect in this._effects) {
+                if (!this._effects[effect].isReady()) {
+                    return false;
+                }
+            }
+            return true;
+        };
         return DepthOfFieldEffect;
     }(BABYLON.PostProcessRenderEffect));
     BABYLON.DepthOfFieldEffect = DepthOfFieldEffect;
@@ -68985,10 +69117,12 @@ var BABYLON;
             // Attach
             scene.postProcessRenderPipelineManager.addPipeline(_this);
             var engine = _this._scene.getEngine();
-            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            // Create post processes before hand so they can be modified before enabled.
+            // Block compilation flag is set to true to avoid compilation prior to use, these will be updated on first use in build pipeline.
+            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._sharpenEffect = new BABYLON.PostProcessRenderEffect(engine, _this.SharpenPostProcessId, function () { return _this.sharpen; }, true);
-            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType);
-            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType, true);
+            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._chromaticAberrationEffect = new BABYLON.PostProcessRenderEffect(engine, _this.ChromaticAberrationPostProcessId, function () { return _this.chromaticAberration; }, true);
             _this._buildPipeline();
             return _this;
@@ -69221,12 +69355,18 @@ var BABYLON;
             this._prevPostProcess = null;
             this._prevPrevPostProcess = null;
             if (this.sharpenEnabled) {
+                if (!this.sharpen.isReady()) {
+                    this.sharpen.updateEffect();
+                }
                 this.addEffect(this._sharpenEffect);
                 this._setAutoClearAndTextureSharing(this.sharpen);
             }
             if (this.depthOfFieldEnabled) {
                 var depthTexture = this._scene.enableDepthRenderer(this._cameras[0]).getDepthMap();
                 this.depthOfField.depthTexture = depthTexture;
+                if (!this.depthOfField._isReady()) {
+                    this.depthOfField._updateEffects();
+                }
                 this.addEffect(this.depthOfField);
                 this._setAutoClearAndTextureSharing(this.depthOfField._depthOfFieldMerge);
             }
@@ -69308,6 +69448,9 @@ var BABYLON;
                 this._setAutoClearAndTextureSharing(this.fxaa);
             }
             if (this.chromaticAberrationEnabled) {
+                if (!this.chromaticAberration.isReady()) {
+                    this.chromaticAberration.updateEffect();
+                }
                 this.addEffect(this._chromaticAberrationEffect);
                 this._setAutoClearAndTextureSharing(this.chromaticAberration);
             }
@@ -93889,15 +94032,15 @@ var BABYLON;
                     if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                         babylonMesh._delayInfo.push(kind);
                     }
+                    if (attribute === "COLOR_0") {
+                        // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
+                        babylonMesh.hasVertexAlpha = true;
+                    }
                     var accessor = GLTFLoader._GetProperty(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
                     promises.push(_this._loadAccessorAsync("#/accessors/" + accessor._index, accessor).then(function (data) {
                         var attributeData = GLTFLoader._ConvertToFloat32Array(context, accessor, data);
-                        if (attribute === "COLOR_0") {
-                            // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
-                            babylonMesh.hasVertexAlpha = true;
-                            if (accessor.type === "VEC3") {
-                                attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
-                            }
+                        if (attribute === "COLOR_0" && accessor.type === "VEC3") {
+                            attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
                         }
                         babylonVertexData.set(attributeData, kind);
                     }));
@@ -94755,6 +94898,8 @@ var BABYLON;
                         if (babylonMaterial && babylonMeshes) {
                             for (var _b = 0, babylonMeshes_1 = babylonMeshes; _b < babylonMeshes_1.length; _b++) {
                                 var babylonMesh = babylonMeshes_1[_b];
+                                // Ensure nonUniformScaling is set if necessary.
+                                babylonMesh.computeWorldMatrix(true);
                                 promises.push(babylonMaterial.forceCompilationAsync(babylonMesh));
                                 if (this.useClipPlane) {
                                     promises.push(babylonMaterial.forceCompilationAsync(babylonMesh, { clipPlane: true }));

dist/preview release/es6.js

@@ -14867,7 +14867,7 @@ var BABYLON;
                 if (this._renderingCanvas) {
                     this._renderingCanvas.removeEventListener("focus", this._onCanvasFocus);
                     this._renderingCanvas.removeEventListener("blur", this._onCanvasBlur);
-                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasBlur);
+                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasPointerOut);
                     if (!this._doNotHandleContextLost) {
                         this._renderingCanvas.removeEventListener("webglcontextlost", this._onContextLost);
                         this._renderingCanvas.removeEventListener("webglcontextrestored", this._onContextRestored);
@@ -14903,6 +14903,7 @@ var BABYLON;
             this._currentBufferPointers = [];
             this._renderingCanvas = null;
             this._currentProgram = null;
+            this._bindedRenderFunction = null;
             this.onResizeObservable.clear();
             this.onCanvasBlurObservable.clear();
             this.onCanvasFocusObservable.clear();
@@ -18508,6 +18509,9 @@ var BABYLON;
             var _this = this;
             if (disposeMaterialAndTextures === void 0) { disposeMaterialAndTextures = false; }
             var index;
+            // Smart Array Retainers.
+            this.getScene().freeActiveMeshes();
+            this.getScene().freeRenderingGroups();
             // Action manager
             if (this.actionManager !== undefined && this.actionManager !== null) {
                 this.actionManager.dispose();
@@ -20782,13 +20786,19 @@ var BABYLON;
             }
         };
         RenderingManager.prototype.dispose = function () {
+            this.freeRenderingGroups();
+            this._renderingGroups.length = 0;
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        RenderingManager.prototype.freeRenderingGroups = function () {
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.dispose();
                 }
             }
-            this._renderingGroups.length = 0;
         };
         RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (this._renderingGroups[renderingGroupId] === undefined) {
@@ -23982,6 +23992,45 @@ var BABYLON;
                 }
             }
         };
+        /**
+         * Clear the processed materials smart array preventing retention point in material dispose.
+         */
+        Scene.prototype.freeProcessedMaterials = function () {
+            this._processedMaterials.dispose();
+        };
+        /**
+         * Clear the active meshes smart array preventing retention point in mesh dispose.
+         */
+        Scene.prototype.freeActiveMeshes = function () {
+            this._activeMeshes.dispose();
+            if (this.activeCamera && this.activeCamera._activeMeshes) {
+                this.activeCamera._activeMeshes.dispose();
+            }
+            if (this.activeCameras) {
+                for (var i = 0; i < this.activeCameras.length; i++) {
+                    var activeCamera = this.activeCameras[i];
+                    if (activeCamera && activeCamera._activeMeshes) {
+                        activeCamera._activeMeshes.dispose();
+                    }
+                }
+            }
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        Scene.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+            if (this.textures) {
+                for (var i = 0; i < this.textures.length; i++) {
+                    var texture = this.textures[i];
+                    if (texture && texture.isRenderTarget) {
+                        texture.freeRenderingGroups();
+                    }
+                }
+            }
+        };
         Scene.prototype._isInIntermediateRendering = function () {
             return this._intermediateRendering;
         };
@@ -31783,6 +31832,7 @@ var BABYLON;
         Material.prototype.dispose = function (forceDisposeEffect, forceDisposeTextures) {
             // Animations
             this.getScene().stopAnimation(this);
+            this.getScene().freeProcessedMaterials();
             // Remove from scene
             var index = this._scene.materials.indexOf(this);
             if (index >= 0) {
@@ -58975,6 +59025,14 @@ var BABYLON;
                 this._postProcessManager._rebuild();
             }
         };
+        /**
+         * Clear the info related to rendering groups preventing retention point in material dispose.
+         */
+        RenderTargetTexture.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+        };
         RenderTargetTexture._REFRESHRATE_RENDER_ONCE = 0;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYFRAME = 1;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYTWOFRAMES = 2;
@@ -60315,10 +60373,11 @@ var BABYLON;
 (function (BABYLON) {
     var PassPostProcess = /** @class */ (function (_super) {
         __extends(PassPostProcess, _super);
-        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (camera === void 0) { camera = null; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType, undefined, null, blockCompilation) || this;
         }
         return PassPostProcess;
     }(BABYLON.PostProcess));
@@ -68947,10 +69006,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType) {
+        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * The amount of seperation of rgb channels (default: 0)
              */
@@ -69002,10 +69063,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * How much of the original color should be applied. Setting this to 0 will display edge detection. (default: 1)
              */
@@ -69047,13 +69110,16 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines) {
+        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines, blockCompilation) {
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
             if (defines === void 0) { defines = ""; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, name, "kernelBlur", ["delta", "direction", "cameraMinMaxZ"], ["circleOfConfusionSampler"], options, camera, samplingMode, engine, reusable, null, textureType, "kernelBlur", { varyingCount: 0, depCount: 0 }, true) || this;
             _this.direction = direction;
+            _this.blockCompilation = blockCompilation;
             _this._packedFloat = false;
             _this._staticDefines = "";
             _this._staticDefines = defines;
@@ -69080,7 +69146,9 @@ var BABYLON;
                 v = Math.max(v, 1);
                 this._idealKernel = v;
                 this._kernel = this._nearestBestKernel(v);
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
@@ -69100,12 +69168,29 @@ var BABYLON;
                     return;
                 }
                 this._packedFloat = v;
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
         });
-        BlurPostProcess.prototype._updateParameters = function () {
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        BlurPostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            this._updateParameters(onCompiled, onError);
+        };
+        BlurPostProcess.prototype._updateParameters = function (onCompiled, onError) {
             // Generate sampling offsets and weights
             var N = this._kernel;
             var centerIndex = (N - 1) / 2;
@@ -69175,10 +69260,10 @@ var BABYLON;
             if (this.packedFloat) {
                 defines += "#define PACKEDFLOAT 1";
             }
-            this.updateEffect(defines, null, null, {
+            _super.prototype.updateEffect.call(this, defines, null, null, {
                 varyingCount: varyingCount,
                 depCount: depCount
-            });
+            }, onCompiled, onError);
         };
         /**
          * Best kernels are odd numbers that when divided by 2, their integer part is even, so 5, 9 or 13.
@@ -69259,12 +69344,14 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (imageToBlur === void 0) { imageToBlur = null; }
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n") || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n", blockCompilation) || this;
             _this.direction = direction;
             _this.onApplyObservable.add(function (effect) {
                 if (imageToBlur != null) {
@@ -69304,10 +69391,13 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, "#define BLUR_LEVEL " + blurSteps.length + "\n", textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, true) || this;
+            _this.blurSteps = blurSteps;
             _this.onApplyObservable.add(function (effect) {
                 effect.setTextureFromPostProcess("circleOfConfusionSampler", circleOfConfusion);
                 effect.setTextureFromPostProcess("originalSampler", original);
@@ -69315,8 +69405,26 @@ var BABYLON;
                     effect.setTextureFromPostProcess("blurStep" + (index + 1), step);
                 });
             });
+            if (!blockCompilation) {
+                _this.updateEffect();
+            }
             return _this;
         }
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        DepthOfFieldMergePostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            _super.prototype.updateEffect.call(this, defines ? defines : "#define BLUR_LEVEL " + this.blurSteps.length + "\n", uniforms, samplers, indexParameters, onCompiled, onError);
+        };
         return DepthOfFieldMergePostProcess;
     }(BABYLON.PostProcess));
     BABYLON.DepthOfFieldMergePostProcess = DepthOfFieldMergePostProcess;
@@ -69342,10 +69450,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType) {
+        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * Max lens size in scene units/1000 (eg. millimeter). Standard cameras are 50mm. (default: 50) The diamater of the resulting aperture can be computed by lensSize/fStop.
              */
@@ -69428,18 +69538,20 @@ var BABYLON;
          * @param scene The scene the effect belongs to.
          * @param depthTexture The depth texture of the scene to compute the circle of confusion.This must be set in order for this to function but may be set after initialization if needed.
          * @param pipelineTextureType The type of texture to be used when performing the post processing.
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType) {
+        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType, blockCompilation) {
             if (blurLevel === void 0) { blurLevel = DepthOfFieldEffectBlurLevel.Low; }
             if (pipelineTextureType === void 0) { pipelineTextureType = 0; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, scene.getEngine(), "depth of field", function () {
                 return _this._effects;
             }, true) || this;
             _this._effects = [];
             // Circle of confusion value for each pixel is used to determine how much to blur that pixel
-            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             // Capture circle of confusion texture
-            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldPass.autoClear = false;
             // Create a pyramid of blurred images (eg. fullSize 1/4 blur, half size 1/2 blur, quarter size 3/4 blur, eith size 4/4 blur)
             // Blur the image but do not blur on sharp far to near distance changes to avoid bleeding artifacts 
@@ -69467,15 +69579,15 @@ var BABYLON;
             }
             var adjustedKernelSize = kernelSize / Math.pow(2, blurCount - 1);
             for (var i = 0; i < blurCount; i++) {
-                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurY.autoClear = false;
-                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurX.autoClear = false;
                 _this._depthOfFieldBlurY.push(blurY);
                 _this._depthOfFieldBlurX.push(blurX);
             }
             // Merge blurred images with original image based on circleOfConfusion
-            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldMerge.autoClear = false;
             // Set all post processes on the effect.
             _this._effects = [_this._circleOfConfusion, _this._depthOfFieldPass];
@@ -69563,6 +69675,26 @@ var BABYLON;
             });
             this._depthOfFieldMerge.dispose(camera);
         };
+        /**
+         * Internal
+         */
+        DepthOfFieldEffect.prototype._updateEffects = function () {
+            for (var effect in this._effects) {
+                this._effects[effect].updateEffect();
+            }
+        };
+        /**
+         * Internal
+         * @returns if all the contained post processes are ready.
+         */
+        DepthOfFieldEffect.prototype._isReady = function () {
+            for (var effect in this._effects) {
+                if (!this._effects[effect].isReady()) {
+                    return false;
+                }
+            }
+            return true;
+        };
         return DepthOfFieldEffect;
     }(BABYLON.PostProcessRenderEffect));
     BABYLON.DepthOfFieldEffect = DepthOfFieldEffect;
@@ -69683,10 +69815,12 @@ var BABYLON;
             // Attach
             scene.postProcessRenderPipelineManager.addPipeline(_this);
             var engine = _this._scene.getEngine();
-            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            // Create post processes before hand so they can be modified before enabled.
+            // Block compilation flag is set to true to avoid compilation prior to use, these will be updated on first use in build pipeline.
+            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._sharpenEffect = new BABYLON.PostProcessRenderEffect(engine, _this.SharpenPostProcessId, function () { return _this.sharpen; }, true);
-            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType);
-            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType, true);
+            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._chromaticAberrationEffect = new BABYLON.PostProcessRenderEffect(engine, _this.ChromaticAberrationPostProcessId, function () { return _this.chromaticAberration; }, true);
             _this._buildPipeline();
             return _this;
@@ -69919,12 +70053,18 @@ var BABYLON;
             this._prevPostProcess = null;
             this._prevPrevPostProcess = null;
             if (this.sharpenEnabled) {
+                if (!this.sharpen.isReady()) {
+                    this.sharpen.updateEffect();
+                }
                 this.addEffect(this._sharpenEffect);
                 this._setAutoClearAndTextureSharing(this.sharpen);
             }
             if (this.depthOfFieldEnabled) {
                 var depthTexture = this._scene.enableDepthRenderer(this._cameras[0]).getDepthMap();
                 this.depthOfField.depthTexture = depthTexture;
+                if (!this.depthOfField._isReady()) {
+                    this.depthOfField._updateEffects();
+                }
                 this.addEffect(this.depthOfField);
                 this._setAutoClearAndTextureSharing(this.depthOfField._depthOfFieldMerge);
             }
@@ -70006,6 +70146,9 @@ var BABYLON;
                 this._setAutoClearAndTextureSharing(this.fxaa);
             }
             if (this.chromaticAberrationEnabled) {
+                if (!this.chromaticAberration.isReady()) {
+                    this.chromaticAberration.updateEffect();
+                }
                 this.addEffect(this._chromaticAberrationEffect);
                 this._setAutoClearAndTextureSharing(this.chromaticAberration);
             }

dist/preview release/loaders/babylon.glTF2FileLoader.js

@@ -944,15 +944,15 @@ var BABYLON;
                     if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                         babylonMesh._delayInfo.push(kind);
                     }
+                    if (attribute === "COLOR_0") {
+                        // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
+                        babylonMesh.hasVertexAlpha = true;
+                    }
                     var accessor = GLTFLoader._GetProperty(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
                     promises.push(_this._loadAccessorAsync("#/accessors/" + accessor._index, accessor).then(function (data) {
                         var attributeData = GLTFLoader._ConvertToFloat32Array(context, accessor, data);
-                        if (attribute === "COLOR_0") {
-                            // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
-                            babylonMesh.hasVertexAlpha = true;
-                            if (accessor.type === "VEC3") {
-                                attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
-                            }
+                        if (attribute === "COLOR_0" && accessor.type === "VEC3") {
+                            attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
                         }
                         babylonVertexData.set(attributeData, kind);
                     }));
@@ -1810,6 +1810,8 @@ var BABYLON;
                         if (babylonMaterial && babylonMeshes) {
                             for (var _b = 0, babylonMeshes_1 = babylonMeshes; _b < babylonMeshes_1.length; _b++) {
                                 var babylonMesh = babylonMeshes_1[_b];
+                                // Ensure nonUniformScaling is set if necessary.
+                                babylonMesh.computeWorldMatrix(true);
                                 promises.push(babylonMaterial.forceCompilationAsync(babylonMesh));
                                 if (this.useClipPlane) {
                                     promises.push(babylonMaterial.forceCompilationAsync(babylonMesh, { clipPlane: true }));

dist/preview release/loaders/babylon.glTFFileLoader.js

@@ -3121,15 +3121,15 @@ var BABYLON;
                     if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                         babylonMesh._delayInfo.push(kind);
                     }
+                    if (attribute === "COLOR_0") {
+                        // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
+                        babylonMesh.hasVertexAlpha = true;
+                    }
                     var accessor = GLTFLoader._GetProperty(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
                     promises.push(_this._loadAccessorAsync("#/accessors/" + accessor._index, accessor).then(function (data) {
                         var attributeData = GLTFLoader._ConvertToFloat32Array(context, accessor, data);
-                        if (attribute === "COLOR_0") {
-                            // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
-                            babylonMesh.hasVertexAlpha = true;
-                            if (accessor.type === "VEC3") {
-                                attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
-                            }
+                        if (attribute === "COLOR_0" && accessor.type === "VEC3") {
+                            attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
                         }
                         babylonVertexData.set(attributeData, kind);
                     }));
@@ -3987,6 +3987,8 @@ var BABYLON;
                         if (babylonMaterial && babylonMeshes) {
                             for (var _b = 0, babylonMeshes_1 = babylonMeshes; _b < babylonMeshes_1.length; _b++) {
                                 var babylonMesh = babylonMeshes_1[_b];
+                                // Ensure nonUniformScaling is set if necessary.
+                                babylonMesh.computeWorldMatrix(true);
                                 promises.push(babylonMaterial.forceCompilationAsync(babylonMesh));
                                 if (this.useClipPlane) {
                                     promises.push(babylonMaterial.forceCompilationAsync(babylonMesh, { clipPlane: true }));

dist/preview release/loaders/babylonjs.loaders.js

@@ -4099,15 +4099,15 @@ var BABYLON;
                     if (babylonMesh._delayInfo.indexOf(kind) === -1) {
                         babylonMesh._delayInfo.push(kind);
                     }
+                    if (attribute === "COLOR_0") {
+                        // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
+                        babylonMesh.hasVertexAlpha = true;
+                    }
                     var accessor = GLTFLoader._GetProperty(context + "/attributes/" + attribute, _this._gltf.accessors, attributes[attribute]);
                     promises.push(_this._loadAccessorAsync("#/accessors/" + accessor._index, accessor).then(function (data) {
                         var attributeData = GLTFLoader._ConvertToFloat32Array(context, accessor, data);
-                        if (attribute === "COLOR_0") {
-                            // Assume vertex color has alpha on the mesh. The alphaMode of the material controls whether the material should use alpha or not.
-                            babylonMesh.hasVertexAlpha = true;
-                            if (accessor.type === "VEC3") {
-                                attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
-                            }
+                        if (attribute === "COLOR_0" && accessor.type === "VEC3") {
+                            attributeData = GLTFLoader._ConvertVec3ToVec4(context, attributeData);
                         }
                         babylonVertexData.set(attributeData, kind);
                     }));
@@ -4965,6 +4965,8 @@ var BABYLON;
                         if (babylonMaterial && babylonMeshes) {
                             for (var _b = 0, babylonMeshes_1 = babylonMeshes; _b < babylonMeshes_1.length; _b++) {
                                 var babylonMesh = babylonMeshes_1[_b];
+                                // Ensure nonUniformScaling is set if necessary.
+                                babylonMesh.computeWorldMatrix(true);
                                 promises.push(babylonMaterial.forceCompilationAsync(babylonMesh));
                                 if (this.useClipPlane) {
                                     promises.push(babylonMaterial.forceCompilationAsync(babylonMesh, { clipPlane: true }));

dist/preview release/viewer/babylon.viewer.max.js

@@ -14977,7 +14977,7 @@ var BABYLON;
                 if (this._renderingCanvas) {
                     this._renderingCanvas.removeEventListener("focus", this._onCanvasFocus);
                     this._renderingCanvas.removeEventListener("blur", this._onCanvasBlur);
-                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasBlur);
+                    this._renderingCanvas.removeEventListener("pointerout", this._onCanvasPointerOut);
                     if (!this._doNotHandleContextLost) {
                         this._renderingCanvas.removeEventListener("webglcontextlost", this._onContextLost);
                         this._renderingCanvas.removeEventListener("webglcontextrestored", this._onContextRestored);
@@ -15013,6 +15013,7 @@ var BABYLON;
             this._currentBufferPointers = [];
             this._renderingCanvas = null;
             this._currentProgram = null;
+            this._bindedRenderFunction = null;
             this.onResizeObservable.clear();
             this.onCanvasBlurObservable.clear();
             this.onCanvasFocusObservable.clear();
@@ -18618,6 +18619,9 @@ var BABYLON;
             var _this = this;
             if (disposeMaterialAndTextures === void 0) { disposeMaterialAndTextures = false; }
             var index;
+            // Smart Array Retainers.
+            this.getScene().freeActiveMeshes();
+            this.getScene().freeRenderingGroups();
             // Action manager
             if (this.actionManager !== undefined && this.actionManager !== null) {
                 this.actionManager.dispose();
@@ -20892,13 +20896,19 @@ var BABYLON;
             }
         };
         RenderingManager.prototype.dispose = function () {
+            this.freeRenderingGroups();
+            this._renderingGroups.length = 0;
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        RenderingManager.prototype.freeRenderingGroups = function () {
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.dispose();
                 }
             }
-            this._renderingGroups.length = 0;
         };
         RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (this._renderingGroups[renderingGroupId] === undefined) {
@@ -24092,6 +24102,45 @@ var BABYLON;
                 }
             }
         };
+        /**
+         * Clear the processed materials smart array preventing retention point in material dispose.
+         */
+        Scene.prototype.freeProcessedMaterials = function () {
+            this._processedMaterials.dispose();
+        };
+        /**
+         * Clear the active meshes smart array preventing retention point in mesh dispose.
+         */
+        Scene.prototype.freeActiveMeshes = function () {
+            this._activeMeshes.dispose();
+            if (this.activeCamera && this.activeCamera._activeMeshes) {
+                this.activeCamera._activeMeshes.dispose();
+            }
+            if (this.activeCameras) {
+                for (var i = 0; i < this.activeCameras.length; i++) {
+                    var activeCamera = this.activeCameras[i];
+                    if (activeCamera && activeCamera._activeMeshes) {
+                        activeCamera._activeMeshes.dispose();
+                    }
+                }
+            }
+        };
+        /**
+         * Clear the info related to rendering groups preventing retention points during dispose.
+         */
+        Scene.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+            if (this.textures) {
+                for (var i = 0; i < this.textures.length; i++) {
+                    var texture = this.textures[i];
+                    if (texture && texture.isRenderTarget) {
+                        texture.freeRenderingGroups();
+                    }
+                }
+            }
+        };
         Scene.prototype._isInIntermediateRendering = function () {
             return this._intermediateRendering;
         };
@@ -31893,6 +31942,7 @@ var BABYLON;
         Material.prototype.dispose = function (forceDisposeEffect, forceDisposeTextures) {
             // Animations
             this.getScene().stopAnimation(this);
+            this.getScene().freeProcessedMaterials();
             // Remove from scene
             var index = this._scene.materials.indexOf(this);
             if (index >= 0) {
@@ -59085,6 +59135,14 @@ var BABYLON;
                 this._postProcessManager._rebuild();
             }
         };
+        /**
+         * Clear the info related to rendering groups preventing retention point in material dispose.
+         */
+        RenderTargetTexture.prototype.freeRenderingGroups = function () {
+            if (this._renderingManager) {
+                this._renderingManager.freeRenderingGroups();
+            }
+        };
         RenderTargetTexture._REFRESHRATE_RENDER_ONCE = 0;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYFRAME = 1;
         RenderTargetTexture._REFRESHRATE_RENDER_ONEVERYTWOFRAMES = 2;
@@ -60425,10 +60483,11 @@ var BABYLON;
 (function (BABYLON) {
     var PassPostProcess = /** @class */ (function (_super) {
         __extends(PassPostProcess, _super);
-        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function PassPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (camera === void 0) { camera = null; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            return _super.call(this, name, "pass", null, null, options, camera, samplingMode, engine, reusable, undefined, textureType, undefined, null, blockCompilation) || this;
         }
         return PassPostProcess;
     }(BABYLON.PostProcess));
@@ -69057,10 +69116,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType) {
+        function ChromaticAberrationPostProcess(name, screenWidth, screenHeight, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "chromaticAberration", ["chromatic_aberration", "screen_width", "screen_height", "direction", "radialIntensity", "centerPosition"], [], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * The amount of seperation of rgb channels (default: 0)
              */
@@ -69112,10 +69173,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType) {
+        function SharpenPostProcess(name, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "sharpen", ["sharpnessAmounts", "screenSize"], null, options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * How much of the original color should be applied. Setting this to 0 will display edge detection. (default: 1)
              */
@@ -69157,13 +69220,16 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines) {
+        function BlurPostProcess(name, /** The direction in which to blur the image. */ direction, kernel, options, camera, samplingMode, engine, reusable, textureType, defines, blockCompilation) {
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
             if (defines === void 0) { defines = ""; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, name, "kernelBlur", ["delta", "direction", "cameraMinMaxZ"], ["circleOfConfusionSampler"], options, camera, samplingMode, engine, reusable, null, textureType, "kernelBlur", { varyingCount: 0, depCount: 0 }, true) || this;
             _this.direction = direction;
+            _this.blockCompilation = blockCompilation;
             _this._packedFloat = false;
             _this._staticDefines = "";
             _this._staticDefines = defines;
@@ -69190,7 +69256,9 @@ var BABYLON;
                 v = Math.max(v, 1);
                 this._idealKernel = v;
                 this._kernel = this._nearestBestKernel(v);
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
@@ -69210,12 +69278,29 @@ var BABYLON;
                     return;
                 }
                 this._packedFloat = v;
-                this._updateParameters();
+                if (!this.blockCompilation) {
+                    this._updateParameters();
+                }
             },
             enumerable: true,
             configurable: true
         });
-        BlurPostProcess.prototype._updateParameters = function () {
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        BlurPostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            this._updateParameters(onCompiled, onError);
+        };
+        BlurPostProcess.prototype._updateParameters = function (onCompiled, onError) {
             // Generate sampling offsets and weights
             var N = this._kernel;
             var centerIndex = (N - 1) / 2;
@@ -69285,10 +69370,10 @@ var BABYLON;
             if (this.packedFloat) {
                 defines += "#define PACKEDFLOAT 1";
             }
-            this.updateEffect(defines, null, null, {
+            _super.prototype.updateEffect.call(this, defines, null, null, {
                 varyingCount: varyingCount,
                 depCount: depCount
-            });
+            }, onCompiled, onError);
         };
         /**
          * Best kernels are odd numbers that when divided by 2, their integer part is even, so 5, 9 or 13.
@@ -69369,12 +69454,14 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldBlurPostProcess(name, scene, direction, kernel, options, camera, circleOfConfusion, imageToBlur, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (imageToBlur === void 0) { imageToBlur = null; }
             if (samplingMode === void 0) { samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE; }
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n") || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, direction, kernel, options, camera, samplingMode = BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, reusable, textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT, "#define DOF 1\r\n", blockCompilation) || this;
             _this.direction = direction;
             _this.onApplyObservable.add(function (effect) {
                 if (imageToBlur != null) {
@@ -69414,10 +69501,13 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType) {
+        function DepthOfFieldMergePostProcess(name, original, circleOfConfusion, blurSteps, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, "#define BLUR_LEVEL " + blurSteps.length + "\n", textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "depthOfFieldMerge", [], ["circleOfConfusionSampler", "originalSampler", "blurStep1", "blurStep2"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, true) || this;
+            _this.blurSteps = blurSteps;
             _this.onApplyObservable.add(function (effect) {
                 effect.setTextureFromPostProcess("circleOfConfusionSampler", circleOfConfusion);
                 effect.setTextureFromPostProcess("originalSampler", original);
@@ -69425,8 +69515,26 @@ var BABYLON;
                     effect.setTextureFromPostProcess("blurStep" + (index + 1), step);
                 });
             });
+            if (!blockCompilation) {
+                _this.updateEffect();
+            }
             return _this;
         }
+        /**
+         * Updates the effect with the current post process compile time values and recompiles the shader.
+         * @param defines Define statements that should be added at the beginning of the shader. (default: null)
+         * @param uniforms Set of uniform variables that will be passed to the shader. (default: null)
+         * @param samplers Set of Texture2D variables that will be passed to the shader. (default: null)
+         * @param indexParameters The index parameters to be used for babylons include syntax "#include<kernelBlurVaryingDeclaration>[0..varyingCount]". (default: undefined) See usage in babylon.blurPostProcess.ts and kernelBlur.vertex.fx
+         * @param onCompiled Called when the shader has been compiled.
+         * @param onError Called if there is an error when compiling a shader.
+         */
+        DepthOfFieldMergePostProcess.prototype.updateEffect = function (defines, uniforms, samplers, indexParameters, onCompiled, onError) {
+            if (defines === void 0) { defines = null; }
+            if (uniforms === void 0) { uniforms = null; }
+            if (samplers === void 0) { samplers = null; }
+            _super.prototype.updateEffect.call(this, defines ? defines : "#define BLUR_LEVEL " + this.blurSteps.length + "\n", uniforms, samplers, indexParameters, onCompiled, onError);
+        };
         return DepthOfFieldMergePostProcess;
     }(BABYLON.PostProcess));
     BABYLON.DepthOfFieldMergePostProcess = DepthOfFieldMergePostProcess;
@@ -69452,10 +69560,12 @@ var BABYLON;
          * @param engine The engine which the post process will be applied. (default: current engine)
          * @param reusable If the post process can be reused on the same frame. (default: false)
          * @param textureType Type of textures used when performing the post process. (default: 0)
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType) {
+        function CircleOfConfusionPostProcess(name, depthTexture, options, camera, samplingMode, engine, reusable, textureType, blockCompilation) {
             if (textureType === void 0) { textureType = BABYLON.Engine.TEXTURETYPE_UNSIGNED_INT; }
-            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType) || this;
+            if (blockCompilation === void 0) { blockCompilation = false; }
+            var _this = _super.call(this, name, "circleOfConfusion", ["cameraMinMaxZ", "focusDistance", "cocPrecalculation"], ["depthSampler"], options, camera, samplingMode, engine, reusable, null, textureType, undefined, null, blockCompilation) || this;
             /**
              * Max lens size in scene units/1000 (eg. millimeter). Standard cameras are 50mm. (default: 50) The diamater of the resulting aperture can be computed by lensSize/fStop.
              */
@@ -69538,18 +69648,20 @@ var BABYLON;
          * @param scene The scene the effect belongs to.
          * @param depthTexture The depth texture of the scene to compute the circle of confusion.This must be set in order for this to function but may be set after initialization if needed.
          * @param pipelineTextureType The type of texture to be used when performing the post processing.
+         * @param blockCompilation If compilation of the shader should not be done in the constructor. The updateEffect method can be used to compile the shader at a later time. (default: false)
          */
-        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType) {
+        function DepthOfFieldEffect(scene, depthTexture, blurLevel, pipelineTextureType, blockCompilation) {
             if (blurLevel === void 0) { blurLevel = DepthOfFieldEffectBlurLevel.Low; }
             if (pipelineTextureType === void 0) { pipelineTextureType = 0; }
+            if (blockCompilation === void 0) { blockCompilation = false; }
             var _this = _super.call(this, scene.getEngine(), "depth of field", function () {
                 return _this._effects;
             }, true) || this;
             _this._effects = [];
             // Circle of confusion value for each pixel is used to determine how much to blur that pixel
-            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._circleOfConfusion = new BABYLON.CircleOfConfusionPostProcess("circleOfConfusion", depthTexture, 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             // Capture circle of confusion texture
-            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldPass = new BABYLON.PassPostProcess("depthOfFieldPass", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldPass.autoClear = false;
             // Create a pyramid of blurred images (eg. fullSize 1/4 blur, half size 1/2 blur, quarter size 3/4 blur, eith size 4/4 blur)
             // Blur the image but do not blur on sharp far to near distance changes to avoid bleeding artifacts 
@@ -69577,15 +69689,15 @@ var BABYLON;
             }
             var adjustedKernelSize = kernelSize / Math.pow(2, blurCount - 1);
             for (var i = 0; i < blurCount; i++) {
-                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurY = new BABYLON.DepthOfFieldBlurPostProcess("verticle blur", scene, new BABYLON.Vector2(0, 1.0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, i == 0 ? _this._circleOfConfusion : null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurY.autoClear = false;
-                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+                var blurX = new BABYLON.DepthOfFieldBlurPostProcess("horizontal blur", scene, new BABYLON.Vector2(1.0, 0), adjustedKernelSize, 1.0 / Math.pow(2, i), null, _this._depthOfFieldPass, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
                 blurX.autoClear = false;
                 _this._depthOfFieldBlurY.push(blurY);
                 _this._depthOfFieldBlurX.push(blurX);
             }
             // Merge blurred images with original image based on circleOfConfusion
-            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType);
+            _this._depthOfFieldMerge = new BABYLON.DepthOfFieldMergePostProcess("depthOfFieldMerge", _this._circleOfConfusion, _this._depthOfFieldPass, _this._depthOfFieldBlurY.slice(1), 1, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, pipelineTextureType, blockCompilation);
             _this._depthOfFieldMerge.autoClear = false;
             // Set all post processes on the effect.
             _this._effects = [_this._circleOfConfusion, _this._depthOfFieldPass];
@@ -69673,6 +69785,26 @@ var BABYLON;
             });
             this._depthOfFieldMerge.dispose(camera);
         };
+        /**
+         * Internal
+         */
+        DepthOfFieldEffect.prototype._updateEffects = function () {
+            for (var effect in this._effects) {
+                this._effects[effect].updateEffect();
+            }
+        };
+        /**
+         * Internal
+         * @returns if all the contained post processes are ready.
+         */
+        DepthOfFieldEffect.prototype._isReady = function () {
+            for (var effect in this._effects) {
+                if (!this._effects[effect].isReady()) {
+                    return false;
+                }
+            }
+            return true;
+        };
         return DepthOfFieldEffect;
     }(BABYLON.PostProcessRenderEffect));
     BABYLON.DepthOfFieldEffect = DepthOfFieldEffect;
@@ -69793,10 +69925,12 @@ var BABYLON;
             // Attach
             scene.postProcessRenderPipelineManager.addPipeline(_this);
             var engine = _this._scene.getEngine();
-            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            // Create post processes before hand so they can be modified before enabled.
+            // Block compilation flag is set to true to avoid compilation prior to use, these will be updated on first use in build pipeline.
+            _this.sharpen = new BABYLON.SharpenPostProcess("sharpen", 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._sharpenEffect = new BABYLON.PostProcessRenderEffect(engine, _this.SharpenPostProcessId, function () { return _this.sharpen; }, true);
-            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType);
-            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType);
+            _this.depthOfField = new BABYLON.DepthOfFieldEffect(_this._scene, null, _this._depthOfFieldBlurLevel, _this._defaultPipelineTextureType, true);
+            _this.chromaticAberration = new BABYLON.ChromaticAberrationPostProcess("ChromaticAberration", engine.getRenderWidth(), engine.getRenderHeight(), 1.0, null, BABYLON.Texture.BILINEAR_SAMPLINGMODE, engine, false, _this._defaultPipelineTextureType, true);
             _this._chromaticAberrationEffect = new BABYLON.PostProcessRenderEffect(engine, _this.ChromaticAberrationPostProcessId, function () { return _this.chromaticAberration; }, true);
             _this._buildPipeline();
             return _this;
@@ -70029,12 +70163,18 @@ var BABYLON;
             this._prevPostProcess = null;
             this._prevPrevPostProcess = null;
             if (this.sharpenEnabled) {
+                if (!this.sharpen.isReady()) {
+                    this.sharpen.updateEffect();
+                }
                 this.addEffect(this._sharpenEffect);
                 this._setAutoClearAndTextureSharing(this.sharpen);
             }
             if (this.depthOfFieldEnabled) {
                 var depthTexture = this._scene.enableDepthRenderer(this._cameras[0]).getDepthMap();
                 this.depthOfField.depthTexture = depthTexture;
+                if (!this.depthOfField._isReady()) {
+                    this.depthOfField._updateEffects();
+                }
                 this.addEffect(this.depthOfField);
                 this._setAutoClearAndTextureSharing(this.depthOfField._depthOfFieldMerge);
             }
@@ -70116,6 +70256,9 @@ var BABYLON;
                 this._setAutoClearAndTextureSharing(this.fxaa);
             }
             if (this.chromaticAberrationEnabled) {
+                if (!this.chromaticAberration.isReady()) {
+                    this.chromaticAberration.updateEffect();
+                }
                 this.addEffect(this._chromaticAberrationEffect);
                 this._setAutoClearAndTextureSharing(this.chromaticAberration);
             }