FrameGraph: improved support for MSAA (resolve) textures + renaming of CullPass to ObjectListPass

packages/dev/core/src/Decorators/nodeDecorator.ts

@@ -17,6 +17,8 @@ export const enum PropertyTypeForEdition {
     Vector3,
     /** property is a list of values */
     List,
+    /** property is a Color3 */
+    Color3,
     /** property is a Color4 */
     Color4,
     /** property (int) should be edited as a combo box with a list of sampling modes */

packages/dev/core/src/FrameGraph/Node/Blocks/Rendering/baseObjectRendererBlock.ts

@@ -246,6 +246,26 @@ export class NodeRenderGraphBaseObjectRendererBlock extends NodeRenderGraphBlock
         this._createFrameGraphObjectWithState(this.doNotChangeAspectRatio, value);
     }
 
+    /** If true, MSAA color textures will be resolved at the end of the render pass (default: true) */
+    @editableInPropertyPage("Resolve MSAA colors", PropertyTypeForEdition.Boolean, "PROPERTIES")
+    public get resolveMSAAColors() {
+        return this._frameGraphTask.resolveMSAAColors;
+    }
+
+    public set resolveMSAAColors(value: boolean) {
+        this._frameGraphTask.resolveMSAAColors = value;
+    }
+
+    /** If true, MSAA depth texture will be resolved at the end of the render pass (default: false) */
+    @editableInPropertyPage("Resolve MSAA depth", PropertyTypeForEdition.Boolean, "PROPERTIES")
+    public get resolveMSAADepth() {
+        return this._frameGraphTask.resolveMSAADepth;
+    }
+
+    public set resolveMSAADepth(value: boolean) {
+        this._frameGraphTask.resolveMSAADepth = value;
+    }
+
     /**
      * Gets the current class name
      * @returns the class name
@@ -358,6 +378,8 @@ export class NodeRenderGraphBaseObjectRendererBlock extends NodeRenderGraphBlock
         codes.push(`${this._codeVariableName}.enableOutlineRendering = ${this.enableOutlineRendering};`);
         codes.push(`${this._codeVariableName}.disableShadows = ${this.disableShadows};`);
         codes.push(`${this._codeVariableName}.renderInLinearSpace = ${this.renderInLinearSpace};`);
+        codes.push(`${this._codeVariableName}.resolveMSAAColors = ${this.resolveMSAAColors};`);
+        codes.push(`${this._codeVariableName}.resolveMSAADepth = ${this.resolveMSAADepth};`);
         return super._dumpPropertiesCode() + codes.join("\n");
     }
 
@@ -373,6 +395,8 @@ export class NodeRenderGraphBaseObjectRendererBlock extends NodeRenderGraphBlock
         serializationObject.enableOutlineRendering = this.enableOutlineRendering;
         serializationObject.disableShadows = this.disableShadows;
         serializationObject.renderInLinearSpace = this.renderInLinearSpace;
+        serializationObject.resolveMSAAColors = this.resolveMSAAColors;
+        serializationObject.resolveMSAADepth = this.resolveMSAADepth;
         return serializationObject;
     }
 
@@ -388,5 +412,7 @@ export class NodeRenderGraphBaseObjectRendererBlock extends NodeRenderGraphBlock
         this.enableOutlineRendering = serializationObject.enableOutlineRendering ?? true;
         this.disableShadows = serializationObject.disableShadows;
         this.renderInLinearSpace = !!serializationObject.renderInLinearSpace;
+        this.resolveMSAAColors = serializationObject.resolveMSAAColors ?? true;
+        this.resolveMSAADepth = serializationObject.resolveMSAADepth ?? false;
     }
 }

packages/dev/core/src/FrameGraph/Node/Blocks/Rendering/geometryRendererBlock.ts

@@ -202,6 +202,26 @@ export class NodeRenderGraphGeometryRendererBlock extends NodeRenderGraphBlock {
         this._frameGraphTask.dontRenderWhenMaterialDepthWriteIsDisabled = value;
     }
 
+    /** If true, MSAA color textures will be resolved at the end of the render pass (default: true) */
+    @editableInPropertyPage("Resolve MSAA colors", PropertyTypeForEdition.Boolean, "PROPERTIES")
+    public get resolveMSAAColors() {
+        return this._frameGraphTask.resolveMSAAColors;
+    }
+
+    public set resolveMSAAColors(value: boolean) {
+        this._frameGraphTask.resolveMSAAColors = value;
+    }
+
+    /** If true, MSAA depth texture will be resolved at the end of the render pass (default: false) */
+    @editableInPropertyPage("Resolve MSAA depth", PropertyTypeForEdition.Boolean, "PROPERTIES")
+    public get resolveMSAADepth() {
+        return this._frameGraphTask.resolveMSAADepth;
+    }
+
+    public set resolveMSAADepth(value: boolean) {
+        this._frameGraphTask.resolveMSAADepth = value;
+    }
+
     // View depth
     @editableInPropertyPage("View depth format", PropertyTypeForEdition.TextureFormat, "GEOMETRY BUFFERS")
     public viewDepthFormat = Constants.TEXTUREFORMAT_RED;
