当前示例源码github地址:
https://github.com/vilyLei/voxwebgpu/blob/feature/rendering/src/voxgpu/sample/ComputeEntityTest.ts
系统特性:
- 用户态与系统态隔离。
细节请见:引擎系统设计思路 - 用户态与系统态隔离-CSDN博客
-
高频调用与低频调用隔离。
-
面向用户的易用性封装。
-
渲染数据(内外部相关资源)和渲染机制分离。
-
用户操作和渲染系统调度并行机制。
-
数据/语义驱动。
-
异步并行的场景/模型载入。
-
GPU通用计算过程与渲染过程保持使用机制一致性。
1). 构造过程一致性。
2). 启用过程一致性。
3). 自动兼容到material多pass以及material graph机制中。
此示例基于此渲染系统实现,当前示例TypeScript源码如下:
javascript
const gridSize = 32;
const shdWorkGroupSize = 8;
const compShdCode = `
@group(0) @binding(0) var<uniform> grid: vec2f;
@group(0) @binding(1) var<storage> cellStateIn: array<u32>;
@group(0) @binding(2) var<storage, read_write> cellStateOut: array<u32>;
fn cellIndex(cell: vec2u) -> u32 {
return cell.y * u32(grid.x) + cell.x;
}
@compute @workgroup_size(${shdWorkGroupSize}, ${shdWorkGroupSize})
fn compMain(@builtin(global_invocation_id) cell: vec3u) {
if (cellStateIn[cellIndex(cell.xy)] == 1) {
cellStateOut[cellIndex(cell.xy)] = 0;
} else {
cellStateOut[cellIndex(cell.xy)] = 1;
}
}`
export class ComputeEntityTest {
private mRscene = new RendererScene();
initialize(): void {
console.log("ComputeEntityTest::initialize() ...");
const rc = this.mRscene;
rc.initialize();
this.initEvent();
this.initScene();
}
private initEvent(): void {
const rc = this.mRscene;
rc.addEventListener(MouseEvent.MOUSE_DOWN, this.mouseDown);
new MouseInteraction().initialize(rc, 0, false).setAutoRunning(true);
}
private mouseDown = (evt: MouseEvent): void => {};
private createUniformValues(): WGRUniformValue[] {
const gridsSizesArray = new Float32Array([gridSize, gridSize]);
const cellStateArray0 = new Uint32Array(gridSize * gridSize);
for (let i = 0; i < cellStateArray0.length; i+=3) {
cellStateArray0[i] = 1;
}
const cellStateArray1 = new Uint32Array(gridSize * gridSize);
for (let i = 0; i < cellStateArray1.length; i++) {
cellStateArray1[i] = i % 2;
}
const v0 = new WGRUniformValue({data: gridsSizesArray, stride: 1});
const v1 = new WGRStorageValue({data: cellStateArray0, stride: 1});
const v2 = new WGRStorageValue({data: cellStateArray1, stride: 1});
v0.toVisibleAll();
v1.toVisibleVertComp();
v2.toVisibleComp();
v2.toBufferForStorage();
return [v0, v1, v2];
}
private initScene(): void {
const rc = this.mRscene;
let shaderSrc = {
compShaderSrc: {
code: compShdCode,
uuid: 'shader-computing',
compEntryPoint: 'compMain'
}
};
let uniformValues = this.createUniformValues();
let entity = new ComputeEntity({ shaderSrc, uniformValues });
rc.addEntity(entity);
}
run(): void {
this.mRscene.run();
}
}