Nightly

dist/preview release/babylon.d.ts

@@ -592,56 +592,61 @@ declare module BABYLON {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -29556,6 +29561,7 @@ declare module BABYLON {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -30178,30 +30184,37 @@ declare module BABYLON {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module BABYLON {
@@ -30511,7 +30524,6 @@ declare module BABYLON {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -30542,11 +30554,19 @@ declare module BABYLON {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -30906,9 +30926,27 @@ declare module BABYLON {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -31128,6 +31166,20 @@ declare module BABYLON {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -31272,6 +31324,7 @@ declare module BABYLON {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -32371,6 +32424,41 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+}
+declare module BABYLON {
     /**
      * Defines the interface used by display changed events
      */
@@ -32696,10 +32784,6 @@ declare module BABYLON {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -32818,47 +32902,6 @@ declare module BABYLON {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */

dist/preview release/babylon.max.js

@@ -30657,6 +30657,137 @@ var SkeletonViewer = /** @class */ (function () {
 
 /***/ }),
 
+/***/ "./Engines/Extensions/engine.alpha.ts":
+/*!********************************************!*\
+  !*** ./Engines/Extensions/engine.alpha.ts ***!
+  \********************************************/
+/*! no exports provided */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../Engines/thinEngine */ "./Engines/thinEngine.ts");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../constants */ "./Engines/constants.ts");
+
+
+_Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__["ThinEngine"].prototype.setAlphaConstants = function (r, g, b, a) {
+    this._alphaState.setAlphaBlendConstants(r, g, b, a);
+};
+_Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__["ThinEngine"].prototype.setAlphaMode = function (mode, noDepthWriteChange) {
+    if (noDepthWriteChange === void 0) { noDepthWriteChange = false; }
+    if (this._alphaMode === mode) {
+        return;
+    }
+    switch (mode) {
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_DISABLE:
+            this._alphaState.alphaBlend = false;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_PREMULTIPLIED:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_PREMULTIPLIED_PORTERDUFF:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_COMBINE:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_ONEONE:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ZERO, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_ADD:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE, this._gl.ZERO, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_SUBTRACT:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ZERO, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_MULTIPLY:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_COLOR, this._gl.ZERO, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_MAXIMIZED:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_INTERPOLATE:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.CONSTANT_COLOR, this._gl.ONE_MINUS_CONSTANT_COLOR, this._gl.CONSTANT_ALPHA, this._gl.ONE_MINUS_CONSTANT_ALPHA);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_SCREENMODE:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_ONEONE_ONEONE:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ONE, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_ALPHATOCOLOR:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_ALPHA, this._gl.ONE, this._gl.ZERO, this._gl.ZERO);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_REVERSEONEMINUS:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE_MINUS_DST_COLOR, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE_MINUS_DST_ALPHA, this._gl.ONE_MINUS_SRC_ALPHA);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_SRC_DSTONEMINUSSRCALPHA:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_ONEONE_ONEZERO:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ONE, this._gl.ZERO);
+            this._alphaState.alphaBlend = true;
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EXCLUSION:
+            this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE_MINUS_DST_COLOR, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ZERO, this._gl.ONE);
+            this._alphaState.alphaBlend = true;
+            break;
+    }
+    if (!noDepthWriteChange) {
+        this.depthCullingState.depthMask = (mode === _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_DISABLE);
+    }
+    this._alphaMode = mode;
+};
+_Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__["ThinEngine"].prototype.getAlphaMode = function () {
+    return this._alphaMode;
+};
+_Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__["ThinEngine"].prototype.setAlphaEquation = function (equation) {
+    if (this._alphaEquation === equation) {
+        return;
+    }
+    switch (equation) {
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_ADD:
+            this._alphaState.setAlphaEquationParameters(this._gl.FUNC_ADD, this._gl.FUNC_ADD);
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_SUBSTRACT:
+            this._alphaState.setAlphaEquationParameters(this._gl.FUNC_SUBTRACT, this._gl.FUNC_SUBTRACT);
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_REVERSE_SUBTRACT:
+            this._alphaState.setAlphaEquationParameters(this._gl.FUNC_REVERSE_SUBTRACT, this._gl.FUNC_REVERSE_SUBTRACT);
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_MAX:
+            this._alphaState.setAlphaEquationParameters(this._gl.MAX, this._gl.MAX);
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_MIN:
+            this._alphaState.setAlphaEquationParameters(this._gl.MIN, this._gl.MIN);
+            break;
+        case _constants__WEBPACK_IMPORTED_MODULE_1__["Constants"].ALPHA_EQUATION_DARKEN:
+            this._alphaState.setAlphaEquationParameters(this._gl.MIN, this._gl.FUNC_ADD);
+            break;
+    }
+    this._alphaEquation = equation;
+};
+_Engines_thinEngine__WEBPACK_IMPORTED_MODULE_0__["ThinEngine"].prototype.getAlphaEquation = function () {
+    return this._alphaEquation;
+};
+
+
+/***/ }),
+
 /***/ "./Engines/Extensions/engine.cubeTexture.ts":
 /*!**************************************************!*\
   !*** ./Engines/Extensions/engine.cubeTexture.ts ***!
@@ -31969,8 +32100,8 @@ _thinEngine__WEBPACK_IMPORTED_MODULE_5__["ThinEngine"].prototype.createRenderTar
     var fullOptions = new _Materials_Textures_renderTargetCreationOptions__WEBPACK_IMPORTED_MODULE_3__["RenderTargetCreationOptions"]();
     if (options !== undefined && typeof options === "object") {
         fullOptions.generateMipMaps = options.generateMipMaps;
-        fullOptions.generateDepthBuffer = options.generateDepthBuffer === undefined ? true : options.generateDepthBuffer;
-        fullOptions.generateStencilBuffer = fullOptions.generateDepthBuffer && options.generateStencilBuffer;
+        fullOptions.generateDepthBuffer = !!options.generateDepthBuffer;
+        fullOptions.generateStencilBuffer = !!options.generateStencilBuffer;
         fullOptions.type = options.type === undefined ? _constants__WEBPACK_IMPORTED_MODULE_4__["Constants"].TEXTURETYPE_UNSIGNED_INT : options.type;
         fullOptions.samplingMode = options.samplingMode === undefined ? _constants__WEBPACK_IMPORTED_MODULE_4__["Constants"].TEXTURE_TRILINEAR_SAMPLINGMODE : options.samplingMode;
         fullOptions.format = options.format === undefined ? _constants__WEBPACK_IMPORTED_MODULE_4__["Constants"].TEXTUREFORMAT_RGBA : options.format;
@@ -33608,56 +33739,61 @@ var Constants = /** @class */ (function () {
     }
     /** Defines that alpha blending is disabled */
     Constants.ALPHA_DISABLE = 0;
-    /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+    /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
     Constants.ALPHA_ADD = 1;
-    /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+    /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
     Constants.ALPHA_COMBINE = 2;
-    /** Defines that alpha blending to DEST - SRC * DEST */
+    /** Defines that alpha blending is DEST - SRC * DEST */
     Constants.ALPHA_SUBTRACT = 3;
-    /** Defines that alpha blending to SRC * DEST */
+    /** Defines that alpha blending is SRC * DEST */
     Constants.ALPHA_MULTIPLY = 4;
-    /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+    /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
     Constants.ALPHA_MAXIMIZED = 5;
-    /** Defines that alpha blending to SRC + DEST */
+    /** Defines that alpha blending is SRC + DEST */
     Constants.ALPHA_ONEONE = 6;
-    /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+    /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
     Constants.ALPHA_PREMULTIPLIED = 7;
     /**
-     * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+     * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
      * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
      */
     Constants.ALPHA_PREMULTIPLIED_PORTERDUFF = 8;
-    /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+    /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
     Constants.ALPHA_INTERPOLATE = 9;
     /**
-     * Defines that alpha blending to SRC + (1 - SRC) * DEST
+     * Defines that alpha blending is SRC + (1 - SRC) * DEST
      * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
      */
     Constants.ALPHA_SCREENMODE = 10;
     /**
-     * Defines that alpha blending to SRC + DST
+     * Defines that alpha blending is SRC + DST
      * Alpha will be set to SRC ALPHA + DST ALPHA
      */
     Constants.ALPHA_ONEONE_ONEONE = 11;
     /**
-     * Defines that alpha blending to SRC * DST ALPHA + DST
+     * Defines that alpha blending is SRC * DST ALPHA + DST
      * Alpha will be set to 0
      */
     Constants.ALPHA_ALPHATOCOLOR = 12;
     /**
-     * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+     * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
      */
     Constants.ALPHA_REVERSEONEMINUS = 13;
     /**
-     * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+     * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
      * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
      */
     Constants.ALPHA_SRC_DSTONEMINUSSRCALPHA = 14;
     /**
-     * Defines that alpha blending to SRC + DST
+     * Defines that alpha blending is SRC + DST
      * Alpha will be set to SRC ALPHA
      */
     Constants.ALPHA_ONEONE_ONEZERO = 15;
+    /**
+     * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+     * Alpha will be set to DST ALPHA
+     */
+    Constants.ALPHA_EXCLUSION = 16;
     /** Defines that alpha blending equation a SUM */
     Constants.ALPHA_EQUATION_ADD = 0;
     /** Defines that alpha blending equation a SUBSTRACTION */
@@ -34080,6 +34216,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _Misc_perfCounter__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Misc/perfCounter */ "./Misc/perfCounter.ts");
 /* harmony import */ var _Meshes_WebGL_webGLDataBuffer__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../Meshes/WebGL/webGLDataBuffer */ "./Meshes/WebGL/webGLDataBuffer.ts");
 /* harmony import */ var _Misc_logger__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../Misc/logger */ "./Misc/logger.ts");
