Line2NodeMaterial: Add opacity support using backdrop

[sunag]

Related issue: #29964

Description

Add opacity support for Line2NodeMaterial using backdrop.

The change of fragmentNode to colorNode, should enable support for MRT and alphaHash as optional for performance.

Live demo

I just added support for NormalBlending. For other support would be to simply add the other formulas in the outputNode.

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

	Before	After	Diff
WebGL	339.14 78.99	339.14 78.99	+0 B +0 B
WebGPU	483.7 134.18	483.88 134.22	+173 B +36 B
WebGPU Nodes	483.17 134.09	483.34 134.12	+173 B +37 B

🌳 Bundle size after tree-shaking

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

	Before	After	Diff
WebGL	464.62 111.98	464.62 111.98	+0 B +0 B
WebGPU	552.83 149.53	552.83 149.53	+0 B +0 B
WebGPU Nodes	508.71 139.25	508.71 139.25	+0 B +0 B

[Makio64]

Thanks @sunag !

I discovered with this PR the viewportSharedTexture, so now in threejs we can get the current state of the rendering texture at any point using this ?

Looks super powerful, is there throwback in term of performance using it ?

ps: very clever to just do the line color+current color(sharedTexture) with the ratio alpha/1-alpha but why in the output do we still need an alpha at the end then ?

Thanks a lot, didnt even know that was possible..

[sunag]

I'm glad it helped :)

I discovered with this PR the viewportSharedTexture, so now in threejs we can get the current state of the rendering texture at any point using this ?

At any time, you can get the depth map too, that was the basis of the example webgpu_backdrop_water.

Looks super powerful, is there throwback in term of performance using it ?

Although it is very fast, there is an additional load, but that would be the case with all the approaches presented for this. I let it update the texture every time the object is rendered, but if we have any issues I can leave it only for the opaque ones, just like transmission works.

ps: very clever to just do the line color+current color(sharedTexture) with the ratio alpha/1-alpha but why in the output do we still need an alpha at the end then ?

I didn't implement the alpha for the HTML background, so this will only be necessary in this case, what do you think about implementing a PR for this?