@luma.gl/webgpu 9.1.4 → 9.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luma.gl/webgpu",
-  "version": "9.1.4",
+  "version": "9.1.6",
   "description": "WebGPU adapter for the luma.gl core API",
   "type": "module",
   "license": "MIT",
@@ -43,5 +43,5 @@
     "@probe.gl/env": "^4.0.8",
     "@webgpu/types": "^0.1.34"
   },
-  "gitHead": "553efa111ddb2709b2278d1e3f6c83cb66a36052"
+  "gitHead": "a0c83f5e6bdd9cdf59917ecf01ef958432c42b86"
 }

package/src/adapter/helpers/get-bind-group.ts

@@ -46,7 +46,8 @@ export function getShaderLayoutBinding(
 ): BindingDeclaration | null {
   const bindingLayout = shaderLayout.bindings.find(
     binding =>
-      binding.name === bindingName || `${binding.name}uniforms` === bindingName.toLocaleLowerCase()
+      binding.name === bindingName ||
+      `${binding.name.toLocaleLowerCase()}uniforms` === bindingName.toLocaleLowerCase()
   );
   if (!bindingLayout) {
     log.warn(`Binding ${bindingName} not set: Not found in shader layout.`)();

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

@@ -0,0 +1,125 @@
+import {
+  PipelineLayout,
+  PipelineLayoutProps,
+  StorageBufferBindingLayout,
+  StorageTextureBindingLayout
+} from '@luma.gl/core';
+import {WebGPUDevice} from '../webgpu-device';
+
+const VISIBILITY_ALL = GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT | GPUShaderStage.COMPUTE;
+
+export class WebGPUPipelineLayout extends PipelineLayout {
+  device: WebGPUDevice;
+  handle: GPUPipelineLayout;
+
+  constructor(device: WebGPUDevice, props: PipelineLayoutProps) {
+    super(device, props);
+
+    this.device = device;
+
+    const bindGroupEntries = this.mapShaderLayoutToBindGroupEntries();
+
+    this.handle = this.device.handle.createPipelineLayout({
+      label: props?.id ?? 'unnamed-pipeline-layout',
+      bindGroupLayouts: [
+        // TODO (kaapp): We can cache these to re-use them across
+        // layers, particularly if using a separate group for injected
+        // bindings (e.g. project/lighting)
+        this.device.handle.createBindGroupLayout({
+          label: 'bind-group-layout',
+          entries: bindGroupEntries
+        })
+      ]
+    });
+  }
+
+  override destroy(): void {
+    // WebGPUPipelineLayout has no destroy method.
+    // @ts-expect-error
+    this.handle = null;
+  }
+
+  protected mapShaderLayoutToBindGroupEntries(): GPUBindGroupLayoutEntry[] {
+    // Set up the pipeline layout
+    // TODO (kaapp): This only supports the first group, but so does the rest of the code
+    const bindGroupEntries: GPUBindGroupLayoutEntry[] = [];
+
+    for (let i = 0; i < this.props.shaderLayout.bindings.length; i++) {
+      const binding = this.props.shaderLayout.bindings[i];
+      const bindingTypeInfo: Omit<GPUBindGroupLayoutEntry, 'binding' | 'visibility'> = {};
+
+      switch (binding.type) {
+        case 'uniform': {
+          bindingTypeInfo.buffer = {
+            type: 'uniform',
+            hasDynamicOffset: binding.hasDynamicOffset,
+            minBindingSize: binding.minBindingSize
+          };
+          break;
+        }
+
+        case 'read-only-storage': {
+          bindingTypeInfo.buffer = {
+            type: 'read-only-storage',
+            hasDynamicOffset: binding.hasDynamicOffset,
+            minBindingSize: binding.minBindingSize
+          };
+          break;
+        }
+
+        case 'sampler': {
+          bindingTypeInfo.sampler = {
+            type: binding.samplerType
+          };
+          break;
+        }
+
+        case 'storage': {
+          if (isStorageTextureBindingLayout(binding)) {
+            bindingTypeInfo.storageTexture = {
+              // TODO (kaapp): Not all formats in the binding layout are supported
+              // by WebGPU, but at least it will provide a clear error for now.
+              format: binding.format as GPUTextureFormat,
+              access: binding.access,
+              viewDimension: binding.viewDimension
+            };
+          } else {
+            bindingTypeInfo.buffer = {
+              type: 'storage',
+              hasDynamicOffset: binding.hasDynamicOffset,
+              minBindingSize: binding.minBindingSize
+            };
+          }
+          break;
+        }
+
+        case 'texture': {
+          bindingTypeInfo.texture = {
+            multisampled: binding.multisampled,
+            sampleType: binding.sampleType,
+            viewDimension: binding.viewDimension
+          };
+          break;
+        }
+
+        default: {
+          console.warn('unhandled binding type when creating pipeline descriptor');
+        }
+      }
+
+      bindGroupEntries.push({
+        binding: binding.location,
+        visibility: binding.visibility || VISIBILITY_ALL,
+        ...bindingTypeInfo
+      });
+    }
+
+    return bindGroupEntries;
+  }
+}
+
+const isStorageTextureBindingLayout = (
+  maybe: StorageBufferBindingLayout | StorageTextureBindingLayout
+): maybe is StorageTextureBindingLayout => {
+  return (maybe as StorageTextureBindingLayout).format !== undefined;
+};

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

@@ -168,6 +168,10 @@ export class WebGPURenderPipeline extends RenderPipeline {
       ]
     };
 
+    const layout = this.device.createPipelineLayout({
+      shaderLayout: this.shaderLayout
+    });
+
     // Create a partially populated descriptor
     const descriptor: GPURenderPipelineDescriptor = {
       vertex,
@@ -175,7 +179,7 @@ export class WebGPURenderPipeline extends RenderPipeline {
       primitive: {
         topology: this.props.topology
       },
-      layout: 'auto'
+      layout: layout.handle
     };
 
     if (this.props.parameters.depthWriteEnabled && this.props.parameters.depthCompare) {

package/src/adapter/webgpu-device.ts

@@ -28,7 +28,8 @@ import type {
   TransformFeedbackProps,
   QuerySet,
   QuerySetProps,
-  DeviceProps
+  DeviceProps,
+  PipelineLayoutProps,
 } from '@luma.gl/core';
 import {Device, DeviceFeatures} from '@luma.gl/core';
 import {WebGPUBuffer} from './resources/webgpu-buffer';
@@ -46,6 +47,7 @@ import {WebGPUVertexArray} from './resources/webgpu-vertex-array';
 
 import {WebGPUCanvasContext} from './webgpu-canvas-context';
 import {WebGPUQuerySet} from './resources/webgpu-query-set';
+import {WebGPUPipelineLayout} from './resources/webgpu-pipeline-layout';
 
 /** WebGPU Device implementation */
 export class WebGPUDevice extends Device {
@@ -194,6 +196,10 @@ export class WebGPUDevice extends Device {
     return new WebGPUCanvasContext(this, this.adapter, props);
   }
 
+  createPipelineLayout(props: PipelineLayoutProps): WebGPUPipelineLayout {
+    return new WebGPUPipelineLayout(this, props);
+  }
+
   submit(): void {
     const commandBuffer = this.commandEncoder?.finish();
     if (commandBuffer) {
@@ -205,7 +211,6 @@ export class WebGPUDevice extends Device {
         }
       });
     }
-    this.commandEncoder = null;
   }
 
   // PRIVATE METHODS