Typed bind groups

[iwoplaza]

To be able to represent .wgsl files 1-to-1 in JavaScript/TypeScript, we need to have a way of describing typed bind groups.

Take this:

// shader.wgsl
@group(0) @binding(0) var<uniform> foo: f32;
@group(0) @binding(1) var<storage> bar: u32;
@group(0) @binding(3) var<storage, read> baz: i32;
@group(0) @binding(4) var<storage, read_write> john: i32;

And generate JS definitions from it:

// shader.js
export const layout0 = tgpu.bindGroupLayout({
  foo: { uniform: f32 },
  bar: { storage: u32, access: 'readonly' },
  _0: null,
  baz: { storage: i32, access: 'readonly' },
  john: { storage: i32, access: 'mutable' },
}).$forceIndex(0);

const { foo, bar, baz, john } = layout0.bound;

Then we can populate the bind group with type-safe buffers

Unmanaged

import { layout0 } from './shader.js';

const fooBuffer = root.createBuffer(f32).$usage(tgpu.Uniform);
const barBuffer = root.createBuffer(u32).$usage(tgpu.Uniform);

// inferred as:
// TgpuBindGroup<{
//   foo: TgpuBuffer<F32> & tgpu.Uniform;
//   bar: TgpuBuffer<U32> & tgpu.Uniform;
// }>
const bindGroup0 = layout0.populate({
  foo: fooBuffer,
  bar: barBuffer,
  // ...
});

root.unwrap(layout0); // => GPUBindGroupLayout
root.unwrap(bindGroup0); // => GPUBindGroup