@luma.gl/webgpu 9.0.0-alpha.4 → 9.0.0-alpha.40

package/src/adapter/resources/webgpu-render-pass.ts

@@ -1,11 +1,12 @@
-import type {RenderPassProps, RenderPassParameters, Binding} from '@luma.gl/api';
-import {Buffer, RenderPass, RenderPipeline, cast, log} from '@luma.gl/api';
-import WebGPUDevice from '../webgpu-device';
-import WebGPUBuffer from './webgpu-buffer';
-// import WebGPUCommandEncoder from './webgpu-command-encoder';
-import WebGPURenderPipeline from './webgpu-render-pipeline';
-
-export default class WebGPURenderPass extends RenderPass {
+import type {RenderPassProps, RenderPassParameters, Binding, Framebuffer} from '@luma.gl/core';
+import {Buffer, RenderPass, RenderPipeline, cast, log} from '@luma.gl/core';
+import {WebGPUDevice} from '../webgpu-device';
+import {WebGPUBuffer} from './webgpu-buffer';
+import {WebGPUTexture} from './webgpu-texture';
+// import {WebGPUCommandEncoder} from './webgpu-command-encoder';
+import {WebGPURenderPipeline} from './webgpu-render-pipeline';
+
+export class WebGPURenderPass extends RenderPass {
   readonly device: WebGPUDevice;
   readonly handle: GPURenderPassEncoder;
 
@@ -15,17 +16,19 @@ export default class WebGPURenderPass extends RenderPass {
   constructor(device: WebGPUDevice, props: RenderPassProps = {}) {
     super(device, props);
     this.device = device;
-    const framebuffer = props.framebuffer || device.canvasContext.getCurrentFramebuffer();
-    // @ts-expect-error
-    const renderPassDescriptor = framebuffer.renderPassDescriptor;
+    const framebuffer = props.framebuffer || device.canvasContext.getCurrentFramebuffer() ;
+    const renderPassDescriptor = this.getRenderPassDescriptor(framebuffer);
+    log.groupCollapsed(1, `new WebGPURenderPass(${this.id})`)();
+    log.probe(1, JSON.stringify(renderPassDescriptor, null, 2))();
+    log.groupEnd(1)();
     this.handle = this.props.handle || device.commandEncoder.beginRenderPass(renderPassDescriptor);
     this.handle.label = this.props.id;
   }
 
-  destroy() {}
+  override destroy(): void {}
 
-  endPass(): void {
-    this.handle.endPass();
+  end(): void {
+    this.handle.end();
   }
 
   setPipeline(pipeline: RenderPipeline): void {
@@ -35,8 +38,11 @@ export default class WebGPURenderPass extends RenderPass {
 
   /** Sets an array of bindings (uniform buffers, samplers, textures, ...) */
   setBindings(bindings: Record<string, Binding>): void {
-    this.pipeline.setBindings(bindings);
-    this.handle.setBindGroup(0, this.pipeline._getBindGroup());
+    this.pipeline?.setBindings(bindings);
+    const bindGroup = this.pipeline?._getBindGroup();
+    if (bindGroup) {
+      this.handle.setBindGroup(0, bindGroup);
+    }
   }
 
   setIndexBuffer(
@@ -71,8 +77,8 @@ export default class WebGPURenderPass extends RenderPass {
       );
     } else {
       this.handle.draw(
-        options.vertexCount,
-        options.instanceCount,
+        options.vertexCount || 0,
+        options.instanceCount || 1,
         options.firstIndex,
         options.firstInstance
       );
@@ -125,4 +131,54 @@ export default class WebGPURenderPass extends RenderPass {
   // endPipelineStatisticsQuery(querySet: GPUQuerySet, queryIndex: number): void;
 
   // executeBundles(bundles: Iterable<GPURenderBundle>): void;
+
+  // INTERNAL
+
+  /** 
+   * Partial render pass descriptor. Used by WebGPURenderPass.
+   * @returns attachments fields of a renderpass descriptor. 
+   */
+  protected getRenderPassDescriptor(framebuffer: Framebuffer): GPURenderPassDescriptor {
+    const renderPassDescriptor: GPURenderPassDescriptor = {
+      colorAttachments: []
+    };
+
+    renderPassDescriptor.colorAttachments = framebuffer.colorAttachments.map(colorAttachment => ({
+      // clear values
+      loadOp: this.props.clearColor !== false ? 'clear' : 'load',
+      colorClearValue: this.props.clearColor || [0, 0, 0, 0],
+      storeOp: this.props.discard? 'discard': 'store',
+      // ...colorAttachment,
+      view: (colorAttachment as WebGPUTexture).handle.createView()
+    }));
+
+    if (framebuffer.depthStencilAttachment) {
+      renderPassDescriptor.depthStencilAttachment = {
+        view: (framebuffer.depthStencilAttachment as WebGPUTexture).handle.createView()
+      };
+      const {depthStencilAttachment} = renderPassDescriptor;
+
+      // DEPTH
+      if (this.props.depthReadOnly) {
+        depthStencilAttachment.depthReadOnly = true;
+      }
+      depthStencilAttachment.depthClearValue = this.props.clearDepth || 0;
+
+      // WebGPU only wants us to set these parameters if the texture format actually has a depth aspect
+      const hasDepthAspect = true;
+      if (hasDepthAspect) {
+        depthStencilAttachment.depthLoadOp = this.props.clearDepth !== false ? 'clear' : 'load';
+        depthStencilAttachment.depthStoreOp = 'store'; // TODO - support 'discard'?
+      }
+
+      // WebGPU only wants us to set these parameters if the texture format actually has a stencil aspect
+      const hasStencilAspect = false;
+      if (hasStencilAspect) {
+        depthStencilAttachment.stencilLoadOp = this.props.clearStencil !== false ? 'clear' : 'load';
+        depthStencilAttachment.stencilStoreOp = 'store'; // TODO - support 'discard'?
+      }
+    }
+
+    return renderPassDescriptor;
+  }
 }

package/src/adapter/resources/webgpu-render-pipeline.ts

@@ -1,5 +1,7 @@
-import type {Binding, RenderPass} from '@luma.gl/api';
-import {Buffer, RenderPipeline, RenderPipelineProps, cast, log, isObjectEmpty} from '@luma.gl/api';
+// luma.gl MIT license
+
+import type {TypedArray, Binding, UniformValue, RenderPass} from '@luma.gl/core';
+import {Buffer, RenderPipeline, RenderPipelineProps, cast, log, isObjectEmpty} from '@luma.gl/core';
 import {applyParametersToRenderPipelineDescriptor} from '../helpers/webgpu-parameters';
 import {getWebGPUTextureFormat} from '../helpers/convert-texture-format';
 import {getBindGroup} from '../helpers/get-bind-group';
@@ -8,49 +10,52 @@ import {getVertexBufferLayout, getBufferSlots} from '../helpers/get-vertex-buffe
 // import {mapAccessorToWebGPUFormat} from './helpers/accessor-to-format';
 // import type {BufferAccessors} from './webgpu-pipeline';
 
-import type WebGPUDevice from '../webgpu-device';
-import type WebGPUBuffer from './webgpu-buffer';
-import type WebGPUShader from './webgpu-shader';
-import type WebGPURenderPass from './webgpu-render-pass';
+import type {WebGPUDevice} from '../webgpu-device';
+import type {WebGPUBuffer} from './webgpu-buffer';
+import type {WebGPUShader} from './webgpu-shader';
+import type {WebGPURenderPass} from './webgpu-render-pass';
 
 // RENDER PIPELINE
 
 /** Creates a new render pipeline when parameters change */
-export default class WebGPURenderPipeline extends RenderPipeline {
+export class WebGPURenderPipeline extends RenderPipeline {
   device: WebGPUDevice;
   handle: GPURenderPipeline;
 
+  vs: WebGPUShader;
+  fs: WebGPUShader | null = null;
+
   private _bufferSlots: Record<string, number>;
   private _buffers: Buffer[];
-  private _indexBuffer: WebGPUBuffer;
+  private _indexBuffer: WebGPUBuffer | null = null;
   // private _firstIndex: number;
   // private _lastIndex: number;
 
   /** For internal use to create BindGroups */
-  private _bindGroupLayout: GPUBindGroupLayout;
-  private _bindGroup: GPUBindGroup = null;
+  private _bindGroupLayout: GPUBindGroupLayout | null = null;
+  private _bindGroup: GPUBindGroup | null = null;
 
   constructor(device: WebGPUDevice, props: RenderPipelineProps) {
     super(device, props);
     this.device = device;
-    this.handle = (this.props.handle as GPURenderPipeline) || this.createHandle();
+    this.handle = this.props.handle as GPURenderPipeline;
+    if (!this.handle) {
+      const descriptor = this._getRenderPipelineDescriptor();
+      log.groupCollapsed(1, `new WebGPURenderPipeline(${this.id})`)();
+      log.probe(1, JSON.stringify(descriptor, null, 2))();
+      log.groupEnd(1)();
+      this.handle = this.device.handle.createRenderPipeline(descriptor);  
+    }
     this.handle.label = this.props.id;
 
-    this._bufferSlots = getBufferSlots(this.props.layout, this.props.bufferMap);
-    this._buffers = new Array<Buffer>(Object.keys(this._bufferSlots).length).fill(null);
-    this._bindGroupLayout = this.handle.getBindGroupLayout(0);
-  }
+    this.vs = cast<WebGPUShader>(props.vs);
+    this.fs = cast<WebGPUShader>(props.fs);
 
-  protected createHandle(): GPURenderPipeline {
-    const descriptor = this._getRenderPipelineDescriptor();
-    const renderPipeline = this.device.handle.createRenderPipeline(descriptor);
-    log.groupCollapsed(1, `new WebGPRenderPipeline(${this.id})`)();
-    log.log(1, JSON.stringify(descriptor, null, 2))();
-    log.groupEnd(1)();
-    return renderPipeline;
+    this._bufferSlots = getBufferSlots(this.props.shaderLayout, this.props.bufferLayout);
+    this._buffers = new Array<Buffer>(Object.keys(this._bufferSlots).length).fill(null);
   }
 
-  destroy() {
+  override destroy(): void {
     // WebGPURenderPipeline has no destroy method.
   }
 
@@ -77,21 +82,29 @@ export default class WebGPURenderPipeline extends RenderPipeline {
     // }
   }
 
-  /** Set the bindings */
+  setConstantAttributes(attributes: Record<string, TypedArray>): void {
+    throw new Error('not implemented');
+  }
+
   setBindings(bindings: Record<string, Binding>): void {
     if (!isObjectEmpty(this.props.bindings)) {
+      // Do we want to save things on CPU side?
       Object.assign(this.props.bindings, bindings);
+
+      // Get hold of the bind group layout. We don't want to do this unless we know there is at least one bind group
+      this._bindGroupLayout = this._bindGroupLayout || this.handle.getBindGroupLayout(0);
+
       // Set up the bindings
       this._bindGroup = getBindGroup(
         this.device.handle,
         this._bindGroupLayout,
-        this.props.layout,
+        this.props.shaderLayout,
         this.props.bindings
       );
     }
   }
 
-  setUniforms(uniforms: Record<string, any>): void {
+  setUniforms(uniforms: Record<string, UniformValue>): void {
     if (!isObjectEmpty(uniforms)) {
       throw new Error('WebGPU does not support uniforms');
     }
@@ -107,13 +120,15 @@ export default class WebGPURenderPipeline extends RenderPipeline {
     return this._bindGroup;
   }
 
-  /** Populate the complex WebGPU GPURenderPipelineDescriptor */
+  /** 
+   * Populate the complex WebGPU GPURenderPipelineDescriptor 
+   */
   protected _getRenderPipelineDescriptor() {
     // Set up the vertex stage
     const vertex: GPUVertexState = {
       module: cast<WebGPUShader>(this.props.vs).handle,
       entryPoint: this.props.vsEntryPoint || 'main',
-      buffers: getVertexBufferLayout(this.props.layout, this.props.bufferMap)
+      buffers: getVertexBufferLayout(this.props.shaderLayout, this.props.bufferLayout)
     };
 
     // Set up the fragment stage
@@ -124,19 +139,29 @@ export default class WebGPURenderPipeline extends RenderPipeline {
         entryPoint: this.props.fsEntryPoint || 'main',
         targets: [
           {
-            format: getWebGPUTextureFormat(this.device.canvasContext.format)
+            // TODO exclamation mark hack!
+            format: getWebGPUTextureFormat(this.device?.canvasContext?.format)
           }
         ]
       };
     }
 
+    // WebGPU has more restrictive topology support than WebGL
+    switch (this.props.topology) {
+      case 'triangle-fan-webgl':
+      case 'line-loop-webgl':
+        throw new Error(`WebGPU does not support primitive topology ${this.props.topology}`);
+      default:
+    }
+
     // Create a partially populated descriptor
-    let descriptor: GPURenderPipelineDescriptor = {
+    const descriptor: GPURenderPipelineDescriptor = {
       vertex,
       fragment,
       primitive: {
         topology: this.props.topology
-      }
+      },
+      layout: 'auto'
     };
 
     // Set parameters on the descriptor
@@ -155,15 +180,16 @@ export default class WebGPURenderPipeline extends RenderPipeline {
     firstInstance?: number;
     baseVertex?: number;
   }): void {
-    const webgpuRenderPass =
+    const webgpuRenderPass: WebGPURenderPass =
       cast<WebGPURenderPass>(options.renderPass) || this.device.getDefaultRenderPass();
 
     // Set pipeline
     webgpuRenderPass.handle.setPipeline(this.handle);
 
     // Set bindings (uniform buffers, textures etc)
-    if (this._getBindGroup()) {
-      webgpuRenderPass.handle.setBindGroup(0, this._getBindGroup());
+    const bindGroup = this._getBindGroup();
+    if (bindGroup) {
+      webgpuRenderPass.handle.setBindGroup(0, bindGroup);
     }
 
     // Set attributes
@@ -180,9 +206,8 @@ export default class WebGPURenderPipeline extends RenderPipeline {
       );
     } else {
       webgpuRenderPass.handle.draw(
-        options.vertexCount,
-        options.instanceCount,
-        options.firstIndex,
+        options.vertexCount || 0,
+        options.instanceCount || 1, // If 0, nothing will be drawn
         options.firstInstance
       );
     }
@@ -197,7 +222,7 @@ export default class WebGPURenderPipeline extends RenderPipeline {
     for (let i = 0; i < buffers.length; ++i) {
       const buffer = cast<WebGPUBuffer>(buffers[i]);
       if (!buffer) {
-        const attribute = this.props.layout.attributes.find(
+        const attribute = this.props.shaderLayout.attributes.find(
           (attribute) => attribute.location === i
         );
         throw new Error(
@@ -209,7 +234,7 @@ export default class WebGPURenderPipeline extends RenderPipeline {
 
     // TODO - HANDLE buffer maps
     /*
-    for (const [bufferName, attributeMapping] of Object.entries(this.props.bufferMap)) {
+    for (const [bufferName, attributeMapping] of Object.entries(this.props.bufferLayout)) {
       const buffer = cast<WebGPUBuffer>(this.props.attributes[bufferName]);
       if (!buffer) {
         log.warn(`Missing buffer for buffer map ${bufferName}`)();

package/src/adapter/resources/webgpu-sampler.ts

@@ -1,5 +1,5 @@
-import {Sampler, SamplerProps} from '@luma.gl/api';
-import type WebGPUDevice from '../webgpu-device';
+import {Sampler, SamplerProps} from '@luma.gl/core';
+import type {WebGPUDevice} from '../webgpu-device';
 
 export type WebGPUSamplerProps = SamplerProps & {
   handle?: GPUSampler;
@@ -8,18 +8,25 @@ export type WebGPUSamplerProps = SamplerProps & {
 /**
  *
  */
-export default class WebGPUSampler extends Sampler {
+export class WebGPUSampler extends Sampler {
   readonly device: WebGPUDevice;
   readonly handle: GPUSampler;
 
   constructor(device: WebGPUDevice, props: WebGPUSamplerProps) {
     super(device, props);
     this.device = device;
-    this.handle = this.handle || this.device.handle.createSampler(this.props);
+
+    // Prepare sampler props
+    const samplerProps: Partial<WebGPUSamplerProps> = {...this.props};
+    if (samplerProps.type !== 'comparison-sampler') {
+      delete samplerProps.compare;
+    }
+
+    this.handle = this.handle || this.device.handle.createSampler(samplerProps);
     this.handle.label = this.props.id;
   }
 
-  destroy(): void {
+  override destroy(): void {
     // this.handle.destroy();
   }
 }

package/src/adapter/resources/webgpu-shader.ts

@@ -1,6 +1,9 @@
-import type {ShaderProps, CompilerMessage} from '@luma.gl/api';
-import {Shader, log} from '@luma.gl/api';
-import type WebGPUDevice from '../webgpu-device';
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
+
+import type {ShaderProps, CompilerMessage} from '@luma.gl/core';
+import {Shader, log} from '@luma.gl/core';
+import type {WebGPUDevice} from '../webgpu-device';
 
 export type WebGPUShaderProps = ShaderProps & {
   handle?: GPUShaderModule;
@@ -9,7 +12,7 @@ export type WebGPUShaderProps = ShaderProps & {
 /**
  * Immutable shader
  */
-export default class WebGPUShader extends Shader {
+export class WebGPUShader extends Shader {
   readonly device: WebGPUDevice;
   readonly handle: GPUShaderModule;
 
@@ -25,7 +28,7 @@ export default class WebGPUShader extends Shader {
     this._checkCompilationError(this.device.handle.popErrorScope());
   }
 
-  async _checkCompilationError(errorScope: Promise<GPUError>): Promise<void> {
+  async _checkCompilationError(errorScope: Promise<GPUError | null>): Promise<void> {
     const error = await errorScope as GPUValidationError;
     if (error) {
       const shaderLog = await this.compilationInfo();
@@ -36,16 +39,16 @@ export default class WebGPUShader extends Shader {
     }
   }
 
-  destroy() {
+  override destroy(): void {
     // this.handle.destroy();
   }
 
   protected createHandle(): GPUShaderModule {
-    const {source} = this.props;
+    const {source, stage} = this.props;
 
     let language = this.props.language;
     // Compile from src
-    if (!language) {
+    if (language === 'auto') {
       // wgsl uses C++ "auto" style arrow notation
       language = source.includes('->') ? 'wgsl' : 'glsl';
     }
@@ -57,7 +60,7 @@ export default class WebGPUShader extends Shader {
         return this.device.handle.createShaderModule({
           code: source,
           // @ts-expect-error
-          transform: (glsl) => this.device.glslang.compileGLSL(glsl, type)
+          transform: (glsl) => this.device.glslang.compileGLSL(glsl, stage)
         });
       default:
         throw new Error(language);
@@ -66,7 +69,7 @@ export default class WebGPUShader extends Shader {
 
   /** Returns compilation info for this shader */
   async compilationInfo(): Promise<readonly CompilerMessage[]> {
-    const compilationInfo = await this.handle.compilationInfo();
+    const compilationInfo = await this.handle.getCompilationInfo();
     return compilationInfo.messages;
   }
 }

package/src/adapter/resources/webgpu-texture.ts

@@ -1,8 +1,8 @@
 // luma.gl, MIT license
-import {Texture, TextureProps, Sampler, SamplerProps, assert} from '@luma.gl/api';
+import {Texture, TextureProps, Sampler, SamplerProps} from '@luma.gl/core';
 import {getWebGPUTextureFormat} from '../helpers/convert-texture-format';
-import type WebGPUDevice from '../webgpu-device';
-import WebGPUSampler from './webgpu-sampler';
+import type {WebGPUDevice} from '../webgpu-device';
+import {WebGPUSampler} from './webgpu-sampler';
 
 const BASE_DIMENSIONS: Record<string, '1d' | '2d' | '3d'> = {
   '1d': '1d',
@@ -13,12 +13,15 @@ const BASE_DIMENSIONS: Record<string, '1d' | '2d' | '3d'> = {
   '3d': '3d'
 };
 
-export default class WebGPUTexture extends Texture {
+export class WebGPUTexture extends Texture {
   readonly device: WebGPUDevice;
   readonly handle: GPUTexture;
   readonly view: GPUTextureView;
   sampler: WebGPUSampler;
 
+  override height: number;
+  override width: number;
+
   // static async createFromImageURL(src, usage = 0) {
   //   const img = document.createElement('img');
   //   img.src = src;
@@ -40,8 +43,19 @@ export default class WebGPUTexture extends Texture {
       this.setData({data: this.props.data}  );
     }
 
+    this.width = this.handle.width;
+    this.height = this.handle.height;
+    // Why not just read all properties directly from the texture
+    // this.depthOrArrayLayers = this.handle.depthOrArrayLayers;
+    // this.mipLevelCount = this.handle.mipLevelCount;
+    // this.sampleCount = this.handle.sampleCount;
+    // this.dimension = this.handle.dimension;
+    // this.format = this.handle.format;
+    // this.usage = this.handle.usage;
+
     // Create a default sampler. This mimics the WebGL1 API where sampler props are stored on the texture
-    this.setSampler(props.sampler);
+    // this.setSampler(props.sampler);
+    this.sampler = props.sampler instanceof WebGPUSampler ? props.sampler : new WebGPUSampler(this.device, props.sampler);
 
     // TODO - To support texture arrays we need to create custom views...
     // But we are not ready to expose TextureViews to the public API.
@@ -81,7 +95,7 @@ export default class WebGPUTexture extends Texture {
     });
   }
 
-  destroy(): void {
+  override destroy(): void {
     this.handle.destroy();
   }
 
@@ -115,7 +129,7 @@ export default class WebGPUTexture extends Texture {
     aspect?: 'all' | 'stencil-only' | 'depth-only';
     colorSpace?: 'srgb';
     premultipliedAlpha?: boolean;
-  }): this {
+  }): {width: number, height: number} {
     const {
       source,
       width = options.source.width,
@@ -156,7 +170,7 @@ export default class WebGPUTexture extends Texture {
         depth
       ]
     );
-    return this;
+    return {width, height};
   }
 
   /*

package/src/adapter/resources/webgpu-vertex-array.ts

@@ -0,0 +1,74 @@
+// luma.gl, MIT license
+// Copyright (c) vis.gl contributors
+
+import type {Device, Buffer, VertexArrayProps, RenderPass, TypedArray} from '@luma.gl/core';
+import {VertexArray, log} from '@luma.gl/core';
+import {getBrowser} from '@probe.gl/env';
+
+import {WebGPUDevice} from '../webgpu-device';
+import {WebGPUBuffer} from '../resources/webgpu-buffer';
+
+import {WebGPURenderPass} from './webgpu-render-pass';
+
+/** VertexArrayObject wrapper */
+export class WebGPUVertexArray extends VertexArray {
+  override get [Symbol.toStringTag](): string {
+    return 'WebGPUVertexArray';
+  }
+
+  readonly device: WebGPUDevice;
+  /** Vertex Array is a helper class under WebGPU */
+  readonly handle: never;
+
+  /** * Attribute 0 can not be disable on most desktop OpenGL based browsers */
+  static isConstantAttributeZeroSupported(device: Device): boolean {
+    return device.info.type === 'webgl2' || getBrowser() === 'Chrome';
+  }
+
+  // Create a VertexArray
+  constructor(device: WebGPUDevice, props?: VertexArrayProps) {
+    super(device, props);
+    this.device = device;
+  }
+
+  override destroy(): void {}
+
+  /**
+   * Set an elements buffer, for indexed rendering.
+   * Must be a Buffer bound to buffer with usage bit Buffer.INDEX set. 
+   */
+  setIndexBuffer(buffer: Buffer | null): void {
+    // assert(!elementBuffer || elementBuffer.glTarget === GL.ELEMENT_ARRAY_BUFFER, ERR_ELEMENTS);
+    this.indexBuffer = buffer;
+  }
+
+  /** Set a location in vertex attributes array to a buffer, enables the location, sets divisor */
+  setBuffer(location: number, buffer: Buffer): void {
+    // Sanity check target
+    // if (buffer.glUsage === GL.ELEMENT_ARRAY_BUFFER) {
+    //   throw new Error('Use setIndexBuffer');
+    // }
+
+    this.attributes[location] = buffer;
+  }
+
+  /** Set a location in vertex attributes array to a constant value, disables the location */
+  override setConstant(location: number, value: TypedArray): void {
+    log.warn(`${this.id} constant attributes not supported on WebGPU`)
+  }
+
+  override bindBeforeRender(renderPass: RenderPass, firstIndex?: number, indexCount?: number): void {
+    const webgpuRenderPass = renderPass as WebGPURenderPass;
+    const webgpuIndexBuffer = this.indexBuffer as WebGPUBuffer;
+    webgpuRenderPass.handle.setIndexBuffer(webgpuIndexBuffer?.handle, webgpuIndexBuffer?.indexType);
+    for (let location = 0; location < this.maxVertexAttributes; location++) {
+      const webgpuBuffer = this.attributes[location] as WebGPUBuffer;
+      webgpuRenderPass.handle.setVertexBuffer(location, webgpuBuffer.handle);
+    }
+    // TODO - emit warnings/errors/throw if constants have been set on this vertex array
+  }
+
+  override unbindAfterRender(renderPass: RenderPass): void {
+    // On WebGPU we don't unbind
+  }
+}