WebGLRenderer: Add Support for Khronos Neutral Tone Mapping

[elalish]

This is the tone mapper I designed for color-accuracy and that we are working to make a standard through the Khronos 3D Commerce group. In-depth writeup here. The summary is this is an improved alternative to No/Linear/Clamped tone mapping. It preserves the baseColor sRGB values as faithfully as possible through to the final render under uncolored lighting.

Improvements over No tone mapping:

• Avoids clamping artifacts in highlights
• Has a uniform path to white
• Avoids hue skews
• Avoids saturation loss especially on darker dielectric materials

Improvements over ACES/AgX:

• Maintains color saturation
• Has a larger reachable set of sRGB
• Avoids hue skews

Situations where AgX is a better choice:

• Out-of-gamut colors: if your textures or lights contain colors outside of the Rec.709 (sRGB) gamut.
• If you have important visual detail across a wide dynamic range (e.g. landscape photography). The HDR is aggressively compressed in this tone mapper, which is most appropriate for highlights.
• If your output will not be directly compared to images, so absolute sRGB values are less important than scene-relative perception.

I've already shipped this in <model-viewer> and I intend to make it our default in v4.0. You can test it yourself by drag-and-dropping any GLB and HDR into this Glitch.

FYI @mrdoob @WestLangley @donmccurdy @bhouston @hybridherbst

[github-actions]

📦 Bundle size

Full ESM build, minified and gzipped.

Filesize dev	Filesize PR	Diff
676.2 kB (167.9 kB)	676.9 kB (168.1 kB)	+677 B

🌳 Bundle size after tree-shaking

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

Filesize dev	Filesize PR	Diff
456.8 kB (110.7 kB)	457.4 kB (111 kB)	+646 B

[Mugen87]

@elalish I've added two minor changes to your branch to make sure CommerceToneMapping also works with post processing.

[mrdoob]

Great tone mapper!

However, as discussed offline... I'm not a fan of the "Commerce" name and would very much prefer renaming it to something like "Neutral" before it's not too late 😇

Maybe "Khronos' Neutral Tone Mapper"?

[hybridherbst]

For anyone curious, the tonemapping can also be tried out here, across a wide range of Khronos sample models:

1. go to https://viewer.needle.tools
2. either drop files or select Sample Assets > pick models
   • close the Sample Assets menu again
3. select View Options > Tonemapping > Commerce (model-viewer)

[elalish]

@mrdoob - renamed. Thanks @Mugen87 for the update.

[WestLangley]

To be less verbose, maybe NeutralToneMapping, and in the docs refer to the Khronos 3D Commerce Group?

Anyway, the docs should be updated.

[mrdoob]

What @WestLangley said 👍

[Mugen87]

I'll merge and clean up.

[elalish]

Thanks!