Manual MSAA pass doesn't work with Outline pass?

Hello guys, I’m using postprocessing to implement an outline effect. Most part of my app would be similar to the official Three.js example. The only difference is that I refer to ManualMSAA instead of FXAA for anti-aliasing.

The reason why I made this change is because FXAA provides blur effect, which is not what I want. Also, as we known, the webGL built-in MSAA doesn’t work in post-processing.

After switching to ManualMSAA, the anti-aliasing works very well, and is much better than FXAA imo. However, I found that the outline effect is completely gone. I have experience with Three.js but I’m totally a newbie in post-processing field.

I made a fiddle to demonstrate the issue. If you comment out the MSAAPass, the outline would work again. As you can see there is a warning about deprecated API in MSAAPass. I also tried to fix that but things got worse…

I appreciate it in advance if anyone can help…

As mentioned in the following github issue, ManualMSAARenderPass was the original name of SSAARenderPass. It was renamed because the pass does not really perform MSAA but simple supersampling.

Since it’s a render pass, it has to be the first pass in the chain:

https://jsfiddle.net/9pcb6mux/

1 Like

BTW: When using WebGL 2, you can use MSAA with postprocessing thanks to multisampled renderbuffers.

https://threejs.org/examples/webgl2_multisampled_renderbuffers

Thank you @Mugen87.

1 Like