Increasing access
We're still trying to figure out how best to make compute shaders approachable, and it's far from a solved problem. @samjwebster and I were talking on Discord about a case where we want to dispatch a number of instances of two shapes, say a circle and a square, to cover a grid, where each grid cell is assigned one of the two shapes. The question is how to figure out which shapes go where, and how to update that each frame in a way that isn't a bottleneck.
Ideally, you could use a compute shader to make two lists: the grid indices at which to put squares, and the grid indices at which to put circles. Then after running the compute shader you could dispatch instanced squares, which each render at squareLocations[i], and then do the same for circles at circleLocations[i]. However, that's currently not possible to do with strands compute shaders because managing variable length data will require atomics which we started looking into in #8820 and @aashu2006 will likely be adding in the future. But that's still a very advanced concept and having some scaffolding before introducing that would help show how to introduce compute shaders into your code.
Most appropriate sub-area of p5.js?
Feature enhancement details
I think we could introduce storage list buffers alongside our current storage buffers that have a shape like
struct MyElementList {
data: array<MyElement, MAX_CAPACITY>,
length: atomic<u32>,
}
@group(0) @binding(N) var<storage, read_write> myList: MyElementList;...and where we provide push(), pop(), and clear() methods.
I don't quite know yet what the other impacts of this will be, so I need to prototype a bit and see how it works and get some feedback before deciding whether or not this is a design we want to support.
Increasing access
We're still trying to figure out how best to make compute shaders approachable, and it's far from a solved problem. @samjwebster and I were talking on Discord about a case where we want to dispatch a number of instances of two shapes, say a circle and a square, to cover a grid, where each grid cell is assigned one of the two shapes. The question is how to figure out which shapes go where, and how to update that each frame in a way that isn't a bottleneck.
Ideally, you could use a compute shader to make two lists: the grid indices at which to put squares, and the grid indices at which to put circles. Then after running the compute shader you could dispatch instanced squares, which each render at
squareLocations[i], and then do the same for circles atcircleLocations[i]. However, that's currently not possible to do with strands compute shaders because managing variable length data will require atomics which we started looking into in #8820 and @aashu2006 will likely be adding in the future. But that's still a very advanced concept and having some scaffolding before introducing that would help show how to introduce compute shaders into your code.Most appropriate sub-area of p5.js?
Feature enhancement details
I think we could introduce storage list buffers alongside our current storage buffers that have a shape like
...and where we provide
push(),pop(), andclear()methods.I don't quite know yet what the other impacts of this will be, so I need to prototype a bit and see how it works and get some feedback before deciding whether or not this is a design we want to support.