Resources
On this page

Resources: from TypeScript declarations to GPU resources

A TypeShade resource is a host-filled binding slot, not a JavaScript object owned by the shader. Product code makes that boundary explicit with declare.

1. Map the TypeScript declaration model

Just as TypeScript declare describes a value at the type level without creating a runtime value, TypeShade declare describes a GPU resource supplied by the host. TypeShade additionally uses uniform<T> and storage<T> to express GPU memory semantics.

declare const camera: uniform<Camera>
declare const pixels: storage<array<f32>, "read_write">

2. Declare resources with declare

Declare the resource type and access mode without an initializer.

3. The type states the access

A uniform is read-only, and uniform<T> takes one type argument. A storage binding is read-only as storage<T> and read-write as storage<T, "read_write">. The access mode is the second type argument, where WGSL writes it too. Every resource is declared with const.

DeclarationSpaceAccess
declare const x: uniform<T>uniformread
declare const x: storage<T>storageread
declare const x: storage<T, "read_write">storageread_write

4. Resource slots are a host contract

Resource slots follow declaration order in the file. Keep binding details as part of the compiler/host reflection contract instead of scattering binding numbers through shader code.

5. Common mistakes

  • Do not declare declare const x: f32; a resource needs a space such as uniform<T> or storage<T>.
  • Do not declare a resource with let. The compiler refuses declare let x: storage<T> and names the declare const line to write instead.
  • Do not assign to a read-only resource.
  • Do not model a resource as a class or bind-group instance.

Next: Shader stages

Edit this page Report a problem