上一篇主要讨论性能问题,这一篇我们开始设计后处理渲染器架构
effectComposer ---(默认生成 sourceTarget(原场景), readBuffer(后续每一个pass的最终结果),writeBuffer(负责与readBuffer进行交换))
---renderPass (负责渲染一遍原场景,最终渲染到sourceTarget)
---pass1 (针对物体的后处理)
---pass2
...
---screenPass1(针对屏幕的后处理)
---screenPass2
...
1.系统架构大概是这样,由于我们考虑使用MSAA和FXAA两种方式,首先需要封装一个createRenderTarget的方法,用于动态切换WebGLRenderTarget和WebGLMultisampleRenderTarge。然后封装setDepth方法来为它们创建深度贴图和深度缓冲对象。
2.为了照顾到显存,如果使用MSAA,我们最多只给原图使用WebGLMultisampleRenderTarge以及每一张scheme图(针对物体的后处理效果中渲染物体的那张图称为scheme图)使用WebGLMultisampleRenderTarget, 其余renderTarget尽量使用WebGLRenderTarget。同时我们要注意尽量少使用额外的renderTarget,以便减少内存多消耗。
3.renderTarget处理完后我们开始着手设计物体级的Pass
物体级的Pass的第一步是要生成一张scheme图,如下:
var strategy = SchemeStrategyPool.getStrategy( this.n