Postprocessing in WebGPU with uiscene

Actually a quite banal topic concerns me.
I have a codePen here for it. I have two scenes that I want to render on top of each other. This works exactly as it should with the both scenes. But when I use postprocessing this no longer works and in r166 it worked exactly as it should, like with the two scenes.

These two variants of the render loop should produce exactly the same result. But in r167 I only get the uiscene with postprocessing

Without postprocessing, its fine:

function render() {
  requestAnimationFrame( render );
  
  renderer.autoClearColor = true;
  
  renderer.render(scene, camera);
  //postProcessing.render();
  
  renderer.autoClearColor = false;
  
  renderer.render(uiscene, uicamera);  
}

With postprocessing, only the uiscene is visible

function render() {
  requestAnimationFrame( render );
  
  renderer.autoClearColor = true;
  
  //renderer.render(scene, camera);
  postProcessing.render();
  
  renderer.autoClearColor = false;
  
  renderer.render(uiscene, uicamera);  
}

There are no errors in the console and as mentioned it worked exactly as desired in r166. Something has changed with r167 but I’m not yet aware of what.

1 Like

Postprocessing pipeline calls renderer.render(scene,camera) internally to it’s own renderTarget… so that will overwrite whatever you are doing before the:
effectComposer.render()

So if you’re using effectComposer, you can’t really be calling renderer.render() on your end.

It’s one or the other afaik.

You might be able to override/subclass the fxcomposer renderPass to do your custom render…

Or you may be able to do your renderer.render directly to the composers rendertarget First, then disable autoClear, give composer an empty scene, so it renders nothing (but won’t clear the rendertarget bc autoClear=false)

@Attila_Schroeder Would you mind reporting this regression at GitHub? I’ve tried to simplify your codepen to make the root cause more dominant. It seems that clear operations after the call of postProcessing.render() are currently broken: three.js dev template - module - JSFiddle - Code Playground

1 Like

@Mugen87 yes I will do it. I wanted to try to make sure here first.

1 Like

I’m closing this issue as I consider it resolved. I’m referring to your updated jsfiddle link which shows how it works from r167.1