具有多个着色器的 WebGL 渲染顺序/组织/流程

Question

我正在努力理解webgl中渲染组织的一些概念。

我正在开发一个 2D 游戏，它有 2 种类型的对象 - 精灵和多边形。 为此我有不同的着色器，按类型对我的游戏对象进行排序，然后分两批渲染它们。 所以，像：

for sprite in sprites {
    prepare data
}
use_program(sprite_shader)
draw_elements

for polygon in polygons {
    prepare data
}
use_program(polygon_shader)
draw_elements

现在，我试图通过向单个对象（发光、模糊等）添加一种或多种效果来扩展它。 据我所知，我应该做的是将原始 object 渲染到纹理，然后使用不同的程序应用效果，最后将生成的纹理绘制到 canvas。 我很困惑如何将其融入上述批处理方法。

我有一些想法，但它们似乎并不聪明：

1. 根据需要根据 object 切换程序 - 似乎首先否定了分组的好处。
2. 为每个具有效果的 object 创建帧缓冲区，并在一个 go 中渲染所有相同的 object 类型，但要针对不同的目标，然后在稍后的效果传递中更新这些目标，然后？
3. 将所有对象渲染到帧缓冲区，在需要它的对象上运行效果，然后使用精灵着色器渲染它们，以便 canvas。 同样，所有帧缓冲区是否都与 canvas 大小相同？
4. 我想我可以以某种方式为精灵预先生成例如模糊纹理并渲染它，但我不能为多边形做到这一点。

我很确定我在这里不理解某些东西，但这似乎很常见，我找不到类似的示例或文章。