new renderingGroup architecture

dist/preview release/babylon.max.js

@@ -16222,44 +16222,6 @@ var BABYLON;
                 this._autoClearDepthStencil[i] = { autoClear: true, depth: true, stencil: true };
             }
         }
-        RenderingManager.prototype._renderParticles = function (index, activeMeshes) {
-            if (this._scene._activeParticleSystems.length === 0) {
-                return;
-            }
-            // Particles
-            var activeCamera = this._scene.activeCamera;
-            this._scene._particlesDuration.beginMonitoring();
-            for (var particleIndex = 0; particleIndex < this._scene._activeParticleSystems.length; particleIndex++) {
-                var particleSystem = this._scene._activeParticleSystems.data[particleIndex];
-                if (particleSystem.renderingGroupId !== index) {
-                    continue;
-                }
-                if ((activeCamera.layerMask & particleSystem.layerMask) === 0) {
-                    continue;
-                }
-                this._clearDepthStencilBuffer();
-                if (!particleSystem.emitter.position || !activeMeshes || activeMeshes.indexOf(particleSystem.emitter) !== -1) {
-                    this._scene._activeParticles.addCount(particleSystem.render(), false);
-                }
-            }
-            this._scene._particlesDuration.endMonitoring(false);
-        };
-        RenderingManager.prototype._renderSprites = function (index) {
-            if (!this._scene.spritesEnabled || this._scene.spriteManagers.length === 0) {
-                return;
-            }
-            // Sprites       
-            var activeCamera = this._scene.activeCamera;
-            this._scene._spritesDuration.beginMonitoring();
-            for (var id = 0; id < this._scene.spriteManagers.length; id++) {
-                var spriteManager = this._scene.spriteManagers[id];
-                if (spriteManager.renderingGroupId === index && ((activeCamera.layerMask & spriteManager.layerMask) !== 0)) {
-                    this._clearDepthStencilBuffer();
-                    spriteManager.render();
-                }
-            }
-            this._scene._spritesDuration.endMonitoring(false);
-        };
         RenderingManager.prototype._clearDepthStencilBuffer = function (depth, stencil) {
             if (depth === void 0) { depth = true; }
             if (stencil === void 0) { stencil = true; }
@@ -16269,14 +16231,6 @@ var BABYLON;
             this._scene.getEngine().clear(0, false, depth, stencil);
             this._depthStencilBufferAlreadyCleaned = true;
         };
-        RenderingManager.prototype._renderSpritesAndParticles = function () {
-            if (this._currentRenderSprites) {
-                this._renderSprites(this._currentIndex);
-            }
-            if (this._currentRenderParticles) {
-                this._renderParticles(this._currentIndex, this._currentActiveMeshes);
-            }
-        };
         RenderingManager.prototype.render = function (customRenderFunction, activeMeshes, renderParticles, renderSprites) {
             // Check if there's at least on observer on the onRenderingGroupObservable and initialize things to fire it
             var observable = this._scene.onRenderingGroupObservable.hasObservers() ? this._scene.onRenderingGroupObservable : null;
@@ -16289,9 +16243,14 @@ var BABYLON;
                 info.scene = this._scene;
                 info.camera = this._scene.activeCamera;
             }
-            this._currentActiveMeshes = activeMeshes;
-            this._currentRenderParticles = renderParticles;
-            this._currentRenderSprites = renderSprites;
+            // Dispatch sprites
+            if (renderSprites) {
+                for (var index = 0; index < this._scene.spriteManagers.length; index++) {
+                    var manager = this._scene.spriteManagers[index];
+                    this.dispatchSprites(manager);
+                }
+            }
+            // Render
             for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 this._depthStencilBufferAlreadyCleaned = index === RenderingManager.MIN_RENDERINGGROUPS;
                 var renderingGroup = this._renderingGroups[index];
@@ -16315,32 +16274,18 @@ var BABYLON;
                         info.renderStage = BABYLON.RenderingGroupInfo.STAGE_PREOPAQUE;
                         observable.notifyObservers(info, renderingGroupMask);
                     }