@@ -509,6 +529,8 @@ export class NodeRenderGraphGeometryRendererBlock extends NodeRenderGraphBlock {
         codes.push(`${this._codeVariableName}.velocityType = ${this.velocityType};`);
         codes.push(`${this._codeVariableName}.linearVelocityFormat = ${this.linearVelocityFormat};`);
         codes.push(`${this._codeVariableName}.linearVelocityType = ${this.linearVelocityType};`);
+        codes.push(`${this._codeVariableName}.resolveMSAAColors = ${this.resolveMSAAColors};`);
+        codes.push(`${this._codeVariableName}.resolveMSAADepth = ${this.resolveMSAADepth};`);
         return super._dumpPropertiesCode() + codes.join("\n");
     }
 
@@ -542,6 +564,8 @@ export class NodeRenderGraphGeometryRendererBlock extends NodeRenderGraphBlock {
         serializationObject.velocityType = this.velocityType;
         serializationObject.linearVelocityFormat = this.linearVelocityFormat;
         serializationObject.linearVelocityType = this.linearVelocityType;
+        serializationObject.resolveMSAAColors = this.resolveMSAAColors;
+        serializationObject.resolveMSAADepth = this.resolveMSAADepth;
         return serializationObject;
     }
 
@@ -575,6 +599,8 @@ export class NodeRenderGraphGeometryRendererBlock extends NodeRenderGraphBlock {
         this.velocityType = serializationObject.velocityType;
         this.linearVelocityFormat = serializationObject.linearVelocityFormat;
         this.linearVelocityType = serializationObject.linearVelocityType;
+        this.resolveMSAAColors = serializationObject.resolveMSAAColors ?? true;
+        this.resolveMSAADepth = serializationObject.resolveMSAADepth ?? false;
     }
 }
 

packages/dev/core/src/FrameGraph/Node/Blocks/Textures/clearBlock.ts

