TAARenderPass: Pass over-brightens scene, shows occasional black frames

[donmccurdy]

Describe the bug

When using TAARenderPass, certain valid settings result in incorrect behavior:

• scene.background — any non-black background will cause the final scene to over-brighten during TAA accumulation
• pass.sampleLevel — any non-zero level will cause a single-frame flash of black when the accumulation phase begins

To Reproduce

Steps to reproduce the behavior:

1. Open webgl_postprocessing_taa locally
2. Add a background color like scene.background = new THREE.Color( 0xEE5555 );
3. Increase TAASampleLevel (any level > 0)

Observe (1) the scene brightens when it stops moving and begins accumulating, and (2) the scene flashes to black for a single frame at that time. It may be easier to see the flash when the background is kept black.

Expected behavior

TAARenderPass should be compatible with non-black scene backgrounds, and should not show a black frame while accumulating.

Screenshots

If applicable, add screenshots to help explain your problem (drag and drop the image).

Platform:

• Device: Desktop
• OS: macOS 12.4
• Browser: Chrome 103.0.5060.53
• Three.js version: r142

[donmccurdy]

@Mugen87 I believe that #26179 has considerably improved the situation, but I'm still seeing shifts in the background color with the use of TAARenderPass. The problem is subtle when TAA sample level is 0, and very obvious with higher sample levels.

The example included with #24271 remains very illustrative. Currently the effect stack here is RenderPass → TAARenderPass → OutputPass. If we put TAARenderPass last, the color management is clearly wrong, but I'm not sure if that's allowed usage.

[Mugen87]

The problem is subtle when TAA sample level is 0, and very obvious with higher sample levels.

Thanks for the heads-up. I'll check the implementation again tomorrow 👍 .

[donmccurdy]

@Mugen87 looking great now, thanks!