-                    if (!renderingGroup.onBeforeTransparentRendering) {
-                        renderingGroup.onBeforeTransparentRendering = this._renderSpritesAndParticles.bind(this);
-                    }
                     // Fire PRETRANSPARENT stage
                     if (observable) {
                         info.renderStage = BABYLON.RenderingGroupInfo.STAGE_PRETRANSPARENT;
                         observable.notifyObservers(info, renderingGroupMask);
                     }
-                    renderingGroup.render(customRenderFunction);
+                    renderingGroup.render(customRenderFunction, renderSprites, renderParticles, activeMeshes);
                     // Fire POSTTRANSPARENT stage
                     if (observable) {
                         info.renderStage = BABYLON.RenderingGroupInfo.STAGE_POSTTRANSPARENT;
                         observable.notifyObservers(info, renderingGroupMask);
                     }
                 }
-                else {
-                    this._renderSpritesAndParticles();
-                    if (observable) {
-                        var renderingGroupMask = Math.pow(2, index);
-                        info.renderStage = BABYLON.RenderingGroupInfo.STAGE_PRECLEAR;
-                        info.renderingGroupId = index;
-                        observable.notifyObservers(info, renderingGroupMask);
-                        info.renderStage = BABYLON.RenderingGroupInfo.STAGE_POSTTRANSPARENT;
-                        observable.notifyObservers(info, renderingGroupMask);
-                    }
-                }
             }
         };
         RenderingManager.prototype.reset = function () {
@@ -16351,12 +16296,25 @@ var BABYLON;
                 }
             }
         };