@@ -135,8 +135,8 @@ export class NodeRenderGraphClearBlock extends NodeRenderGraphBlock {
     protected override _buildBlock(state: NodeRenderGraphBuildState) {
         super._buildBlock(state);
 
-        this._propagateInputValueToOutput(this.target, this.output);
-        this._propagateInputValueToOutput(this.depth, this.outputDepth);
+        this.output.value = this._frameGraphTask.outputTexture;
+        this.outputDepth.value = this._frameGraphTask.outputDepthTexture;
 
         this._frameGraphTask.targetTexture = this.target.connectedPoint?.value as FrameGraphTextureHandle;
         this._frameGraphTask.depthTexture = this.depth.connectedPoint?.value as FrameGraphTextureHandle;

packages/dev/core/src/FrameGraph/Node/Blocks/Textures/generateMipmapsBlock.ts

@@ -60,7 +60,7 @@ export class NodeRenderGraphGenerateMipmapsBlock extends NodeRenderGraphBlock {
     protected override _buildBlock(state: NodeRenderGraphBuildState) {
         super._buildBlock(state);
 
-        this._propagateInputValueToOutput(this.target, this.output);
+        this.output.value = this._frameGraphTask.outputTexture;
 
         this._frameGraphTask.targetTexture = this.target.connectedPoint?.value as FrameGraphTextureHandle;
     }

packages/dev/core/src/FrameGraph/Node/nodeRenderGraph.ts

@@ -162,8 +162,10 @@ export class NodeRenderGraph {
         this._frameGraph.name = name;
 
         if (options.rebuildGraphOnEngineResize) {
-            this._resizeObserver = this._engine.onResizeObservable.add(() => {
+            this._resizeObserver = this._engine.onResizeObservable.add(async () => {
                 this.build();
+
+                await this.whenReadyAsync();
             });
         }
     }

packages/dev/core/src/FrameGraph/Passes/cullPass.ts → packages/dev/core/src/FrameGraph/Passes/objectListPass.ts

@@ -2,31 +2,31 @@ import type { Nullable, AbstractEngine, IFrameGraphPass, FrameGraphContext, Fram
 import { FrameGraphPass } from "./pass";
 
 /**
- * Cull pass used to filter objects that are not visible.
+ * Object list pass used to generate a list of objects.
  */
-export class FrameGraphCullPass extends FrameGraphPass<FrameGraphContext> {
+export class FrameGraphObjectListPass extends FrameGraphPass<FrameGraphContext> {
     protected readonly _engine: AbstractEngine;
     protected _objectList: FrameGraphObjectList;
 
     /**
-     * Checks if a pass is a cull pass.
+     * Checks if a pass is an object list pass.
      * @param pass The pass to check.
-     * @returns True if the pass is a cull pass, else false.
+     * @returns True if the pass is an object list pass, else false.
      */
-    public static IsCullPass(pass: IFrameGraphPass): pass is FrameGraphCullPass {
-        return (pass as FrameGraphCullPass).setObjectList !== undefined;
+    public static IsObjectListPass(pass: IFrameGraphPass): pass is FrameGraphObjectListPass {
+        return (pass as FrameGraphObjectListPass).setObjectList !== undefined;
     }
 
     /**
-     * Gets the object list used by the cull pass.
+     * Gets the object list used by the pass.
      */
     public get objectList(): FrameGraphObjectList {
         return this._objectList;
     }
 
     /**
-     * Sets the object list to use for culling.
-     * @param objectList The object list to use for culling.
+     * Sets the object list to use for the pass.
+     * @param objectList The object list to use for the pass.
      */
     public setObjectList(objectList: FrameGraphObjectList) {
         this._objectList = objectList;

packages/dev/core/src/FrameGraph/Passes/renderPass.ts

@@ -21,19 +21,26 @@ export class FrameGraphRenderPass extends FrameGraphPass<FrameGraphRenderContext
     }
 
     /**
-     * Gets the render target(s) used by the render pass.
+     * Gets the handle(s) of the render target(s) used by the render pass.
      */
     public get renderTarget(): FrameGraphTextureHandle | FrameGraphTextureHandle[] | undefined {
         return this._renderTarget;
     }
 
     /**
-     * Gets the render target depth used by the render pass.
+     * Gets the handle of the render target depth used by the render pass.
      */
     public get renderTargetDepth(): FrameGraphTextureHandle | undefined {
         return this._renderTargetDepth;
     }
 
+    /**
+     * Gets the frame graph render target used by the render pass.
+     */
+    public get frameGraphRenderTarget(): FrameGraphRenderTarget | undefined {
+        return this._frameGraphRenderTarget;
+    }
+
     /**
      * If true, the depth attachment will be read-only (may allow some optimizations in WebGPU)
      */
@@ -121,6 +128,13 @@ export class FrameGraphRenderPass extends FrameGraphPass<FrameGraphRenderContext
         super._execute();
 
         this._context._flushDebugMessages();
+
+        const renderTargetWrapper = this._frameGraphRenderTarget.renderTargetWrapper;
+        if (renderTargetWrapper && (renderTargetWrapper.resolveMSAAColors || renderTargetWrapper.resolveMSAADepth || renderTargetWrapper.resolveMSAAStencil)) {
+            // Unbinding the render target will trigger resolving MSAA textures.
+            this._context.bindRenderTarget(undefined, `frame graph render pass - ${this.name} - resolve MSAA`, true);
+            this._context._flushDebugMessages();
+        }
     }
 
     /** @internal */

packages/dev/core/src/FrameGraph/Tasks/Misc/cullObjectsTask.ts

@@ -46,7 +46,7 @@ export class FrameGraphCullObjectsTask extends FrameGraphTask {
         this.outputObjectList.meshes = this.objectList.meshes;
         this.outputObjectList.particleSystems = this.objectList.particleSystems;
 
-        const pass = this._frameGraph.addCullPass(this.name);
+        const pass = this._frameGraph.addObjectListPass(this.name);
 
         pass.setObjectList(this.outputObjectList);
         pass.setExecuteFunc((_context) => {
@@ -82,7 +82,7 @@ export class FrameGraphCullObjectsTask extends FrameGraphTask {
             }
         });
 
-        const passDisabled = this._frameGraph.addCullPass(this.name + "_disabled", true);
+        const passDisabled = this._frameGraph.addObjectListPass(this.name + "_disabled", true);
 
         passDisabled.setObjectList(this.outputObjectList);
         passDisabled.setExecuteFunc((_context) => {

packages/dev/core/src/FrameGraph/Tasks/Rendering/geometryRendererTask.ts

@@ -115,6 +115,16 @@ export class FrameGraphGeometryRendererTask extends FrameGraphTask {
      */
     public dontRenderWhenMaterialDepthWriteIsDisabled = true;
 
+    /**
+     * If true, the output geometry texture(s) will be resolved at the end of the render pass, if samples is greater than 1 (default: true)
+     */
+    public resolveMSAAColors = true;
+
+    /**
+     * If true, depthTexture will be resolved at the end of the render pass, if this texture is provided and samples is greater than 1 (default: true)
+     */
+    public resolveMSAADepth = false;
+
     /**
      * The list of texture descriptions used by the geometry renderer task.
      */
@@ -403,6 +413,9 @@ export class FrameGraphGeometryRendererTask extends FrameGraphTask {
             this._renderer.renderList = this.objectList.meshes;
             this._renderer.particleSystemList = this.objectList.particleSystems;
 
+            pass.frameGraphRenderTarget!.renderTargetWrapper!.resolveMSAAColors = this.resolveMSAAColors;
+            pass.frameGraphRenderTarget!.renderTargetWrapper!.resolveMSAADepth = this.resolveMSAADepth;
+
             context.setDepthStates(this.depthTest && depthEnabled, this.depthWrite && depthEnabled);
 
             this._clearAttachmentsLayout.forEach((layout, clearType) => {

packages/dev/core/src/FrameGraph/Tasks/Rendering/objectRendererTask.ts

@@ -185,6 +185,16 @@ export class FrameGraphObjectRendererTask extends FrameGraphTask {
         this._renderer.enableOutlineRendering = value;
     }
 
+    /**
+     * If true, targetTexture will be resolved at the end of the render pass, if this/these texture(s) is/are MSAA (default: true)
+     */
+    public resolveMSAAColors = true;
+
+    /**
+     * If true, depthTexture will be resolved at the end of the render pass, if this texture is provided and is MSAA (default: false).
+     */
+    public resolveMSAADepth = false;
+
     /**
      * The output texture.
      * This texture will point to the same texture than the targetTexture property.
@@ -318,6 +328,12 @@ export class FrameGraphObjectRendererTask extends FrameGraphTask {
             this._renderer.renderList = this.objectList.meshes;
             this._renderer.particleSystemList = this.objectList.particleSystems;
 
+            const renderTargetWrapper = pass.frameGraphRenderTarget!.renderTargetWrapper;
+            if (renderTargetWrapper) {
+                renderTargetWrapper.resolveMSAAColors = this.resolveMSAAColors;
+                renderTargetWrapper.resolveMSAADepth = this.resolveMSAADepth;
+            }
+
             // The cast to "any" is to avoid an error in ES6 in case you don't import boundingBoxRenderer
             const boundingBoxRenderer = (this as any).getBoundingBoxRenderer?.() as Nullable<BoundingBoxRenderer>;
 

packages/dev/core/src/FrameGraph/Tasks/Texture/clearTextureTask.ts

@@ -69,7 +69,7 @@ export class FrameGraphClearTextureTask extends FrameGraphTask {
         this.outputDepthTexture = this._frameGraph.textureManager.createDanglingHandle();
     }
 
-    public record(): FrameGraphRenderPass {
+    public record(skipCreationOfDisabledPasses = false): FrameGraphRenderPass {
         if (this.targetTexture === undefined && this.depthTexture === undefined) {
             throw new Error(`FrameGraphClearTextureTask ${this.name}: targetTexture and depthTexture can't both be undefined.`);
         }
@@ -112,11 +112,13 @@ export class FrameGraphClearTextureTask extends FrameGraphTask {
             context.clearAttachments(color, attachments, !!this.clearColor, !!this.clearDepth, !!this.clearStencil, this.stencilValue);
         });
 
-        const passDisabled = this._frameGraph.addRenderPass(this.name + "_disabled", true);
+        if (!skipCreationOfDisabledPasses) {
+            const passDisabled = this._frameGraph.addRenderPass(this.name + "_disabled", true);
 
-        passDisabled.setRenderTarget(targetTextures);
-        passDisabled.setRenderTargetDepth(this.depthTexture);
-        passDisabled.setExecuteFunc((_context) => {});
+            passDisabled.setRenderTarget(targetTextures);
+            passDisabled.setRenderTargetDepth(this.depthTexture);
+            passDisabled.setExecuteFunc((_context) => {});
+        }
 
         return pass;
     }