+/* harmony import */ var _Extensions_engine_alpha__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Extensions/engine.alpha */ "./Engines/Extensions/engine.alpha.ts");
+
 
 
 
@@ -34168,10 +34306,6 @@ var Engine = /** @class */ (function (_super) {
          * Observable raised when the engine has jsut compiled a shader
          */
         _this.onAfterShaderCompilationObservable = new _Misc_observable__WEBPACK_IMPORTED_MODULE_1__["Observable"]();
-        /** @hidden */
-        _this._alphaMode = _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ADD;
-        /** @hidden */
-        _this._alphaEquation = _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_DISABLE;
         // Deterministic lockstepMaxSteps
         _this._deterministicLockstep = false;
         _this._lockstepMaxSteps = 4;
@@ -34515,157 +34649,6 @@ var Engine = /** @class */ (function (_super) {
         this._depthCullingState.depthMask = enable;
     };
     /**
-     * Enable or disable color writing
-     * @param enable defines the state to set
-     */
-    Engine.prototype.setColorWrite = function (enable) {
-        this._gl.colorMask(enable, enable, enable, enable);
-        this._colorWrite = enable;
-    };
-    /**
-     * Gets a boolean indicating if color writing is enabled
-     * @returns the current color writing state
-     */
-    Engine.prototype.getColorWrite = function () {
-        return this._colorWrite;
-    };
-    /**
-     * Sets alpha constants used by some alpha blending modes
-     * @param r defines the red component
-     * @param g defines the green component
-     * @param b defines the blue component
-     * @param a defines the alpha component
-     */
-    Engine.prototype.setAlphaConstants = function (r, g, b, a) {
-        this._alphaState.setAlphaBlendConstants(r, g, b, a);
-    };
-    /**
-     * Sets the current alpha mode
-     * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-     * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-     * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-     */
-    Engine.prototype.setAlphaMode = function (mode, noDepthWriteChange) {
-        if (noDepthWriteChange === void 0) { noDepthWriteChange = false; }
-        if (this._alphaMode === mode) {
-            return;
-        }
-        switch (mode) {
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_DISABLE:
-                this._alphaState.alphaBlend = false;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_PREMULTIPLIED:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_PREMULTIPLIED_PORTERDUFF:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_COMBINE:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ONEONE:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ZERO, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ADD:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE, this._gl.ZERO, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_SUBTRACT:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ZERO, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_MULTIPLY:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_COLOR, this._gl.ZERO, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_MAXIMIZED:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.SRC_ALPHA, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_INTERPOLATE:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.CONSTANT_COLOR, this._gl.ONE_MINUS_CONSTANT_COLOR, this._gl.CONSTANT_ALPHA, this._gl.ONE_MINUS_CONSTANT_ALPHA);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_SCREENMODE:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ONEONE_ONEONE:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ONE, this._gl.ONE);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ALPHATOCOLOR:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.DST_ALPHA, this._gl.ONE, this._gl.ZERO, this._gl.ZERO);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_REVERSEONEMINUS:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE_MINUS_DST_COLOR, this._gl.ONE_MINUS_SRC_COLOR, this._gl.ONE_MINUS_DST_ALPHA, this._gl.ONE_MINUS_SRC_ALPHA);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_SRC_DSTONEMINUSSRCALPHA:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA, this._gl.ONE, this._gl.ONE_MINUS_SRC_ALPHA);
-                this._alphaState.alphaBlend = true;
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_ONEONE_ONEZERO:
-                this._alphaState.setAlphaBlendFunctionParameters(this._gl.ONE, this._gl.ONE, this._gl.ONE, this._gl.ZERO);
-                this._alphaState.alphaBlend = true;
-                break;
-        }
-        if (!noDepthWriteChange) {
-            this.setDepthWrite(mode === _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_DISABLE);
-        }
-        this._alphaMode = mode;
-    };
-    /**
-     * Gets the current alpha mode
-     * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-     * @returns the current alpha mode
-     */
-    Engine.prototype.getAlphaMode = function () {
-        return this._alphaMode;
-    };
-    /**
-     * Sets the current alpha equation
-     * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-     */
-    Engine.prototype.setAlphaEquation = function (equation) {
-        if (this._alphaEquation === equation) {
-            return;
-        }
-        switch (equation) {
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_ADD:
-                this._alphaState.setAlphaEquationParameters(this._gl.FUNC_ADD, this._gl.FUNC_ADD);
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_SUBSTRACT:
-                this._alphaState.setAlphaEquationParameters(this._gl.FUNC_SUBTRACT, this._gl.FUNC_SUBTRACT);
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_REVERSE_SUBTRACT:
-                this._alphaState.setAlphaEquationParameters(this._gl.FUNC_REVERSE_SUBTRACT, this._gl.FUNC_REVERSE_SUBTRACT);
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_MAX:
-                this._alphaState.setAlphaEquationParameters(this._gl.MAX, this._gl.MAX);
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_MIN:
-                this._alphaState.setAlphaEquationParameters(this._gl.MIN, this._gl.MIN);
-                break;
-            case _constants__WEBPACK_IMPORTED_MODULE_6__["Constants"].ALPHA_EQUATION_DARKEN:
-                this._alphaState.setAlphaEquationParameters(this._gl.MIN, this._gl.FUNC_ADD);
-                break;
-        }
-        this._alphaEquation = equation;
-    };
-    /**
-     * Gets the current alpha equation.
-     * @returns the current alpha equation
-     */
-    Engine.prototype.getAlphaEquation = function () {
-        return this._alphaEquation;
-    };
-    /**
      * Gets a boolean indicating if stencil buffer is enabled
      * @returns the current stencil buffer state
      */