-        RenderingManager.prototype.dispatch = function (subMesh) {
-            var mesh = subMesh.getMesh();
-            var renderingGroupId = mesh.renderingGroupId || 0;
+        RenderingManager.prototype._prepareRenderingGroup = function (renderingGroupId) {
             if (!this._renderingGroups[renderingGroupId]) {
                 this._renderingGroups[renderingGroupId] = new BABYLON.RenderingGroup(renderingGroupId, this._scene, this._customOpaqueSortCompareFn[renderingGroupId], this._customAlphaTestSortCompareFn[renderingGroupId], this._customTransparentSortCompareFn[renderingGroupId]);
             }
+        };
+        RenderingManager.prototype.dispatchSprites = function (spriteManager) {
+            var renderingGroupId = spriteManager.renderingGroupId || 0;
+            this._prepareRenderingGroup(renderingGroupId);
+            this._renderingGroups[renderingGroupId].dispatchSprites(spriteManager);
+        };
+        RenderingManager.prototype.dispatchParticles = function (particleSystem) {
+            var renderingGroupId = particleSystem.renderingGroupId || 0;
+            this._prepareRenderingGroup(renderingGroupId);
+            this._renderingGroups[renderingGroupId].dispatchParticles(particleSystem);
+        };
+        RenderingManager.prototype.dispatch = function (subMesh) {
+            var mesh = subMesh.getMesh();
+            var renderingGroupId = mesh.renderingGroupId || 0;
+            this._prepareRenderingGroup(renderingGroupId);
             this._renderingGroups[renderingGroupId].dispatch(subMesh);
         };
         /**
@@ -16432,6 +16390,8 @@ var BABYLON;
             this._opaqueSubMeshes = new BABYLON.SmartArray(256);
             this._transparentSubMeshes = new BABYLON.SmartArray(256);
             this._alphaTestSubMeshes = new BABYLON.SmartArray(256);
+            this._particleSystems = new BABYLON.SmartArray(256);
+            this._spriteManagers = new BABYLON.SmartArray(256);
             this._scene = scene;
             this.opaqueSortCompareFn = opaqueSortCompareFn;
             this.alphaTestSortCompareFn = alphaTestSortCompareFn;
@@ -16493,7 +16453,7 @@ var BABYLON;
          * @param customRenderFunction Used to override the default render behaviour of the group.
          * @returns true if rendered some submeshes.
          */
-        RenderingGroup.prototype.render = function (customRenderFunction) {
+        RenderingGroup.prototype.render = function (customRenderFunction, renderSprites, renderParticles, activeMeshes) {
             if (customRenderFunction) {
                 customRenderFunction(this._opaqueSubMeshes, this._alphaTestSubMeshes, this._transparentSubMeshes);
                 return;
@@ -16509,6 +16469,14 @@ var BABYLON;
                 this._renderAlphaTest(this._alphaTestSubMeshes);
                 engine.setAlphaTesting(false);
             }
+            // Sprites
+            if (renderSprites) {
+                this._renderSprites();
+            }
+            // Particles
+            if (renderParticles) {
+                this._renderParticles(activeMeshes);
+            }
             if (this.onBeforeTransparentRendering) {
                 this.onBeforeTransparentRendering();
             }
@@ -16633,6 +16601,8 @@ var BABYLON;
             this._opaqueSubMeshes.reset();
             this._transparentSubMeshes.reset();
             this._alphaTestSubMeshes.reset();
+            this._particleSystems.reset();
+            this._spriteManagers.reset();
         };
         /**
          * Inserts the submesh in its correct queue depending on its material.
@@ -16651,6 +16621,45 @@ var BABYLON;
                 this._opaqueSubMeshes.push(subMesh); // Opaque
             }
         };
+        RenderingGroup.prototype.dispatchSprites = function (spriteManager) {
+            this._spriteManagers.push(spriteManager);
+        };
+        RenderingGroup.prototype.dispatchParticles = function (particleSystem) {
+            this._particleSystems.push(particleSystem);
+        };
+        RenderingGroup.prototype._renderParticles = function (activeMeshes) {
+            if (this._particleSystems.length === 0) {
+                return;
+            }
+            // Particles
+            var activeCamera = this._scene.activeCamera;
+            this._scene._particlesDuration.beginMonitoring();
+            for (var particleIndex = 0; particleIndex < this._scene._activeParticleSystems.length; particleIndex++) {
+                var particleSystem = this._scene._activeParticleSystems.data[particleIndex];
+                if ((activeCamera.layerMask & particleSystem.layerMask) === 0) {
+                    continue;
+                }
+                if (!particleSystem.emitter.position || !activeMeshes || activeMeshes.indexOf(particleSystem.emitter) !== -1) {
+                    this._scene._activeParticles.addCount(particleSystem.render(), false);
+                }
+            }
+            this._scene._particlesDuration.endMonitoring(false);
+        };
+        RenderingGroup.prototype._renderSprites = function () {
+            if (!this._scene.spritesEnabled || this._spriteManagers.length === 0) {
+                return;
+            }
+            // Sprites       
+            var activeCamera = this._scene.activeCamera;
+            this._scene._spritesDuration.beginMonitoring();
+            for (var id = 0; id < this._spriteManagers.length; id++) {
+                var spriteManager = this._scene.spriteManagers[id];
+                if (((activeCamera.layerMask & spriteManager.layerMask) !== 0)) {
+                    spriteManager.render();
+                }
+            }
+            this._scene._spritesDuration.endMonitoring(false);
+        };
         return RenderingGroup;
     }());
     BABYLON.RenderingGroup = RenderingGroup;
@@ -18392,6 +18401,7 @@ var BABYLON;
                     if (!particleSystem.emitter.position || (particleSystem.emitter && particleSystem.emitter.isEnabled())) {
                         this._activeParticleSystems.push(particleSystem);
                         particleSystem.animate();
+                        this._renderingManager.dispatchParticles(particleSystem);
                     }
                 }
                 BABYLON.Tools.EndPerformanceCounter("Particles", this.particleSystems.length > 0);

src/Rendering/babylon.renderingGroup.ts

@@ -4,6 +4,8 @@
         private _opaqueSubMeshes = new SmartArray<SubMesh>(256);
         private _transparentSubMeshes = new SmartArray<SubMesh>(256);
         private _alphaTestSubMeshes = new SmartArray<SubMesh>(256);
+        private _particleSystems = new SmartArray<ParticleSystem>(256);
+        private _spriteManagers = new SmartArray<SpriteManager>(256);        
         private _activeVertices: number;
 
         private _opaqueSortCompareFn: (a: SubMesh, b: SubMesh) => number;
@@ -81,7 +83,7 @@
          * @param customRenderFunction Used to override the default render behaviour of the group.
          * @returns true if rendered some submeshes.
          */
-        public render(customRenderFunction: (opaqueSubMeshes: SmartArray<SubMesh>, transparentSubMeshes: SmartArray<SubMesh>, alphaTestSubMeshes: SmartArray<SubMesh>) => void): void {
+        public render(customRenderFunction: (opaqueSubMeshes: SmartArray<SubMesh>, transparentSubMeshes: SmartArray<SubMesh>, alphaTestSubMeshes: SmartArray<SubMesh>) => void, renderSprites: boolean, renderParticles: boolean, activeMeshes: AbstractMesh[]): void {
             if (customRenderFunction) {
                 customRenderFunction(this._opaqueSubMeshes, this._alphaTestSubMeshes, this._transparentSubMeshes);
                 return;
@@ -101,6 +103,16 @@
                 engine.setAlphaTesting(false);
             }
 
+            // Sprites
+            if (renderSprites) {
+                this._renderSprites();
+            }
+            
+            // Particles
+            if (renderParticles) {
+                this._renderParticles(activeMeshes);
+            }
+
             if (this.onBeforeTransparentRendering) {
                 this.onBeforeTransparentRendering();
             }
@@ -240,6 +252,8 @@
             this._opaqueSubMeshes.reset();
             this._transparentSubMeshes.reset();
             this._alphaTestSubMeshes.reset();
+            this._particleSystems.reset();
+            this._spriteManagers.reset();
         }
 
         /**
@@ -258,5 +272,52 @@
                 this._opaqueSubMeshes.push(subMesh); // Opaque
             }
         }
+
+        public dispatchSprites(spriteManager: SpriteManager) {
+            this._spriteManagers.push(spriteManager);
+        }
+
+        public dispatchParticles(particleSystem: ParticleSystem) {
+            this._particleSystems.push(particleSystem);
+        }
+
+        private _renderParticles(activeMeshes: AbstractMesh[]): void {
+            if (this._particleSystems.length === 0) {
+                return;
+            }
+
+            // Particles
+            var activeCamera = this._scene.activeCamera;
+            this._scene._particlesDuration.beginMonitoring();
+            for (var particleIndex = 0; particleIndex < this._scene._activeParticleSystems.length; particleIndex++) {
+                var particleSystem = this._scene._activeParticleSystems.data[particleIndex];
+
+                if ((activeCamera.layerMask & particleSystem.layerMask) === 0) {
+                    continue;
+                }
+                if (!particleSystem.emitter.position || !activeMeshes || activeMeshes.indexOf(particleSystem.emitter) !== -1) {
+                    this._scene._activeParticles.addCount(particleSystem.render(), false);
+                }
+            }
+            this._scene._particlesDuration.endMonitoring(false);
+        }
+
+        private _renderSprites(): void {
+            if (!this._scene.spritesEnabled || this._spriteManagers.length === 0) {
+                return;
+            }
+
+            // Sprites       
+            var activeCamera = this._scene.activeCamera;
+            this._scene._spritesDuration.beginMonitoring();
+            for (var id = 0; id < this._spriteManagers.length; id++) {
+                var spriteManager = this._scene.spriteManagers[id];
+
+                if (((activeCamera.layerMask & spriteManager.layerMask) !== 0)) {
+                    spriteManager.render();
+                }
+            }
+            this._scene._spritesDuration.endMonitoring(false);
+        }
     }
 } 

src/Rendering/babylon.renderingManager.ts

@@ -26,9 +26,6 @@
         private _depthStencilBufferAlreadyCleaned: boolean;
 
         private _currentIndex: number;
-        private _currentActiveMeshes: AbstractMesh[];
-        private _currentRenderParticles: boolean;
-        private _currentRenderSprites: boolean;
 
         private _autoClearDepthStencil: { [id:number]: RenderingManageAutoClearOptions } = {};
         private _customOpaqueSortCompareFn: { [id:number]: (a: SubMesh, b: SubMesh) => number } = {};
@@ -42,54 +39,7 @@
             for (let i = RenderingManager.MIN_RENDERINGGROUPS; i < RenderingManager.MAX_RENDERINGGROUPS; i++) {
                 this._autoClearDepthStencil[i] = { autoClear: true, depth:true, stencil: true };
             }
-        }
-
-        private _renderParticles(index: number, activeMeshes: AbstractMesh[]): void {
-            if (this._scene._activeParticleSystems.length === 0) {
-                return;
-            }
-
-            // Particles
-            var activeCamera = this._scene.activeCamera;
-            this._scene._particlesDuration.beginMonitoring();
-            for (var particleIndex = 0; particleIndex < this._scene._activeParticleSystems.length; particleIndex++) {
-                var particleSystem = this._scene._activeParticleSystems.data[particleIndex];
-
-                if (particleSystem.renderingGroupId !== index) {
-                    continue;
-                }
-
-                if ((activeCamera.layerMask & particleSystem.layerMask) === 0) {
-                    continue;
-                }
-
-                this._clearDepthStencilBuffer();
-
-                if (!particleSystem.emitter.position || !activeMeshes || activeMeshes.indexOf(particleSystem.emitter) !== -1) {
-                    this._scene._activeParticles.addCount(particleSystem.render(), false);
-                }
-            }
-            this._scene._particlesDuration.endMonitoring(false);
-        }
-
-        private _renderSprites(index: number): void {
-            if (!this._scene.spritesEnabled || this._scene.spriteManagers.length === 0) {
-                return;
-            }
-
-            // Sprites       
-            var activeCamera = this._scene.activeCamera;
-            this._scene._spritesDuration.beginMonitoring();
-            for (var id = 0; id < this._scene.spriteManagers.length; id++) {
-                var spriteManager = this._scene.spriteManagers[id];
-
-                if (spriteManager.renderingGroupId === index && ((activeCamera.layerMask & spriteManager.layerMask) !== 0)) {
-                    this._clearDepthStencilBuffer();
-                    spriteManager.render();
-                }
-            }
-            this._scene._spritesDuration.endMonitoring(false);
-        }
+        }        
 
         private _clearDepthStencilBuffer(depth = true, stencil = true): void {
             if (this._depthStencilBufferAlreadyCleaned) {
@@ -100,19 +50,9 @@
             this._depthStencilBufferAlreadyCleaned = true;
         }
 
-        private _renderSpritesAndParticles() {
-            if (this._currentRenderSprites) {
-                this._renderSprites(this._currentIndex);
-            }
-
-            if (this._currentRenderParticles) {
-                this._renderParticles(this._currentIndex, this._currentActiveMeshes);
-            }
-        }
-
         public render(customRenderFunction: (opaqueSubMeshes: SmartArray<SubMesh>, transparentSubMeshes: SmartArray<SubMesh>, alphaTestSubMeshes: SmartArray<SubMesh>) => void,
-            activeMeshes: AbstractMesh[], renderParticles: boolean, renderSprites: boolean): void {
-
+            activeMeshes: AbstractMesh[], renderParticles: boolean, renderSprites: boolean): void {          
+                  
             // Check if there's at least on observer on the onRenderingGroupObservable and initialize things to fire it
             let observable = this._scene.onRenderingGroupObservable.hasObservers() ? this._scene.onRenderingGroupObservable : null;
             let info: RenderingGroupInfo = null;
@@ -125,11 +65,16 @@
                 info.camera = this._scene.activeCamera;
             }
 
-            this._currentActiveMeshes = activeMeshes;
-            this._currentRenderParticles = renderParticles;
-            this._currentRenderSprites = renderSprites;
+            // Dispatch sprites
+            if (renderSprites) {
+                for (let index = 0; index < this._scene.spriteManagers.length; index++) {
+                    var manager = this._scene.spriteManagers[index];
+                    this.dispatchSprites(manager);
+                }
+            }
 
-            for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
+            // Render
+            for (let index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 this._depthStencilBufferAlreadyCleaned = index === RenderingManager.MIN_RENDERINGGROUPS;
                 var renderingGroup = this._renderingGroups[index];
 
@@ -158,41 +103,25 @@
                         observable.notifyObservers(info, renderingGroupMask);
                     }
 
-                    if (!renderingGroup.onBeforeTransparentRendering) {
-                        renderingGroup.onBeforeTransparentRendering = this._renderSpritesAndParticles.bind(this);
-                    }
-
                     // Fire PRETRANSPARENT stage
                     if (observable) {
                         info.renderStage = RenderingGroupInfo.STAGE_PRETRANSPARENT;
                         observable.notifyObservers(info, renderingGroupMask);
                     }
 
-                    renderingGroup.render(customRenderFunction);
+                    renderingGroup.render(customRenderFunction, renderSprites, renderParticles, activeMeshes);
 
                     // Fire POSTTRANSPARENT stage
                     if (observable) {
                         info.renderStage = RenderingGroupInfo.STAGE_POSTTRANSPARENT;
                         observable.notifyObservers(info, renderingGroupMask);
                     }
-                } else {
-                    this._renderSpritesAndParticles();
-
-                    if (observable) {
-                        let renderingGroupMask = Math.pow(2, index);
-                        info.renderStage = RenderingGroupInfo.STAGE_PRECLEAR;
-                        info.renderingGroupId = index;
-                        observable.notifyObservers(info, renderingGroupMask);
-
-                        info.renderStage = RenderingGroupInfo.STAGE_POSTTRANSPARENT;
-                        observable.notifyObservers(info, renderingGroupMask);
-                    }
                 }
             }
         }
 
         public reset(): void {
-            for (var index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
+            for (let index = RenderingManager.MIN_RENDERINGGROUPS; index < RenderingManager.MAX_RENDERINGGROUPS; index++) {
                 var renderingGroup = this._renderingGroups[index];
                 if (renderingGroup) {
                     renderingGroup.prepare();
@@ -200,10 +129,7 @@
             }
         }
 
-        public dispatch(subMesh: SubMesh): void {
-            var mesh = subMesh.getMesh();
-            var renderingGroupId = mesh.renderingGroupId || 0;
-
+        private _prepareRenderingGroup(renderingGroupId: number): void {
             if (!this._renderingGroups[renderingGroupId]) {
                 this._renderingGroups[renderingGroupId] = new RenderingGroup(renderingGroupId, this._scene,
                     this._customOpaqueSortCompareFn[renderingGroupId],
@@ -211,6 +137,29 @@
                     this._customTransparentSortCompareFn[renderingGroupId]
                 );
             }
+        }
+
+        public dispatchSprites(spriteManager: SpriteManager) {
+            var renderingGroupId = spriteManager.renderingGroupId || 0;
+
+            this._prepareRenderingGroup(renderingGroupId);
+
+            this._renderingGroups[renderingGroupId].dispatchSprites(spriteManager);
+        }
+
+        public dispatchParticles(particleSystem: ParticleSystem) {
+            var renderingGroupId = particleSystem.renderingGroupId || 0;
+
+            this._prepareRenderingGroup(renderingGroupId);
+
+            this._renderingGroups[renderingGroupId].dispatchParticles(particleSystem);
+        }
+
+        public dispatch(subMesh: SubMesh): void {
+            var mesh = subMesh.getMesh();
+            var renderingGroupId = mesh.renderingGroupId || 0;
+
+            this._prepareRenderingGroup(renderingGroupId);
 
             this._renderingGroups[renderingGroupId].dispatch(subMesh);
         }

src/babylon.scene.ts

@@ -2046,6 +2046,7 @@
                     if (!particleSystem.emitter.position || (particleSystem.emitter && particleSystem.emitter.isEnabled())) {
                         this._activeParticleSystems.push(particleSystem);
                         particleSystem.animate();
+                        this._renderingManager.dispatchParticles(particleSystem);
                     }
                 }
                 Tools.EndPerformanceCounter("Particles", this.particleSystems.length > 0);