Apply fog before tonemapping and encoding

[mrdoob]

Related issue: #26208

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

Filesize dev	Filesize PR	Diff
649 kB (160.9 kB)	649.6 kB (160.9 kB)	+581 B

🌳 Bundle size after tree-shaking

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

Filesize dev	Filesize PR	Diff
442.3 kB (107 kB)	442.9 kB (107.1 kB)	+581 B

[mrdoob]

So yeah... scene.background should be tonemapped too.

[mrdoob]

Refactored WebGLBackground background.isColor code path.

[sunag]

So yeah... scene.background should be tonemapped too.

This would make my life a lot easier, and this solves one of the problems I'm having when porting transmission materials node-based. To work correctly, the process must work in linear color space while rendering objects and only at the output apply tone mapping and output color space.

[donmccurdy]

I agree this is the more correct way to do things! But there will unfortunately be users with problems because they need the background to match something in HTML/CSS. I wish we had some way to apply the inverse of the tone mapping to a color, so users can at least compute a fog or background color that will give them the final background color they want.

Many colors in the sRGB gamut cannot be reached by ACES tone mapping outputs though, so this would also limit your choice of background color. Perhaps AgX will be more flexible there, but I'm not sure.

Or perhaps THREE.Fog could take an alpha value?

[sunag]

I like the idea of rendering with alpha and applying it in Fog too, I think it could solve this issue with HTML/CSS? since the transparent background can provide much more possibilities than a single color. This principle could also follow this reasoning #26857 (comment)

[sunag]

Some tests using opacity Fog:

[sunag]

Considering that many people use gradient backgrounds, this would fit perfectly into any HTML/CSS.

three.js.examples.-.Google.Chrome.2023-09-29.14-28-11.mp4

[LeviPesin]

Is this related to #25819?

[Mugen87]

What are the open points in this PR? Do we need add an alpha property to the fog classes?

As mentioned earlier, the status quo is especially confusing when devs use post processing with a scene using fog. As soon as they integrate OutputPass in their pass chain, the scene looks suddenly different compared to the inline tone mapping and color space conversion. Most devs initially think FX is buggy although it actually renders the scene correctly (see #26954 (comment)).

[mrdoob]

I'm unable to find the discussion right now... but @elalish was recently dealing with some browsers not doing alpha compositing properly.

That's why I'm not sure about the transparent fog approach.

[donmccurdy]

As soon as they integrate OutputPass in their pass chain, the scene looks suddenly different compared to the inline tone mapping and color space conversion.

Perhaps related ... when using post-processing: should fog be part of OutputPass, or another effect pass, rather than inline?