[RFC] More flexible pipelines

[iwoplaza]

In the current API, only a single pipeline can be executed per render pass, which removes the ability for using multiple shaders in a single render pass (e.g., world objects and UI elements).
It also does not allow multiple dispatches of the same pipeline, but with different bind groups.

Rough proposal

The proposed change leans a bit more into how the WebGPU API functions.

const worldPipeline = ...;
const uiPipeline = ...;

root.beginRenderPass(
  {
    colorAttachments: { ... },
  },
  (pass /* <- typed based on the passed in colorAttachments above */) => {
    // \/ Type error if does not match the color attachment.
    pass.setPipeline(worldPipeline);
    pass.setBindGroup(bindGroupLayout, worldBindGroup);
    pass.draw(6);

    pass.setPipeline(uiPipeline);
    pass.setBindGroup(bindGroupLayout, uiBindGroup);
    pass.draw(6);
  },
);

[mhawryluk]

I see this being necessary, however we should keep the current way of running pipelines too, as they are way nicer to use and look at and can be used in lots of scenarios. this proposal does look very much like vanilla WebGPU, which is both a good and a bad thing. can't think of something better on the top of my head in this moment :/

[iwoplaza]

@reczkok Thoughts? 🧠

[reczkok]

I think we should keep the current pipeline api for simple use cases but create a separate one for passes. We could then have more complex behavior for complex tasks (eg. easy creation of render bundles, modifying rasterization with command mixin, occlusion queries) that behave closer to our other API's than vanilla WebGPU. This would require some more brainstorming and research but I think it would be a worthy endeavor.