WebGPURenderer: Improve ArrayCamera performance and fixes

[sunag]

Related issue: #28968 (comment)

Description

As discussed before the cameraViewMatrix is updated through an uniform array, I'm afraid this won't work on WebGPU because the process is executed at the end of the pass, this may make it difficult to update the index as imagined, so I'm not sure if this will perform well, what I'll try is to do it using an instances approach later. The example work in WebGL as expected.

The PR fix cameraViewMatrix of its subcameras, only the viewport were updated.

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	339.53 79.09	339.53 79.09	+0 B +0 B
WebGPU	491.02 136.44	492.98 137.03	+1.96 kB +588 B
WebGPU Nodes	490.49 136.34	492.45 136.93	+1.96 kB +593 B

🌳 Bundle size after tree-shaking

Minimal build including a renderer, camera, empty scene, and dependencies.

	Before	After	Diff
WebGL	465.39 112.16	465.41 112.16	+13 B +2 B
WebGPU	561.56 152.15	563.51 152.7	+1.95 kB +555 B
WebGPU Nodes	516.95 141.72	518.89 142.28	+1.95 kB +563 B

[Mugen87]

I'm afraid this won't work on WebGPU because the process is executed at the end of the pass, this may make it difficult to update the index as imagined, so I'm not sure if this will perform well

Do you mind explain in more details why the current approach does not work with WebGPU? I'm afraid I don't understand yet.

[sunag]

Do you mind explain in more details why the current approach does not work with WebGPU? I'm afraid I don't understand yet.

WebGPU does not update the buffer immediately to the GPU, at draw time, but it does so at submit time (end of pass), this explains why in the WebGPU version it is always the last value of the uniform that is being considered for all draws.

[sunag]

• PR approach

• Moving ArrayCamera viewport logic to Backend at the time of the draw
• Updating the uniform bufferData value.
• Equivalent result in WebGLRenderer.

• Moving ArrayCamera viewport logic to Backend at the time of the draw
• Caching all camera indexes in new gpu-buffers.
• Change the reference of gpu-buffer using bindBufferBase using the caches.
• More performant than current approaches, it should work on WebGPU.

[sunag]

Caching the indexes and changing their reference at draw time seems to be the best approach so far. It should theoretically work on WebGPU, but I still need to test it. Updating the cameraIndex value doesn't seem to bring much different results than what we currently have in WebGLRenderer. Approaches that use instances don't seem to be much more efficient when we need to change viewports, in addition to additional care with models that already have instances.

[sunag]

I would have to do the same array modification with the other camera nodes like cameraPosition but I'm leaving that for another PR. /cc @Mugen87

[Mugen87]

Can't wait to test this with the new XRManager 😁 .

[Mugen87]

It seems the demo webgpu_camera_array does work with WebGPU but not with a WebGL backend. I just get a black screen when forceWebGL is set to true (or when using Firefox).

There are no errors or warnings in the console.

[Mugen87]

It's strange that the CI did not catch the breakage of webgpu_camera_array 🤔 .

The example did fail in #30335 though.

[sunag]

It's strange that the CI did not catch the breakage of webgpu_camera_array 🤔 .

It's broken after #30329