WebGPURenderer: Reduce overhead from excessive cache sharing for postprocessing nodes.

src/core/RenderTarget.js

@@ -4,6 +4,8 @@ import { LinearFilter } from '../constants.js';
 import { Vector4 } from '../math/Vector4.js';
 import { Source } from '../textures/Source.js';
 
+let _RenderTargetId = 0;
+
 /*
  In options, we can specify:
  * Texture parameters for an auto-generated target texture
@@ -26,6 +28,8 @@ class RenderTarget extends EventDispatcher {
 
 		this.viewport = new Vector4( 0, 0, width, height );
 
+		Object.defineProperty( this, 'id', { value: _RenderTargetId ++ } );
+
 		const image = { width: width, height: height, depth: 1 };
 
 		options = Object.assign( {
@@ -67,6 +71,8 @@ class RenderTarget extends EventDispatcher {
 
 		this.samples = options.samples;
 
+		this.isolate = false;
+
 	}
 
 	get texture() {

src/nodes/display/AfterImageNode.js

@@ -27,6 +27,7 @@ class AfterImageNode extends TempNode {
 
 		this._compRT = new RenderTarget();
 		this._compRT.texture.name = 'AfterImageNode.comp';
+		this._compRT.isolate = true;
 
 		this._oldRT = new RenderTarget();
 		this._oldRT.texture.name = 'AfterImageNode.old';

src/nodes/display/BloomNode.js

@@ -57,13 +57,15 @@ class BloomNode extends TempNode {
 
 			renderTargetHorizontal.texture.name = 'UnrealBloomPass.h' + i;
 			renderTargetHorizontal.texture.generateMipmaps = false;
+			renderTargetHorizontal.isolate = true;
 
 			this._renderTargetsHorizontal.push( renderTargetHorizontal );
 
 			const renderTargetVertical = new RenderTarget( 1, 1, { type: HalfFloatType } );
 
 			renderTargetVertical.texture.name = 'UnrealBloomPass.v' + i;
 			renderTargetVertical.texture.generateMipmaps = false;
+			renderTargetVertical.isolate = true;
 
 			this._renderTargetsVertical.push( renderTargetVertical );
 

src/nodes/display/GaussianBlurNode.js

@@ -10,11 +10,7 @@ import QuadMesh from '../../renderers/common/QuadMesh.js';
 import { Vector2 } from '../../math/Vector2.js';
 import { RenderTarget } from '../../core/RenderTarget.js';
 
-// WebGPU: The use of a single QuadMesh for both gaussian blur passes results in a single RenderObject with a SampledTexture binding that
-// alternates between source textures and triggers creation of new BindGroups and BindGroupLayouts every frame.
-
-const _quadMesh1 = /*@__PURE__*/ new QuadMesh();
-const _quadMesh2 = /*@__PURE__*/ new QuadMesh();
+const _quadMesh = /*@__PURE__*/ new QuadMesh();
 
 class GaussianBlurNode extends TempNode {
 
@@ -34,6 +30,8 @@ class GaussianBlurNode extends TempNode {
 		this._verticalRT = new RenderTarget();
 		this._verticalRT.texture.name = 'GaussianBlurNode.vertical';
 
+		this._verticalRT.isolate = true;
+
 		this._textureNode = passTexture( this, this._verticalRT.texture );
 
 		this.updateBeforeType = NodeUpdateType.RENDER;
@@ -65,8 +63,7 @@ class GaussianBlurNode extends TempNode {
 
 		const currentTexture = textureNode.value;
 
-		_quadMesh1.material = this._material;
-		_quadMesh2.material = this._material;
+		_quadMesh.material = this._material;
 
 		this.setSize( map.image.width, map.image.height );
 
@@ -85,7 +82,7 @@ class GaussianBlurNode extends TempNode {
 
 		this._passDirection.value.set( 1, 0 );
 
-		_quadMesh1.render( renderer );
+		_quadMesh.render( renderer );
 
 		// vertical
 
@@ -94,7 +91,7 @@ class GaussianBlurNode extends TempNode {
 
 		this._passDirection.value.set( 0, 1 );
 
-		_quadMesh2.render( renderer );
+		_quadMesh.render( renderer );
 
 		// restore
 

src/renderers/common/RenderContexts.js

@@ -26,6 +26,8 @@ class RenderContexts {
 
 			attachmentState = `${ count }:${ format }:${ renderTarget.samples }:${ renderTarget.depthBuffer }:${ renderTarget.stencilBuffer }`;
 
+			if ( renderTarget.isolate === true ) attachmentState += `:${ renderTarget.id }`;
+
 		}
 
 		const chainMap = this.getChainMap( attachmentState );

src/renderers/common/extras/PMREMGenerator.js

@@ -692,6 +692,7 @@ function _createRenderTarget( width, height, params ) {
 	cubeUVRenderTarget.texture.name = 'PMREM.cubeUv';
 	cubeUVRenderTarget.texture.isPMREMTexture = true;
 	cubeUVRenderTarget.scissorTest = true;
+	cubeUVRenderTarget.isolate = true;
 	return cubeUVRenderTarget;
 
 }