renderToScreen is necessary for some workflows (broken in #16033)

[cedemax]

Description of the problem

I used a workflow where i first render the scene+SSAA+SSAO etc, and then render some UI elements (that use the depth of the actual scene). I dont want SSAO and other effect affecting the UI elements, so i run them as a separate RenderPass after the rest.

renderModels = new THREE.RenderPass(scene, camera);
renderModels.renderToScreen = true;
composer.addPass(renderModels);

renderHud = new THREE.RenderPass(hudScene, camera);
renderHud.clear = false;
renderHud.renderToScreen = true;
composer.addPass(renderHud);

This was broken by #16033, because it is no longer possible to have many passes with renderToScreen = true. As seen in the fiddle, only the last renderpass is rendered, the blue sphere (with fancy light), is hidden.

The fix which i implemented to get this effect in my project is to comment out this line in EffectComposer.js

...
if ( pass.enabled === false ) continue;

//pass.renderToScreen = ( this.renderToScreen && this.isLastEnabledPass( i ) ); // <- this line
pass.render( this.renderer, this.writeBuffer, this.readBuffer, deltaTime, maskActive );

if ( pass.needsSwap ) {
...

After that everything works as expected for me.

Perhaps a compromise would be to check if there are no "renderToScreen" passes, and only do that "default enabling" if no passes are "renderToScreen"?

Fiddle:
https://jsfiddle.net/z6opysr7/19/

Three.js version

• Dev
• [] r120
• ...

Browser

• [] All of them
• Chrome
• Firefox
• Internet Explorer

OS

• [] All of them
• Windows
• macOS
• Linux
• Android
• iOS

[Mugen87]

because it is no longer possible to have many passes with renderToScreen = true.

This use case should actually never be supported. IMO, the code is more correct now.

[cedemax]

Allright, can you suggest an alternative way to achieve the same end?
I want to render the items in scene2 "on top of" scene1, without scene1 lights or postprocessing, but obeying the depth in scene1.

[Mugen87]

Well, you would render scene1 and scene2 into separate render targets and then use the respective textures in a blend/combine pass to produce the final image. I'm not sure I would use RenderPass for this but write a custom pass.

Please use the forum if you need more help in this context.

[arcanis]

Multiple SO questions reference the renderToScreen pattern - for instance this one. I'm still not sure how to get the same effect - rendering three times to different render targets sounds quite a bit less efficient that using the same one twice?