converted uniform matrix buffers to storage buffers

webgpu · Jan 30, 2024 · 6114d54 · 6114d54
1 parent 7fdf458
commit 6114d54
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 19 deletions.
diff --git a/src/sample/skinnedMesh/glbUtils.ts b/src/sample/skinnedMesh/glbUtils.ts
@@ -657,15 +657,15 @@ export class GLTFSkin {
         {
           binding: 0,
           buffer: {
-            type: 'uniform',
+            type: 'read-only-storage',
           },
           visibility: GPUShaderStage.VERTEX,
         },
         // Holds the inverse bind matrices buffer
         {
           binding: 1,
           buffer: {
-            type: 'uniform',
+            type: 'read-only-storage',
           },
           visibility: GPUShaderStage.VERTEX,
         },
@@ -699,7 +699,7 @@ export class GLTFSkin {
     this.joints = joints;
     const skinGPUBufferUsage: GPUBufferDescriptor = {
       size: Float32Array.BYTES_PER_ELEMENT * 16 * joints.length,
-      usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
+      usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST,
     };
     this.jointMatricesUniformBuffer = device.createBuffer(skinGPUBufferUsage);
     this.inverseBindMatricesUniformBuffer =

diff --git a/src/sample/skinnedMesh/gltf.wgsl b/src/sample/skinnedMesh/gltf.wgsl
@@ -34,18 +34,8 @@ struct NodeUniforms {
 @group(0) @binding(0) var<uniform> camera_uniforms: CameraUniforms;
 @group(1) @binding(0) var<uniform> general_uniforms: GeneralUniforms;
 @group(2) @binding(0) var<uniform> node_uniforms: NodeUniforms;
-// Note that size of each of the matrix arrays below is equal to size of the number of inverseBindMatrices/joints defined in our whale glb object.
-// As such, this shader can not be applied to any gltf object, as each skinned gltf object contains a different number of joints.
-// Ways this shader can be made more generalizable include:
-//    a. Making our shader a constructable string returned from a function that takes the skin's current number of joints as an argument.
-//       For example, converting array<mat4x4f, 6> to return `array<mat4x4f, ${numJoints}`
-//    b. Converting our uniform matrices buffers into storage buffers of variable size
-//       joint_matrices: var<uniform> joint_matrices -> var<storage, read> joint_matrices
-//    c. Reading our matrix data in as a texture
-// However, for this limited, single object example, the current approach works fine, and these considerations are only
-// necessary in the context of a more robust gltf parser/shader package.
-@group(3) @binding(0) var<uniform> joint_matrices: array<mat4x4<f32>, 6>;
-@group(3) @binding(1) var<uniform> inverse_bind_matrices: array<mat4x4<f32>, 6>;
+@group(3) @binding(0) var<storage, read> joint_matrices: array<mat4x4<f32>>;
+@group(3) @binding(1) var<storage, read> inverse_bind_matrices: array<mat4x4<f32>>;
 
 @vertex
 fn vertexMain(input: VertexInput) -> VertexOutput {

diff --git a/src/sample/skinnedMesh/grid.wgsl b/src/sample/skinnedMesh/grid.wgsl
@@ -24,8 +24,8 @@ struct GeneralUniforms {
 
 @group(0) @binding(0) var<uniform> camera_uniforms: CameraUniforms;
 @group(1) @binding(0) var<uniform> general_uniforms: GeneralUniforms;
-@group(2) @binding(0) var<uniform> joint_matrices: array<mat4x4<f32>, 5>;
-@group(2) @binding(1) var<uniform> inverse_bind_matrices: array<mat4x4<f32>, 5>;
+@group(2) @binding(0) var<storage, read> joint_matrices: array<mat4x4<f32>>;
+@group(2) @binding(1) var<storage, read> inverse_bind_matrices: array<mat4x4<f32>>;
 
 @vertex
 fn vertexMain(input: VertexInput) -> VertexOutput {

diff --git a/src/sample/skinnedMesh/main.ts b/src/sample/skinnedMesh/main.ts
@@ -235,7 +235,7 @@ const init: SampleInit = async ({ canvas, pageState, gui }) => {
   const skinnedGridUniformBufferUsage: GPUBufferDescriptor = {
     // 5 4x4 matrices, one for each bone
     size: MAT4X4_BYTES * 5,
-    usage: GPUBufferUsage.UNIFORM | GPUBufferUsage.COPY_DST,
+    usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_DST,
   };
   const skinnedGridJointUniformBuffer = device.createBuffer(
     skinnedGridUniformBufferUsage
@@ -247,7 +247,7 @@ const init: SampleInit = async ({ canvas, pageState, gui }) => {
     [0, 1],
     [GPUShaderStage.VERTEX, GPUShaderStage.VERTEX],
     ['buffer', 'buffer'],
-    [{ type: 'uniform' }, { type: 'uniform' }],
+    [{ type: 'read-only-storage' }, { type: 'read-only-storage' }],
     [
       [
         { buffer: skinnedGridJointUniformBuffer },