WebGPURenderer: create invalidation array once for WebGL MSAA (#27505)

Co-authored-by: aardgoose <[email protected]>

examples/jsm/renderers/webgl/WebGLBackend.js

@@ -141,22 +141,11 @@ class WebGLBackend extends Backend {
 
 			const renderTargetContextData = this.get( renderContext.renderTarget );
 
-			const { samples, stencilBuffer } = renderContext.renderTarget;
+			const { samples } = renderContext.renderTarget;
 			const fb = renderTargetContextData.framebuffer;
 
 			if ( samples > 0 ) {
 
-				const invalidationArray = [];
-				const depthStyle = stencilBuffer ? gl.DEPTH_STENCIL_ATTACHMENT : gl.DEPTH_ATTACHMENT;
-
-				invalidationArray.push( gl.COLOR_ATTACHMENT0 );
-
-				if ( renderTargetContextData.depthBuffer ) {
-
-					invalidationArray.push( depthStyle );
-
-				}
-
 				// TODO For loop support MRT
 				const msaaFrameBuffer = renderTargetContextData.msaaFrameBuffer;
 
@@ -166,7 +155,7 @@ class WebGLBackend extends Backend {
 
 				gl.blitFramebuffer( 0, 0, renderContext.width, renderContext.height, 0, 0, renderContext.width, renderContext.height, gl.COLOR_BUFFER_BIT, gl.NEAREST );
 
-				gl.invalidateFramebuffer( gl.READ_FRAMEBUFFER, invalidationArray );
+				gl.invalidateFramebuffer( gl.READ_FRAMEBUFFER, renderTargetContextData.invalidationArray );
 
 			}
 
@@ -880,7 +869,7 @@ class WebGLBackend extends Backend {
 
 			const renderTarget = renderContext.renderTarget;
 			const renderTargetContextData = this.get( renderTarget );
-			const { samples } = renderTarget;
+			const { samples, stencilBuffer } = renderTarget;
 			const cubeFace = this.renderer._activeCubeFace;
 			const isCube = renderTarget.isWebGLCubeRenderTarget === true;
 
@@ -943,8 +932,9 @@ class WebGLBackend extends Backend {
 				if ( renderContext.depthTexture !== null ) {
 
 					const textureData = this.get( renderContext.depthTexture );
+					const depthStyle = stencilBuffer ? gl.DEPTH_STENCIL_ATTACHMENT : gl.DEPTH_ATTACHMENT;
 
-					gl.framebufferTexture2D( gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, textureData.textureGPU, 0 );
+					gl.framebufferTexture2D( gl.FRAMEBUFFER, depthStyle, gl.TEXTURE_2D, textureData.textureGPU, 0 );
 
 				}
 
@@ -954,6 +944,8 @@ class WebGLBackend extends Backend {
 
 				if ( msaaFb === undefined ) {
 
+					const invalidationArray = [];
+
 					msaaFb = gl.createFramebuffer();
 
 					state.bindFramebuffer( gl.FRAMEBUFFER, msaaFb );
@@ -968,6 +960,8 @@ class WebGLBackend extends Backend {
 					gl.renderbufferStorageMultisample( gl.RENDERBUFFER, samples, textureData.glInternalFormat, renderContext.width, renderContext.height );
 					gl.framebufferRenderbuffer( gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.RENDERBUFFER, msaaRenderbuffer );
 
+					invalidationArray.push( gl.COLOR_ATTACHMENT0 );
+
 					renderTargetContextData.msaaRenderbuffer = msaaRenderbuffer;
 					renderTargetContextData.msaaFrameBuffer = msaaFb;
 
@@ -978,8 +972,13 @@ class WebGLBackend extends Backend {
 
 						renderTargetContextData.depthRenderbuffer = depthRenderbuffer;
 
+						const depthStyle = stencilBuffer ? gl.DEPTH_STENCIL_ATTACHMENT : gl.DEPTH_ATTACHMENT;
+						invalidationArray.push( depthStyle );
+
 					}
 
+					renderTargetContextData.invalidationArray = invalidationArray;
+
 				}
 
 				currentFrameBuffer = renderTargetContextData.msaaFrameBuffer;