WebGPURenderer: Enable dynamic resizing of the `cameras` array in `ArrayCamera` (#30353)

src/nodes/accessors/Camera.js

@@ -36,7 +36,7 @@ export const cameraProjectionMatrix = /*@__PURE__*/ ( Fn( ( { camera } ) => {
 
 	let cameraProjectionMatrix;
 
-	if ( camera.isArrayCamera ) {
+	if ( camera.isArrayCamera && camera.cameras.length > 0 ) {
 
 		const matrices = [];
 
@@ -76,7 +76,7 @@ export const cameraViewMatrix = /*@__PURE__*/ ( Fn( ( { camera } ) => {
 
 	let cameraViewMatrix;
 
-	if ( camera.isArrayCamera ) {
+	if ( camera.isArrayCamera && camera.cameras.length > 0 ) {
 
 		const matrices = [];
 

src/renderers/common/RenderObject.js

@@ -1,4 +1,4 @@
-import { hashString } from '../../nodes/core/NodeUtils.js';
+import { hash, hashString } from '../../nodes/core/NodeUtils.js';
 
 let _id = 0;
 
@@ -770,9 +770,15 @@ class RenderObject {
 
 		}
 
+		if ( this.camera.isArrayCamera ) {
+
+			cacheKey = hash( cacheKey, this.camera.cameras.length );
+
+		}
+
 		if ( this.object.receiveShadow ) {
 
-			cacheKey += 1;
+			cacheKey = hash( cacheKey, 1 );
 
 		}
 

src/renderers/webgl-fallback/WebGLBackend.js

@@ -1103,12 +1103,13 @@ class WebGLBackend extends Backend {
 
 		};
 
-		if ( renderObject.camera.isArrayCamera ) {
+		if ( renderObject.camera.isArrayCamera && renderObject.camera.cameras.length > 0 ) {
 
 			const cameraData = this.get( renderObject.camera );
 			const cameras = renderObject.camera.cameras;
+			const cameraIndex = renderObject.getBindingGroup( 'cameraIndex' ).bindings[ 0 ];
 
-			if ( cameraData.indexesGPU === undefined ) {
+			if ( cameraData.indexesGPU === undefined || cameraData.indexesGPU.length !== cameras.length ) {
 
 				const data = new Uint32Array( [ 0, 0, 0, 0 ] );
 				const indexesGPU = [];
@@ -1130,7 +1131,6 @@ class WebGLBackend extends Backend {
 
 			}
 
-			const cameraIndex = renderObject.getBindingGroup( 'cameraIndex' ).bindings[ 0 ];
 			const cameraIndexData = this.get( cameraIndex );
 			const pixelRatio = this.renderer.getPixelRatio();
 

src/renderers/webgpu/WebGPUBackend.js

@@ -1264,14 +1264,14 @@ class WebGPUBackend extends Backend {
 
 		};
 
-		if ( renderObject.camera.isArrayCamera ) {
+		if ( renderObject.camera.isArrayCamera && renderObject.camera.cameras.length > 0 ) {
 
 			const cameraData = this.get( renderObject.camera );
 			const cameras = renderObject.camera.cameras;
+			const cameraIndex = renderObject.getBindingGroup( 'cameraIndex' );
 
-			if ( cameraData.indexesGPU === undefined ) {
+			if ( cameraData.indexesGPU === undefined || cameraData.indexesGPU.length !== cameras.length ) {
 
-				const cameraIndex = renderObject.getBindingGroup( 'cameraIndex' );
 				const bindingsData = this.get( cameraIndex );
 				const indexesGPU = [];
 
@@ -1288,7 +1288,6 @@ class WebGPUBackend extends Backend {
 				}
 
 				cameraData.indexesGPU = indexesGPU; // TODO: Create a global library for this
-				cameraData.cameraIndex = cameraIndex;
 
 			}
 
@@ -1311,7 +1310,7 @@ class WebGPUBackend extends Backend {
 						context.viewportValue.maxDepth
 					);
 
-					passEncoderGPU.setBindGroup( cameraData.cameraIndex.index, cameraData.indexesGPU[ i ] );
+					passEncoderGPU.setBindGroup( cameraIndex.index, cameraData.indexesGPU[ i ] );
 
 					draw();