@@ -38176,7 +38159,6 @@ var ThinEngine = /** @class */ (function () {
         this._badOS = false;
         /** @hidden */
         this._badDesktopOS = false;
-        this._colorWrite = true;
         this._renderingQueueLaunched = false;
         this._activeRenderLoops = new Array();
         // Lost context
@@ -38197,11 +38179,19 @@ var ThinEngine = /** @class */ (function () {
         this.disableVertexArrayObjects = false;
         // States
         /** @hidden */
+        this._colorWrite = true;
+        /** @hidden */
+        this._colorWriteChanged = true;
+        /** @hidden */
         this._depthCullingState = new _States_depthCullingState__WEBPACK_IMPORTED_MODULE_4__["DepthCullingState"]();
         /** @hidden */
         this._stencilState = new _States_stencilState__WEBPACK_IMPORTED_MODULE_5__["StencilState"]();
         /** @hidden */
         this._alphaState = new _States_alphaCullingState__WEBPACK_IMPORTED_MODULE_6__["AlphaState"]();
+        /** @hidden */
+        this._alphaMode = _constants__WEBPACK_IMPORTED_MODULE_7__["Constants"].ALPHA_ADD;
+        /** @hidden */
+        this._alphaEquation = _constants__WEBPACK_IMPORTED_MODULE_7__["Constants"].ALPHA_DISABLE;
         // Cache
         /** @hidden */
         this._internalTexturesCache = new Array();
@@ -38242,6 +38232,19 @@ var ThinEngine = /** @class */ (function () {
          * value would be set.
          */
         this.enableUnpackFlipYCached = true;
+        this._getDepthStencilBuffer = function (width, height, samples, internalFormat, msInternalFormat, attachment) {
+            var gl = _this._gl;
+            var depthStencilBuffer = gl.createRenderbuffer();
+            gl.bindRenderbuffer(gl.RENDERBUFFER, depthStencilBuffer);
+            if (samples > 1) {
+                gl.renderbufferStorageMultisample(gl.RENDERBUFFER, samples, msInternalFormat, width, height);
+            }
+            else {
+                gl.renderbufferStorage(gl.RENDERBUFFER, internalFormat, width, height);
+            }
+            gl.framebufferRenderbuffer(gl.FRAMEBUFFER, attachment, gl.RENDERBUFFER, depthStencilBuffer);
+            return depthStencilBuffer;
+        };
         this._boundUniforms = {};
         var canvas = null;
         if (!canvasOrContext) {
@@ -39597,22 +39600,7 @@ var ThinEngine = /** @class */ (function () {
             this._gl.bufferSubData(this._gl.ARRAY_BUFFER, 0, data);
         }
         if (offsetLocations[0].index !== undefined) {
-            var stride = 0;
-            for (var i = 0; i < offsetLocations.length; i++) {
-                var ai = offsetLocations[i];
-                stride += ai.attributeSize * 4;
-            }
-            for (var i = 0; i < offsetLocations.length; i++) {
-                var ai = offsetLocations[i];
-                if (!this._vertexAttribArraysEnabled[ai.index]) {
-                    this._gl.enableVertexAttribArray(ai.index);
-                    this._vertexAttribArraysEnabled[ai.index] = true;
-                }
-                this._vertexAttribPointer(instancesBuffer, ai.index, ai.attributeSize, ai.attributeType || this._gl.FLOAT, ai.normalized || false, stride, ai.offset);
-                this._gl.vertexAttribDivisor(ai.index, 1);
-                this._currentInstanceLocations.push(ai.index);
-                this._currentInstanceBuffers.push(instancesBuffer);
-            }
+            this.bindInstancesBuffer(instancesBuffer, offsetLocations, true);
         }
         else {
             for (var index = 0; index < 4; index++) {
@@ -39629,12 +39617,73 @@ var ThinEngine = /** @class */ (function () {
         }
     };
     /**
-     * Apply all cached states (depth, culling, stencil and alpha)
+     * Bind the content of a webGL buffer used with instanciation
+     * @param instancesBuffer defines the webGL buffer to bind
+     * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+     * @param computeStride defines Wether to compute the strides from the info or use the default 0
      */
-    ThinEngine.prototype.applyStates = function () {
-        this._depthCullingState.apply(this._gl);
-        this._stencilState.apply(this._gl);
-        this._alphaState.apply(this._gl);
+    ThinEngine.prototype.bindInstancesBuffer = function (instancesBuffer, attributesInfo, computeStride) {
+        if (computeStride === void 0) { computeStride = true; }
+        this.bindArrayBuffer(instancesBuffer);
+        var stride = 0;
+        if (computeStride) {
+            for (var i = 0; i < attributesInfo.length; i++) {
+                var ai = attributesInfo[i];
+                stride += ai.attributeSize * 4;
+            }
+        }
+        for (var i = 0; i < attributesInfo.length; i++) {
+            var ai = attributesInfo[i];
+            if (ai.index === undefined) {
+                ai.index = this._currentEffect.getAttributeLocationByName(ai.attributeName);
+            }
+            if (!this._vertexAttribArraysEnabled[ai.index]) {
+                this._gl.enableVertexAttribArray(ai.index);
+                this._vertexAttribArraysEnabled[ai.index] = true;
+            }
+            this._vertexAttribPointer(instancesBuffer, ai.index, ai.attributeSize, ai.attributeType || this._gl.FLOAT, ai.normalized || false, stride, ai.offset);
+            this._gl.vertexAttribDivisor(ai.index, ai.divisor === undefined ? 1 : ai.divisor);
+            this._currentInstanceLocations.push(ai.index);
+            this._currentInstanceBuffers.push(instancesBuffer);
+        }
+    };
+    /**
+     * Disable the instance attribute corresponding to the name in parameter
+     * @param name defines the name of the attribute to disable
+     */
+    ThinEngine.prototype.disableInstanceAttributeByName = function (name) {
+        if (!this._currentEffect) {
+            return;
+        }
+        var attributeLocation = this._currentEffect.getAttributeLocationByName(name);
+        this.disableInstanceAttribute(attributeLocation);
+    };
+    /**
+     * Disable the instance attribute corresponding to the location in parameter
+     * @param attributeLocation defines the attribute location of the attribute to disable
+     */
+    ThinEngine.prototype.disableInstanceAttribute = function (attributeLocation) {
+        var shouldClean = false;
+        var index;
+        while ((index = this._currentInstanceLocations.indexOf(attributeLocation)) !== -1) {
+            this._currentInstanceLocations.splice(index, 1);
+            this._currentInstanceBuffers.splice(index, 1);
+            shouldClean = true;
+            index = this._currentInstanceLocations.indexOf(attributeLocation);
+        }
+        if (shouldClean) {
+            this._gl.vertexAttribDivisor(attributeLocation, 0);
+            this.disableAttributeByIndex(attributeLocation);
+        }
+    };
+    /**
+     * Disable the attribute corresponding to the location in parameter
+     * @param attributeLocation defines the attribute location of the attribute to disable
+     */
+    ThinEngine.prototype.disableAttributeByIndex = function (attributeLocation) {
+        this._gl.disableVertexAttribArray(attributeLocation);
+        this._vertexAttribArraysEnabled[attributeLocation] = false;
+        this._currentBufferPointers[attributeLocation].active = false;
     };
     /**
      * Send a draw order
@@ -39934,7 +39983,16 @@ var ThinEngine = /** @class */ (function () {
             action();
             return;
         }
-        webGLPipelineContext.onCompiled = action;
+        var oldHandler = webGLPipelineContext.onCompiled;
+        if (oldHandler) {
+            webGLPipelineContext.onCompiled = function () {
+                oldHandler();
+                action();
+            };
+        }
+        else {
+            webGLPipelineContext.onCompiled = action;
+        }
     };
     /**
      * Gets the list of webGL uniform locations associated with a specific program based on a list of uniform names
@@ -40169,8 +40227,38 @@ var ThinEngine = /** @class */ (function () {
         }
         this._gl.uniform4f(uniform, x, y, z, w);
     };
+    // States
+    /**
+     * Apply all cached states (depth, culling, stencil and alpha)
+     */
+    ThinEngine.prototype.applyStates = function () {
+        this._depthCullingState.apply(this._gl);
+        this._stencilState.apply(this._gl);
+        this._alphaState.apply(this._gl);
+        if (this._colorWriteChanged) {
+            this._colorWriteChanged = false;
+            var enable = this._colorWrite;
+            this._gl.colorMask(enable, enable, enable, enable);
+        }
+    };
+    /**
+     * Enable or disable color writing
+     * @param enable defines the state to set
+     */
+    ThinEngine.prototype.setColorWrite = function (enable) {
+        if (enable !== this._colorWrite) {
+            this._colorWriteChanged = true;
+            this._colorWrite = enable;
+        }
+    };
+    /**
+     * Gets a boolean indicating if color writing is enabled
+     * @returns the current color writing state
+     */
+    ThinEngine.prototype.getColorWrite = function () {
+        return this._colorWrite;
+    };
     Object.defineProperty(ThinEngine.prototype, "depthCullingState", {
-        // States
         /**
          * Gets the depth culling state manager
          */
@@ -40229,6 +40317,8 @@ var ThinEngine = /** @class */ (function () {
             this._depthCullingState.reset();
             this._depthCullingState.depthFunc = this._gl.LEQUAL;
             this._alphaState.reset();
+            this._colorWrite = true;
+            this._colorWriteChanged = true;
             this._unpackFlipYCached = null;
             this._gl.pixelStorei(this._gl.UNPACK_COLORSPACE_CONVERSION_WEBGL, this._gl.NONE);
             this._gl.pixelStorei(this._gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, 0);
@@ -40775,32 +40865,18 @@ var ThinEngine = /** @class */ (function () {
     /** @hidden */
     ThinEngine.prototype._setupFramebufferDepthAttachments = function (generateStencilBuffer, generateDepthBuffer, width, height, samples) {
         if (samples === void 0) { samples = 1; }
-        var depthStencilBuffer = null;
         var gl = this._gl;
         // Create the depth/stencil buffer
-        if (generateStencilBuffer) {
-            depthStencilBuffer = gl.createRenderbuffer();
-            gl.bindRenderbuffer(gl.RENDERBUFFER, depthStencilBuffer);
-            if (samples > 1) {
-                gl.renderbufferStorageMultisample(gl.RENDERBUFFER, samples, gl.DEPTH24_STENCIL8, width, height);
-            }
-            else {
-                gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width, height);
-            }
-            gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, depthStencilBuffer);
+        if (generateStencilBuffer && generateDepthBuffer) {
+            return this._getDepthStencilBuffer(width, height, samples, gl.DEPTH_STENCIL, gl.DEPTH24_STENCIL8, gl.DEPTH_STENCIL_ATTACHMENT);
         }
-        else if (generateDepthBuffer) {
-            depthStencilBuffer = gl.createRenderbuffer();
-            gl.bindRenderbuffer(gl.RENDERBUFFER, depthStencilBuffer);
-            if (samples > 1) {
-                gl.renderbufferStorageMultisample(gl.RENDERBUFFER, samples, gl.DEPTH_COMPONENT16, width, height);
-            }
-            else {
-                gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, width, height);
-            }
-            gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthStencilBuffer);
+        if (generateDepthBuffer) {
+            return this._getDepthStencilBuffer(width, height, samples, gl.DEPTH_COMPONENT16, gl.DEPTH_COMPONENT16, gl.DEPTH_ATTACHMENT);
+        }
+        if (generateStencilBuffer) {
+            return this._getDepthStencilBuffer(width, height, samples, gl.STENCIL_INDEX8, gl.STENCIL_INDEX8, gl.STENCIL_ATTACHMENT);
         }
-        return depthStencilBuffer;
+        return null;
     };
     /** @hidden */
     ThinEngine.prototype._releaseFramebufferObjects = function (texture) {
@@ -41141,9 +41217,7 @@ var ThinEngine = /** @class */ (function () {
         if (this._mustWipeVertexAttributes) {
             this._mustWipeVertexAttributes = false;
             for (var i = 0; i < this._caps.maxVertexAttribs; i++) {
-                this._gl.disableVertexAttribArray(i);
-                this._vertexAttribArraysEnabled[i] = false;
-                this._currentBufferPointers[i].active = false;
+                this.disableAttributeByIndex(i);
             }
             return;
         }
@@ -41151,9 +41225,7 @@ var ThinEngine = /** @class */ (function () {
             if (i >= this._caps.maxVertexAttribs || !this._vertexAttribArraysEnabled[i]) {
                 continue;
             }
-            this._gl.disableVertexAttribArray(i);
-            this._vertexAttribArraysEnabled[i] = false;
-            this._currentBufferPointers[i].active = false;
+            this.disableAttributeByIndex(i);
         }
     };
     /**
@@ -87434,6 +87506,7 @@ var Effect = /** @class */ (function () {
             this._indexParameters = indexParameters;
             this._fallbacks = fallbacks;
         }
+        this._attributeLocationByName = {};
         this.uniqueId = Effect._uniqueIdSeed++;
         var vertexSource;
         var fragmentSource;
@@ -87577,8 +87650,7 @@ var Effect = /** @class */ (function () {
      * @returns the attribute location.
      */
     Effect.prototype.getAttributeLocationByName = function (name) {
-        var index = this._attributesNames.indexOf(name);
-        return this._attributes[index];
+        return this._attributeLocationByName[name];
     };
     /**
      * The number of attributes.
@@ -87758,6 +87830,12 @@ var Effect = /** @class */ (function () {
                     _this._uniforms[_this._uniformsNames[index]] = uniform;
                 });
                 _this._attributes = engine_1.getAttributes(_this._pipelineContext, attributesNames);
+                if (attributesNames) {
+                    for (var i = 0; i < attributesNames.length; i++) {
+                        var name_1 = attributesNames[i];
+                        _this._attributeLocationByName[name_1] = _this._attributes[i];
+                    }
+                }
                 var index;
                 for (index = 0; index < _this._samplerList.length; index++) {
                     var sampler = _this.getUniform(_this._samplerList[index]);

dist/preview release/babylon.module.d.ts

@@ -597,56 +597,61 @@ declare module "babylonjs/Engines/constants" {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -30474,6 +30479,7 @@ declare module "babylonjs/Materials/effect" {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -31098,30 +31104,37 @@ declare module "babylonjs/Engines/instancingAttributeInfo" {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module "babylonjs/Engines/Extensions/engine.videoTexture" {
@@ -31462,7 +31475,6 @@ declare module "babylonjs/Engines/thinEngine" {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -31493,11 +31505,19 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -31857,9 +31877,27 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -32079,6 +32117,20 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -32223,6 +32275,7 @@ declare module "babylonjs/Engines/thinEngine" {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -33333,6 +33386,43 @@ declare module "babylonjs/Misc/perfCounter" {
         private _lastSecValueCount;
     }
 }
+declare module "babylonjs/Engines/Extensions/engine.alpha" {
+    module "babylonjs/Engines/thinEngine" {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+    }
+}
 declare module "babylonjs/Engines/engine" {
     import { Observable } from "babylonjs/Misc/observable";
     import { Nullable, IndicesArray, DataArray } from "babylonjs/types";
@@ -33350,6 +33440,7 @@ declare module "babylonjs/Engines/engine" {
     import { PerformanceMonitor } from "babylonjs/Misc/performanceMonitor";
     import { DataBuffer } from "babylonjs/Meshes/dataBuffer";
     import { PerfCounter } from "babylonjs/Misc/perfCounter";
+    import "babylonjs/Engines/Extensions/engine.alpha";
     import { Material } from "babylonjs/Materials/material";
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     /**
@@ -33677,10 +33768,6 @@ declare module "babylonjs/Engines/engine" {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -33799,47 +33886,6 @@ declare module "babylonjs/Engines/engine" {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */
@@ -47227,6 +47273,7 @@ declare module "babylonjs/Engines/Extensions/engine.views" {
     }
 }
 declare module "babylonjs/Engines/Extensions/index" {
+    export * from "babylonjs/Engines/Extensions/engine.alpha";
     export * from "babylonjs/Engines/Extensions/engine.occlusionQuery";
     export * from "babylonjs/Engines/Extensions/engine.transformFeedback";
     export * from "babylonjs/Engines/Extensions/engine.multiview";
@@ -69923,56 +69970,61 @@ declare module BABYLON {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -98887,6 +98939,7 @@ declare module BABYLON {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -99509,30 +99562,37 @@ declare module BABYLON {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module BABYLON {
@@ -99842,7 +99902,6 @@ declare module BABYLON {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -99873,11 +99932,19 @@ declare module BABYLON {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -100237,9 +100304,27 @@ declare module BABYLON {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -100459,6 +100544,20 @@ declare module BABYLON {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -100603,6 +100702,7 @@ declare module BABYLON {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -101702,6 +101802,41 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+}
+declare module BABYLON {
     /**
      * Defines the interface used by display changed events
      */
@@ -102027,10 +102162,6 @@ declare module BABYLON {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -102149,47 +102280,6 @@ declare module BABYLON {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */

dist/preview release/documentation.d.ts

@@ -592,56 +592,61 @@ declare module BABYLON {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -29556,6 +29561,7 @@ declare module BABYLON {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -30178,30 +30184,37 @@ declare module BABYLON {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module BABYLON {
@@ -30511,7 +30524,6 @@ declare module BABYLON {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -30542,11 +30554,19 @@ declare module BABYLON {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -30906,9 +30926,27 @@ declare module BABYLON {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -31128,6 +31166,20 @@ declare module BABYLON {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -31272,6 +31324,7 @@ declare module BABYLON {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -32371,6 +32424,41 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+}
+declare module BABYLON {
     /**
      * Defines the interface used by display changed events
      */
@@ -32696,10 +32784,6 @@ declare module BABYLON {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -32818,47 +32902,6 @@ declare module BABYLON {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */

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

@@ -51768,20 +51768,20 @@ var NodeListComponent = /** @class */ (function (_super) {
         // Block types used to create the menu from
         var allBlocks = {
             Animation: ["BonesBlock", "MorphTargetsBlock"],
-            Basic_Math: ["AddBlock", "DivideBlock", "MultiplyBlock", "ScaleBlock", "SubtractBlock", "OneMinusBlock", "MaxBlock", "MinBlock", "LengthBlock", "DistanceBlock", "NegateBlock", "RandomNumberBlock", "ReciprocalBlock"],
             Color_Management: ["ReplaceColorBlock", "PosterizeBlock", "GradientBlock", "DesaturateBlock"],
             Conversion_Blocks: ["ColorMergerBlock", "ColorSplitterBlock", "VectorMergerBlock", "VectorSplitterBlock"],
             Inputs: ["Float", "Vector2", "Vector3", "Vector4", "Color3", "Color4", "TextureBlock", "ReflectionTextureBlock", "TimeBlock", "DeltaTimeBlock"],
             Interpolation: ["LerpBlock", "StepBlock", "SmoothStepBlock", "NLerpBlock"],
+            Math__Standard: ["AddBlock", "DivideBlock", "MaxBlock", "MinBlock", "MultiplyBlock", "NegateBlock", "OneMinusBlock", "ReciprocalBlock", "ScaleBlock", "SignBlock", "SqrtBlock", "SubtractBlock"],
+            Math__Scientific: ["AbsBlock", "ArcCosBlock", "ArcSinBlock", "ArcTanBlock", "ArcTan2Block", "CosBlock", "DegreesToRadiansBlock", "ExpBlock", "Exp2Block", "FractBlock", "LogBlock", "PowBlock", "RadiansToDegreesBlock", "SawToothWaveBlock", "SinBlock", "SquareWaveBlock", "TanBlock", "TriangleWaveBlock"],
+            Math__Vector: ["CrossBlock", "DerivativeBlock", "DistanceBlock", "DotBlock", "FresnelBlock", "LengthBlock", "ReflectBlock", "RefractBlock", "Rotate2dBlock", "TransformBlock",],
             Matrices: ["Matrix", "WorldMatrixBlock", "WorldViewMatrixBlock", "WorldViewProjectionMatrixBlock", "ViewMatrixBlock", "ViewProjectionMatrixBlock", "ProjectionMatrixBlock"],
-            Mesh: ["InstancesBlock", "PositionBlock", "UVBlock", "ColorBlock", "NormalBlock", "TangentBlock", "MatrixIndicesBlock", "MatrixWeightsBlock", "WorldPositionBlock", "WorldNormalBlock", "FrontFacingBlock"],
-            Noises: ["SimplexPerlin3DBlock", "WorleyNoise3DBlock"],
+            Mesh: ["InstancesBlock", "PositionBlock", "UVBlock", "ColorBlock", "NormalBlock", "PerturbNormalBlock", "NormalBlendBlock", "TangentBlock", "MatrixIndicesBlock", "MatrixWeightsBlock", "WorldPositionBlock", "WorldNormalBlock", "FrontFacingBlock"],
+            Noises: ["RandomNumberBlock", "SimplexPerlin3DBlock", "WorleyNoise3DBlock"],
             Output_Blocks: ["VertexOutputBlock", "FragmentOutputBlock", "DiscardBlock"],
             Range: ["ClampBlock", "RemapBlock", "NormalizeBlock"],
             Round: ["RoundBlock", "CeilingBlock", "FloorBlock"],
-            Scene: ["FogBlock", "CameraPositionBlock", "FogColorBlock", "ImageProcessingBlock", "LightBlock", "LightInformationBlock", "ViewDirectionBlock", "PerturbNormalBlock", "NormalBlendBlock"],
-            Trigonometry: ["CosBlock", "SinBlock", "AbsBlock", "ExpBlock", "Exp2Block", "SqrtBlock", "PowBlock", "LogBlock", "ArcCosBlock", "ArcSinBlock", "TanBlock", "ArcTanBlock", "FractBlock", "SignBlock", "ArcTan2Block", "DegreesToRadiansBlock", "RadiansToDegreesBlock", "SawToothWaveBlock", "TriangleWaveBlock", "SquareWaveBlock"],
-            Vector_Math: ["CrossBlock", "DotBlock", "TransformBlock", "FresnelBlock", "Rotate2dBlock", "DerivativeBlock", "RefractBlock", "ReflectBlock"],
+            Scene: ["FogBlock", "CameraPositionBlock", "FogColorBlock", "ImageProcessingBlock", "LightBlock", "LightInformationBlock", "ViewDirectionBlock"],
         };
         // Create node menu
         var blockMenu = [];
@@ -51793,7 +51793,7 @@ var NodeListComponent = /** @class */ (function (_super) {
                 return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_draggableLineComponent__WEBPACK_IMPORTED_MODULE_3__["DraggableLineComponent"], { key: block, data: block, tooltip: tooltip });
             });
             if (blockList.length) {
-                blockMenu.push(react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__["LineContainerComponent"], { key: key + " blocks", title: key.replace("__", ":").replace("_", " "), closed: false }, blockList));
+                blockMenu.push(react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__["LineContainerComponent"], { key: key + " blocks", title: key.replace("__", ": ").replace("_", " "), closed: false }, blockList));
             }
         }
         return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "nodeList" },
@@ -51804,70 +51804,75 @@ var NodeListComponent = /** @class */ (function (_super) {
                     react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "list-container" }, blockMenu)))));
     };
     NodeListComponent._Tooltips = {
-        "BonesBlock": "Provides a world matrix for each vertex, based on skeletal (bone/joint) animation. mesh.matricesIndices and mesh.matricesWeights are the vertex to bone assignments and weighting, and assume no more than 4 bones influencing any given vertex. If a vertex is influenced by more than 4 bones, then mesh.matricesIndicesExtra and mesh.matricesWeightsExtra can be used for up to 8 bones of influence per vertex",
+        "BonesBlock": "Provides a world matrix for each vertex, based on skeletal (bone/joint) animation",
         "MorphTargetsBlock": "Provides the final positions, normals, tangents, and uvs based on morph targets in a mesh",
-        "AddBlock": "Adds the left and right inputs together. Left and right inputs have to be of the same type",
+        "AddBlock": "Adds the left and right inputs of the same type together",
         "DistanceBlock": "Provides a distance vector based on the left and right input vectors",
-        "DivideBlock": "Divides the left input by the right input",
+        "DivideBlock": "Divides the left input by the right input of the same type",
         "LengthBlock": "Outputs the length of an input vector",
-        "MaxBlock": "Outputs the largest value between the left and right inputs",
-        "MinBlock": "Outputs the smallest value between the left and right inputs",
-        "MultiplyBlock": "Multiplies the left and right inputs together",
+        "MaxBlock": "Outputs the largest value between the left and right inputs of the same type",
+        "MinBlock": "Outputs the smallest value between the left and right inputs of the same type",
+        "MultiplyBlock": "Multiplies the left and right inputs of the same type together",
         "NegateBlock": "Multiplies the input by -1",
-        "OneMinusBlock": "Subtracts the input value from 1 (1 - input)",
+        "OneMinusBlock": "Subtracts each channel of the input value from 1 (1 - input)",
         "RandomNumberBlock": "Provides a random number based on an input seed",
-        "ReciprocalBlock": "Outputs the reciprocal value(s) vased on the input value(s)",
-        "ScaleBlock": "Multiplies the input value(s) by the factor",
-        "SubtractBlock": "Subtracts the right input from the left input",
-        "PosterizeBlock": "Reduces the number of colors in an image to the value of input steps",
-        "ReplaceColorBlock": "Replaces a reference color in input value with a different replacement color. Distance is the tolerance variation of the color",
-        "ColorMergerBlock": "Combines individual color channels into color Vectors",
-        "ColorSplitterBlock": "Separates color Vectors into individual color channels",
-        "VectorMergerBlock": "Combines up to 4 input values into Vectors",
-        "VectorSplitterBlock": "Separates Vectors into individual elements",
-        "Color3": "A Vector3 representing combined color values (red, green, and blue)",
-        "Color4": "A Vector4 representing combined color and alpha values (red, green, blue, and alpha)",
-        "DeltaTimeBlock": "A Float representing the time value that's passed since the last frame has rendered",
-        "Float": "A Float for a single floating point value",
-        "TextureBlock": "A container node for a texture (image or url)",
-        "TimeBlock": "A Float of a constantly increasing floating point value, starting when the scene is loaded",
-        "Vector2": "A Vector2 representing two values",
-        "Vector3": "A Vector3 representing three values",
-        "Vector4": "A Vector4 representing four values",
-        "LerpBlock": "Provides linear interpolated value(s) between the left and right inputs, based on the gradient input",
+        "ReciprocalBlock": "Quotient of 1 divided by the input",
+        "ScaleBlock": "Multiplies the input channels by a float factor",
+        "SubtractBlock": "Subtracts the right input from the left input of the same type",
+        "GradientBlock": "Returns the color in the gradient represented by the target value of the input",
+        "PosterizeBlock": "Reduces the number of values in each channel to the number in the corresponding channel of steps",
+        "ReplaceColorBlock": "Replaces a reference color in value with the color in replacement blended by distance",
+        "ColorMergerBlock": "Combines float input channels into a color",
+        "ColorSplitterBlock": "Separates color input channels into individual floats",
+        "VectorMergerBlock": "Combines up to four input floats into a vector",
+        "VectorSplitterBlock": "Separates vectors input channels into individual floats",
+        "Color3": "A color made up of red, green, and blue channel values",
+        "Color4": "A color made up of red, green, blue, and alpha channel values",
+        "DeltaTimeBlock": "A float representing the time that has passed since the last frame was rendered",
+        "Float": "A floating point number representing a value with a fractional component",
+        "TextureBlock": "A node for reading a linked or embedded texture file",
+        "TimeBlock": "A float value that represents the time that has passed since the scene was loaded",
+        "Vector2": "a vector composed of X and Y channels",
+        "Vector3": "a vector composed of X, Y, and Z channels",
+        "Vector4": "a vector composed of X, Y, Z, and W channels",
+        "LerpBlock": "Outputs a value that is a mix of the left and right inputs based on the target value",
+        "NLerpBlock": "Outputs a value that is a mix of the left and right inputs based on the target's normalized value",
         "SmoothStepBlock": "Outputs a value based on a the input value's position on a curve between the two edge values",
-        "Matrix": "A container for a vector transformation",
-        "ProjectionMatrixBlock": "A matrix moving from 3D space to screen space",
-        "ViewMatrixBlock": "A matrix moving from 3D space to camera space",
-        "ViewProjectionMatrixBlock": "A matrix moving from 3D space to camera space, and ending in screen space",
-        "WorldMatrixBlock": "A matrix moving from local space to world space",
-        "WorldViewProjectionMatrixBlock": "A matrix moving from local space to world space, then to camera space, and ending in screen space",
-        "ColorBlock": "A Color4 representing the color of each vertex of the attached mesh",
-        "InstancesBlock": "Provides the world matrix for each instance. This is used to apply materials to instances as well as original meshes",
+        "StepBlock": "Outputs 1 for any input value above the edge input, outputs 0 for any input value below the edge input",
+        "Matrix": "A 4x4 table of related values",
+        "ProjectionMatrixBlock": "A matrix to remap points in 3D space to 2D plane relative to the screen",
+        "ViewMatrixBlock": "A matrix to remap points in 3D space to 2D plane relative to the view of the scene camera",
+        "ViewProjectionMatrixBlock": "A matrix to remap points in 3D space to 2D view space before remapping to 2D screen space",
+        "WorldMatrixBlock": "A matrix to remap points in 3D local space to 3D world space",
+        "WorldViewProjectionMatrixBlock": "A matrix to remap points in 3D local space to 3D world space, then to 2D camera space, and ending in 2D screen space",
+        "ColorBlock": "Outputs the RGBA color of each vertex in the mesh",
+        "InstancesBlock": "Provides the world matrix for each instance to apply this material to all instances",
         "MatrixIndicesBlock": "A Vector4 representing the vertex to bone skinning assignments",
-        "MatricesWeightsBlock": "A Vector4 representing the vertex to bone skinning weights",
+        "MatrixWeightsBlock": "A Vector4 representing the vertex to bone skinning weights",
         "NormalBlock": "A Vector3 representing the normal of each vertex of the attached mesh",
         "PositionBlock": "A Vector3 representing the position of each vertex of the attached mesh",
         "TangentBlock": "A Vector3 representing the tangent of each vertex of the attached mesh",
         "UVBlock": "A Vector2 representing the UV coordinates of each vertex of the attached mesh",
-        "DiscardBlock": "A final output node that will not output a pixel below the cutoff value",
-        "FragmentOutputBlock": "The final node for outputing the color of each pixel. This node must be included in every node material",
-        "VertexOutputBlock": "The final node for outputing the position of each vertex. This node must be included in every node material",
-        "ClampBlock": "Ignores all values of the input outside of the Minimum and Maximum property values",
+        "WorldNormal": "A Vector4 representing the normal of each vertex of the attached mesh transformed into world space",
+        "PerturbNormalBlock": "Creates high-frequency detail normal vectors based on a normal map, the world position, and world normal",
+        "NormalBlend": "Outputs the result of blending two normal maps together using a per-channel screen",
+        "WorldPosition": "A Vector4 representing the position of each vertex of the attached mesh transformed into world space",
+        "DiscardBlock": "A final node that will not output a pixel below the cutoff value",
+        "FragmentOutputBlock": "A mandatory final node for outputing the color of each pixel",
+        "VertexOutputBlock": "A mandatory final node for outputing the position of each vertex",
+        "ClampBlock": "Outputs values above the maximum or below minimum as maximum or minimum values respectively",
         "NormalizeBlock": "Remaps the length of a vector or color to 1",
-        "RemapBlock": "Remaps all input values between sourceMin and sourceMax, to be between targetMin and targetMax. source and target inputs can be static or variable inputs",
-        "CeilingBlock": "Outputs the highest value of the input",
-        "FloorBlock": "Outputs the lowest value of the input",
-        "RoundBlock": "Outputs the nearest whole number based on the input value",
-        "StepBlock": "Outputs 1 for any input value above the edge input, outputs 0 for any input value below the edge input",
-        "CameraPositionBlock": "A Vector3 position of the active scene camera",
-        "FogBlock": "Applies fog to a scene. Outputs fog with increasing value based on distance from the camera",
-        "FogColorBlock": "A Color3 for the fog color",
+        "RemapBlock": "Remaps input value between sourceMin and sourceMax to a new range between targetMin and targetMax",
+        "CeilingBlock": "Outputs fractional values as the next higher whole number",
+        "FloorBlock": "Outputs fractional values as the next lower whole number",
+        "RoundBlock": "Outputs fractional values rounded to the nearest whole number",
+        "CameraPositionBlock": "Outputs a Vector3 position of the active scene camera",
+        "FogBlock": "Applies fog to the scene with an increasing opacity based on distance from the camera",
+        "FogColorBlock": "The system value for fog color pulled from the scene",
         "ImageProcessingBlock": "Provides access to all of the Babylon image processing properties",
-        "LightBlock": "Returns the individual color values (red, green, and blue) of the diffuse or specular colors of the combined OR individual lighting within the scene",
+        "LightBlock": "Outputs diffuse and specular contributions from one or more scene lights",
         "LightInformationBlock": "Provides the direction, color and intensity of a selected light based on its world position",
-        "PerturbNormalBlock": "Creates a new normal direction based on a normal map, the world position, and world normal",
-        "ReflectionTextureBlock": "Creates a reflection of the input texture",
+        "ReflectionTextureBlock": "Creates a reflection from the input texture",
         "ViewDirectionBlock": "Outputs the direction vector of where the camera is aimed",
         "AbsBlock": "Outputs the absolute value of the input value",
         "ArcCosBlock": "Outputs the inverse of the cosine value based on the input value",
@@ -51875,15 +51880,15 @@ var NodeListComponent = /** @class */ (function (_super) {
         "ArcTan2Block": "Outputs the inverse of the tangent value based on the input value",
         "ArcTanBlock": "Outputs the inverse of the tangent value based on the input value",
         "CosBlock": "Outputs the cosine value based on the input value",
-        "DegreesToRadiansBlock": "Converts the input value (degrees) to radians",
+        "DegreesToRadiansBlock": "Converts the input degrees value to radians",
         "Exp2Block": "Outputs the input value multiplied by itself 1 time. (Exponent of 2)",
         "ExpBlock": "Outputs the input value multiplied by itself 9 time. (Exponent of 10)",
-        "FractBlock": "Everything after the period",
-        "LogBlock": "The logarithm value based on the input value",
+        "FractBlock": "Outputs only the fractional value of a floating point number",
+        "LogBlock": "The logarithmic value based on the input value",
         "PowBlock": "Outputs the input value multiplied by itself the number of times equal to the power input (Exponent of power)",
-        "RadiansToDegreesBlock": "Converts the input value (radians) to degrees",
+        "RadiansToDegreesBlock": "Converts the input radians value to degrees",
         "SawToothWaveBlock": "Outputs a sawtooth pattern value between -1 and 1 based on the input value",
-        "SignBlock": "returns 1 if 10 or -1 if -10",
+        "SignBlock": "returns 1 if the input is positive, 0 if input is equal to 0, or -1 if the input is negative",
         "SinBlock": "Outputs the the sine value based on the input value",
         "SqrtBlock": "Outputs the the square root of the input value",
         "SquareWaveBlock": "Outputs a stepped pattern value between -1 and 1 based on the input value",
@@ -51891,8 +51896,17 @@ var NodeListComponent = /** @class */ (function (_super) {
         "TriangleWaveBlock": "Outputs a sawtooth pattern value between 0 and 1 based on the input value",
         "CrossBlock": "Outputs a vector that is perpendicular to two input vectors",
         "DotBlock": "Outputs the cos of the angle between two vectors",
-        "FresnelBlock": "Outputs the grazing angle of the surface of the mesh, relative to a camera. Angle can be influenced by the bias and power inputs",
-        "TransformBlock": "Transforms a input vector based on an input matrix"
+        "FresnelBlock": "Outputs the grazing angle of the surface of the mesh, relative to a camera influenced by the bias and power inputs",
+        "TransformBlock": "Transforms a input vector based on the input matrix",
+        "DerivativeBlock": "FRAGMENT SHADER ONLY. Provides the rate of change for an input on a given axis (x,y).",
+        "DesaturateBlock": "Convert a color input into a grayscale representation.",
+        "WorldViewMatrixBlock": "A matrix to remap points in 3D local space to 3D world space, and ending in 2D camera space.",
+        "FrontFacingBlock": "Returns 1 if a mesh triangle faces the normal direction and 0 if it does not.",
+        "SimplexPerlin3DBlock": "Creates a type of gradient noise with few directional artifacts.",
+        "WorleyNoise3DBlock": "Creates a random pattern resembling cells.",
+        "ReflectBlock": "Outputs the direction of the input vector reflected across the surface normal.",
+        "RefractBlock": "Outputs a direction simulating a deflection of the input vector.",
+        "Rotate2dBlock": "Rotates UV coordinates around the W axis."
     };
     return NodeListComponent;
 }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -54529,9 +54543,9 @@ var GraphNode = /** @class */ (function () {
             return this._x;
         },
         set: function (value) {
-            // if (this._x === value) {
-            //     return;
-            // }
+            if (this._x === value) {
+                return;
+            }
             this._x = value;
             this._gridAlignedX = this._ownerCanvas.getGridPosition(value);
             this._visual.style.left = this._gridAlignedX + "px";
@@ -54546,9 +54560,9 @@ var GraphNode = /** @class */ (function () {
             return this._y;
         },
         set: function (value) {
-            // if (this._y === value) {
-            //     return;
-            // }
+            if (this._y === value) {
+                return;
+            }
             this._y = value;
             this._gridAlignedY = this._ownerCanvas.getGridPosition(value);
             this._visual.style.top = this._gridAlignedY + "px";

dist/preview release/packagesSizeBaseLine.json

@@ -1 +1 @@
-{"thinEngineOnly":116685,"engineOnly":153618,"sceneOnly":499299,"minGridMaterial":629299,"minStandardMaterial":753197}
+{"thinEngineOnly":117980,"engineOnly":154936,"sceneOnly":500617,"minGridMaterial":630617,"minStandardMaterial":754515}

dist/preview release/viewer/babylon.module.d.ts

@@ -597,56 +597,61 @@ declare module "babylonjs/Engines/constants" {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -30474,6 +30479,7 @@ declare module "babylonjs/Materials/effect" {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -31098,30 +31104,37 @@ declare module "babylonjs/Engines/instancingAttributeInfo" {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module "babylonjs/Engines/Extensions/engine.videoTexture" {
@@ -31462,7 +31475,6 @@ declare module "babylonjs/Engines/thinEngine" {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -31493,11 +31505,19 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -31857,9 +31877,27 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -32079,6 +32117,20 @@ declare module "babylonjs/Engines/thinEngine" {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -32223,6 +32275,7 @@ declare module "babylonjs/Engines/thinEngine" {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -33333,6 +33386,43 @@ declare module "babylonjs/Misc/perfCounter" {
         private _lastSecValueCount;
     }
 }
+declare module "babylonjs/Engines/Extensions/engine.alpha" {
+    module "babylonjs/Engines/thinEngine" {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+    }
+}
 declare module "babylonjs/Engines/engine" {
     import { Observable } from "babylonjs/Misc/observable";
     import { Nullable, IndicesArray, DataArray } from "babylonjs/types";
@@ -33350,6 +33440,7 @@ declare module "babylonjs/Engines/engine" {
     import { PerformanceMonitor } from "babylonjs/Misc/performanceMonitor";
     import { DataBuffer } from "babylonjs/Meshes/dataBuffer";
     import { PerfCounter } from "babylonjs/Misc/perfCounter";
+    import "babylonjs/Engines/Extensions/engine.alpha";
     import { Material } from "babylonjs/Materials/material";
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     /**
@@ -33677,10 +33768,6 @@ declare module "babylonjs/Engines/engine" {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -33799,47 +33886,6 @@ declare module "babylonjs/Engines/engine" {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */
@@ -47227,6 +47273,7 @@ declare module "babylonjs/Engines/Extensions/engine.views" {
     }
 }
 declare module "babylonjs/Engines/Extensions/index" {
+    export * from "babylonjs/Engines/Extensions/engine.alpha";
     export * from "babylonjs/Engines/Extensions/engine.occlusionQuery";
     export * from "babylonjs/Engines/Extensions/engine.transformFeedback";
     export * from "babylonjs/Engines/Extensions/engine.multiview";
@@ -69923,56 +69970,61 @@ declare module BABYLON {
     export class Constants {
         /** Defines that alpha blending is disabled */
         static readonly ALPHA_DISABLE: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + DEST */
         static readonly ALPHA_ADD: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_COMBINE: number;
-        /** Defines that alpha blending to DEST - SRC * DEST */
+        /** Defines that alpha blending is DEST - SRC * DEST */
         static readonly ALPHA_SUBTRACT: number;
-        /** Defines that alpha blending to SRC * DEST */
+        /** Defines that alpha blending is SRC * DEST */
         static readonly ALPHA_MULTIPLY: number;
-        /** Defines that alpha blending to SRC ALPHA * SRC + (1 - SRC) * DEST */
+        /** Defines that alpha blending is SRC ALPHA * SRC + (1 - SRC) * DEST */
         static readonly ALPHA_MAXIMIZED: number;
-        /** Defines that alpha blending to SRC + DEST */
+        /** Defines that alpha blending is SRC + DEST */
         static readonly ALPHA_ONEONE: number;
-        /** Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST */
+        /** Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST */
         static readonly ALPHA_PREMULTIPLIED: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC ALPHA) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC ALPHA) * DEST
          * Alpha will be set to (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_PREMULTIPLIED_PORTERDUFF: number;
-        /** Defines that alpha blending to CST * SRC + (1 - CST) * DEST */
+        /** Defines that alpha blending is CST * SRC + (1 - CST) * DEST */
         static readonly ALPHA_INTERPOLATE: number;
         /**
-         * Defines that alpha blending to SRC + (1 - SRC) * DEST
+         * Defines that alpha blending is SRC + (1 - SRC) * DEST
          * Alpha will be set to SRC ALPHA + (1 - SRC ALPHA) * DEST ALPHA
          */
         static readonly ALPHA_SCREENMODE: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA + DST ALPHA
          */
         static readonly ALPHA_ONEONE_ONEONE: number;
         /**
-         * Defines that alpha blending to SRC * DST ALPHA + DST
+         * Defines that alpha blending is SRC * DST ALPHA + DST
          * Alpha will be set to 0
          */
         static readonly ALPHA_ALPHATOCOLOR: number;
         /**
-         * Defines that alpha blending to SRC * (1 - DST) + DST * (1 - SRC)
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
          */
         static readonly ALPHA_REVERSEONEMINUS: number;
         /**
-         * Defines that alpha blending to SRC + DST * (1 - SRC ALPHA)
+         * Defines that alpha blending is SRC + DST * (1 - SRC ALPHA)
          * Alpha will be set to SRC ALPHA + DST ALPHA * (1 - SRC ALPHA)
          */
         static readonly ALPHA_SRC_DSTONEMINUSSRCALPHA: number;
         /**
-         * Defines that alpha blending to SRC + DST
+         * Defines that alpha blending is SRC + DST
          * Alpha will be set to SRC ALPHA
          */
         static readonly ALPHA_ONEONE_ONEZERO: number;
+        /**
+         * Defines that alpha blending is SRC * (1 - DST) + DST * (1 - SRC)
+         * Alpha will be set to DST ALPHA
+         */
+        static readonly ALPHA_EXCLUSION: number;
         /** Defines that alpha blending equation a SUM */
         static readonly ALPHA_EQUATION_ADD: number;
         /** Defines that alpha blending equation a SUBSTRACTION */
@@ -98887,6 +98939,7 @@ declare module BABYLON {
         private _allFallbacksProcessed;
         private _attributesNames;
         private _attributes;
+        private _attributeLocationByName;
         private _uniforms;
         /**
          * Key for the effect.
@@ -99509,30 +99562,37 @@ declare module BABYLON {
      */
     export interface InstancingAttributeInfo {
         /**
+         * Name of the GLSL attribute
+         * if attribute index is not specified, this is used to retrieve the index from the effect
+         */
+        attributeName: string;
+        /**
          * Index/offset of the attribute in the vertex shader
+         * if not specified, this will be computes from the name.
          */
-        index: number;
+        index?: number;
         /**
          * size of the attribute, 1, 2, 3 or 4
          */
         attributeSize: number;
         /**
-         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
-         * default is FLOAT
+         * Offset of the data in the Vertex Buffer acting as the instancing buffer
          */
-        attributeType: number;
+        offset: number;
         /**
-         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
+         * Modifies the rate at which generic vertex attributes advance when rendering multiple instances
+         * default to 1
          */
-        normalized: boolean;
+        divisor?: number;
         /**
-         * Offset of the data in the Vertex Buffer acting as the instancing buffer
+         * type of the attribute, gl.BYTE, gl.UNSIGNED_BYTE, gl.SHORT, gl.UNSIGNED_SHORT, gl.FIXED, gl.FLOAT.
+         * default is FLOAT
          */
-        offset: number;
+        attributeType?: number;
         /**
-         * Name of the GLSL attribute, for debugging purpose only
+         * normalization of fixed-point data. behavior unclear, use FALSE, default is FALSE
          */
-        attributeName: string;
+        normalized?: boolean;
     }
 }
 declare module BABYLON {
@@ -99842,7 +99902,6 @@ declare module BABYLON {
         /** @hidden */
         _caps: EngineCapabilities;
         private _isStencilEnable;
-        protected _colorWrite: boolean;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -99873,11 +99932,19 @@ declare module BABYLON {
          */
         disableVertexArrayObjects: boolean;
         /** @hidden */
+        protected _colorWrite: boolean;
+        /** @hidden */
+        protected _colorWriteChanged: boolean;
+        /** @hidden */
         protected _depthCullingState: DepthCullingState;
         /** @hidden */
         protected _stencilState: StencilState;
         /** @hidden */
-        protected _alphaState: AlphaState;
+        _alphaState: AlphaState;
+        /** @hidden */
+        _alphaMode: number;
+        /** @hidden */
+        _alphaEquation: number;
         /** @hidden */
         _internalTexturesCache: InternalTexture[];
         /** @hidden */
@@ -100237,9 +100304,27 @@ declare module BABYLON {
          */
         updateAndBindInstancesBuffer(instancesBuffer: DataBuffer, data: Float32Array, offsetLocations: number[] | InstancingAttributeInfo[]): void;
         /**
-         * Apply all cached states (depth, culling, stencil and alpha)
+         * Bind the content of a webGL buffer used with instanciation
+         * @param instancesBuffer defines the webGL buffer to bind
+         * @param attributesInfo defines the offsets or attributes information used to determine where data must be stored in the buffer
+         * @param computeStride defines Wether to compute the strides from the info or use the default 0
          */
-        applyStates(): void;
+        bindInstancesBuffer(instancesBuffer: DataBuffer, attributesInfo: InstancingAttributeInfo[], computeStride?: boolean): void;
+        /**
+         * Disable the instance attribute corresponding to the name in parameter
+         * @param name defines the name of the attribute to disable
+         */
+        disableInstanceAttributeByName(name: string): void;
+        /**
+         * Disable the instance attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableInstanceAttribute(attributeLocation: number): void;
+        /**
+         * Disable the attribute corresponding to the location in parameter
+         * @param attributeLocation defines the attribute location of the attribute to disable
+         */
+        disableAttributeByIndex(attributeLocation: number): void;
         /**
          * Send a draw order
          * @param useTriangles defines if triangles must be used to draw (else wireframe will be used)
@@ -100459,6 +100544,20 @@ declare module BABYLON {
          */
         setFloat4(uniform: Nullable<WebGLUniformLocation>, x: number, y: number, z: number, w: number): void;
         /**
+         * Apply all cached states (depth, culling, stencil and alpha)
+         */
+        applyStates(): void;
+        /**
+         * Enable or disable color writing
+         * @param enable defines the state to set
+         */
+        setColorWrite(enable: boolean): void;
+        /**
+         * Gets a boolean indicating if color writing is enabled
+         * @returns the current color writing state
+         */
+        getColorWrite(): boolean;
+        /**
          * Gets the depth culling state manager
          */
         readonly depthCullingState: DepthCullingState;
@@ -100603,6 +100702,7 @@ declare module BABYLON {
         private _prepareWebGLTexture;
         /** @hidden */
         _setupFramebufferDepthAttachments(generateStencilBuffer: boolean, generateDepthBuffer: boolean, width: number, height: number, samples?: number): Nullable<WebGLRenderbuffer>;
+        private _getDepthStencilBuffer;
         /** @hidden */
         _releaseFramebufferObjects(texture: InternalTexture): void;
         /** @hidden */
@@ -101702,6 +101802,41 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Sets alpha constants used by some alpha blending modes
+             * @param r defines the red component
+             * @param g defines the green component
+             * @param b defines the blue component
+             * @param a defines the alpha component
+             */
+            setAlphaConstants(r: number, g: number, b: number, a: number): void;
+            /**
+             * Sets the current alpha mode
+             * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
+             * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             */
+            setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
+            /**
+             * Gets the current alpha mode
+             * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
+             * @returns the current alpha mode
+             */
+            getAlphaMode(): number;
+            /**
+             * Sets the current alpha equation
+             * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
+             */
+            setAlphaEquation(equation: number): void;
+            /**
+             * Gets the current alpha equation.
+             * @returns the current alpha equation
+             */
+            getAlphaEquation(): number;
+        }
+}
+declare module BABYLON {
     /**
      * Defines the interface used by display changed events
      */
@@ -102027,10 +102162,6 @@ declare module BABYLON {
         private _pointerLockRequested;
         private _dummyFramebuffer;
         private _rescalePostProcess;
-        /** @hidden */
-        protected _alphaMode: number;
-        /** @hidden */
-        protected _alphaEquation: number;
         private _deterministicLockstep;
         private _lockstepMaxSteps;
         private _timeStep;
@@ -102149,47 +102280,6 @@ declare module BABYLON {
          */
         setDepthWrite(enable: boolean): void;
         /**
-         * Enable or disable color writing
-         * @param enable defines the state to set
-         */
-        setColorWrite(enable: boolean): void;
-        /**
-         * Gets a boolean indicating if color writing is enabled
-         * @returns the current color writing state
-         */
-        getColorWrite(): boolean;
-        /**
-         * Sets alpha constants used by some alpha blending modes
-         * @param r defines the red component
-         * @param g defines the green component
-         * @param b defines the blue component
-         * @param a defines the alpha component
-         */
-        setAlphaConstants(r: number, g: number, b: number, a: number): void;
-        /**
-         * Sets the current alpha mode
-         * @param mode defines the mode to use (one of the Engine.ALPHA_XXX)
-         * @param noDepthWriteChange defines if depth writing state should remains unchanged (false by default)
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         */
-        setAlphaMode(mode: number, noDepthWriteChange?: boolean): void;
-        /**
-         * Gets the current alpha mode
-         * @see http://doc.babylonjs.com/resources/transparency_and_how_meshes_are_rendered
-         * @returns the current alpha mode
-         */
-        getAlphaMode(): number;
-        /**
-         * Sets the current alpha equation
-         * @param equation defines the equation to use (one of the Engine.ALPHA_EQUATION_XXX)
-         */
-        setAlphaEquation(equation: number): void;
-        /**
-         * Gets the current alpha equation.
-         * @returns the current alpha equation
-         */
-        getAlphaEquation(): number;
-        /**
          * Gets a boolean indicating if stencil buffer is enabled
          * @returns the current stencil buffer state
          */

src/Engines/thinEngine.ts

@@ -2253,7 +2253,16 @@ export class ThinEngine {
             return;
         }
 
-        webGLPipelineContext.onCompiled = action;
+        let oldHandler = webGLPipelineContext.onCompiled;
+
+        if (oldHandler) {
+            webGLPipelineContext.onCompiled = () => {
+                oldHandler!();
+                action();
+            };
+        } else {
+            webGLPipelineContext.onCompiled = action;
+        }
     }
 
     /**