WebGLRenderer: Add transmission render target scale

[michaeldll]

Fixed #30017.

Description

By default, the transmission render target takes up the full viewport. Reducing this render target size is valuable due to the considerable performance impact of rendering at full resolution and minimal visual degradation by just scaling the transmission render target size.

Here is a quick side-by-side comparison of full scale versus 33% scale, respectively:

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	339.11 78.98	339.2 79.01	+95 B +23 B
WebGPU	486.01 134.92	486.01 134.92	+0 B +0 B
WebGPU Nodes	485.48 134.83	485.48 134.83	+0 B +0 B

🌳 Bundle size after tree-shaking

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

	Before	After	Diff
WebGL	465 112.04	465.1 112.06	+95 B +24 B
WebGPU	555.41 150.39	555.41 150.39	+0 B +0 B
WebGPU Nodes	511.26 140.1	511.26 140.1	+0 B +0 B

[michaeldll]

I realized that I have done this directly on the dev branch instead of making my own by mistake. Let me know if this is fixable or if I should open another PR instead. Sorry about that.

[Mugen87]

Yes, I think a scale factor for transmission makes sense. Depending on the device, using the full resolution is quite taxing.

I realized that I have done this directly on the dev branch instead of making my own by mistake.

That is not an issue.

[Mugen87]

Do you mind documenting this new property here: https://threejs.org/docs/index.html#api/en/renderers/WebGLRenderer

[michaeldll]

Done, let me know if the wording is clear enough.

[Mugen87]

The PR looks good to me!

Having the ability to scale the transmission render target resolution is indeed useful. When I remember correctly from earlier discussions, there were reservations to add such properties to the renderer interface. However, since the transmission render target is global we can't use a material setting. So I think the solution here is fine.

[Makio64]

@michaeldll can you add this ability in one example using transmission so it's easy to find for new comers ?

ps : thanks for this pr, very useful for mobile and low power device!

[michaeldll]

@Makio64 Good call, just added it to webgl_materials_physical_transmission:

Screen.Recording.2024-12-08.at.11.25.14.mp4