WebGPURenderer: multiple canvas support

[aardgoose]

This introduces a CanvasRenderTarget() to represent a screen canvas, which can be used via renderer.setRenderTarget() for use with WebGPU, thus supporting multiple canvases.

The default screen canvas state in Renderer() is replaced by a CanvasRenderTarget(). - this may be too much code change?

[LeviPesin]

The API feels amazing!!

[sunag]

This PR sounds great to PR.
@mrdoob @Mugen87 Any thoughts on this approach?

const canvasRT = new CanvasRenderTarget( { domElement } );

renderer.setRenderTarget( canvasRT );

[Mugen87]

Is it necessary to introduce all the getActive*() methods? Could getPixelRatio() just work like so:

• Report the pixel ratio of the default canvas render target.
• If a custom canvas render target is set, return its values instead.

[aardgoose]

I considered that but was worried about altering the behaviour of those methods, happy to do that instead though, or add a method to getActiveCanvasTarget() for use within the Node classes.

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

Filesize dev	Filesize PR	Diff
683.5 kB (169.2 kB)	683.5 kB (169.2 kB)	+0 B

🌳 Bundle size after tree-shaking

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

Filesize dev	Filesize PR	Diff
460.7 kB (111.1 kB)	460.7 kB (111.1 kB)	+0 B

[zhan2016]

Hi there! First of all, thank you for working on this valuable feature. This enhancement is critically important to our product as it addresses ["real-time 3D visualization in medical imaging scenarios"] which is core to our user workflow.

Would it be possible to prioritize reviewing/merging this PR for the upcoming [r177]? We'd be happy to help with testing, provide additional use case details, or support in any way that could accelerate the process. Really looking forward to leveraging this improvement! 🙌

[pranavmalikk]

Any progress on this PR being merged?

[zhan2016]

Could you please give this PR some attention and help merged the PR? @mrdoob