@luma.gl/webgpu 9.0.0-beta.4 → 9.0.0-beta.5

package/dist/adapter/resources/webgpu-compute-pass.js

@@ -1,44 +1,57 @@
 import { ComputePass } from '@luma.gl/core';
 export class WebGPUComputePass extends ComputePass {
-  constructor(device, props) {
-    var _device$commandEncode;
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this._bindGroupLayout = null;
-    this.device = device;
-    this.handle = this.props.handle || ((_device$commandEncode = device.commandEncoder) === null || _device$commandEncode === void 0 ? void 0 : _device$commandEncode.beginComputePass({
-      label: this.props.id
-    }));
-  }
-  destroy() {}
-  end() {
-    this.handle.end();
-  }
-  setPipeline(pipeline) {
-    const wgpuPipeline = pipeline;
-    this.handle.setPipeline(wgpuPipeline.handle);
-    this._bindGroupLayout = wgpuPipeline._getBindGroupLayout();
-  }
-  setBindings(bindings) {
-    throw new Error('fix me');
-  }
-  dispatch(x, y, z) {
-    this.handle.dispatchWorkgroups(x, y, z);
-  }
-  dispatchIndirect(indirectBuffer) {
-    let indirectOffset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-    const webgpuBuffer = indirectBuffer;
-    this.handle.dispatchWorkgroupsIndirect(webgpuBuffer.handle, indirectOffset);
-  }
-  pushDebugGroup(groupLabel) {
-    this.handle.pushDebugGroup(groupLabel);
-  }
-  popDebugGroup() {
-    this.handle.popDebugGroup();
-  }
-  insertDebugMarker(markerLabel) {
-    this.handle.insertDebugMarker(markerLabel);
-  }
+    device;
+    handle;
+    _bindGroupLayout = null;
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        this.handle = this.props.handle || device.commandEncoder?.beginComputePass({
+            label: this.props.id,
+            // timestampWrites?: GPUComputePassTimestampWrites;
+        });
+    }
+    /** @note no WebGPU destroy method, just gc */
+    destroy() { }
+    end() {
+        this.handle.end();
+    }
+    setPipeline(pipeline) {
+        const wgpuPipeline = pipeline;
+        this.handle.setPipeline(wgpuPipeline.handle);
+        this._bindGroupLayout = wgpuPipeline._getBindGroupLayout();
+    }
+    /** Sets an array of bindings (uniform buffers, samplers, textures, ...) */
+    setBindings(bindings) {
+        throw new Error('fix me');
+        // const bindGroup = getBindGroup(this.device.handle, this._bindGroupLayout, this.props.bindings);
+        // this.handle.setBindGroup(0, bindGroup);
+    }
+    /**
+     * Dispatch work to be performed with the current ComputePipeline.
+     * @param x X dimension of the grid of workgroups to dispatch.
+     * @param y Y dimension of the grid of workgroups to dispatch.
+     * @param z Z dimension of the grid of workgroups to dispatch.
+     */
+    dispatch(x, y, z) {
+        this.handle.dispatchWorkgroups(x, y, z);
+    }
+    /**
+     * Dispatch work to be performed with the current ComputePipeline.
+     * @param indirectBuffer buffer must be a tightly packed block of three 32-bit unsigned integer values (12 bytes total), given in the same order as the arguments for dispatch()
+     * @param indirectOffset
+     */
+    dispatchIndirect(indirectBuffer, indirectOffset = 0) {
+        const webgpuBuffer = indirectBuffer;
+        this.handle.dispatchWorkgroupsIndirect(webgpuBuffer.handle, indirectOffset);
+    }
+    pushDebugGroup(groupLabel) {
+        this.handle.pushDebugGroup(groupLabel);
+    }
+    popDebugGroup() {
+        this.handle.popDebugGroup();
+    }
+    insertDebugMarker(markerLabel) {
+        this.handle.insertDebugMarker(markerLabel);
+    }
 }
-//# sourceMappingURL=webgpu-compute-pass.js.map

package/dist/adapter/resources/webgpu-compute-pipeline.js

@@ -1,22 +1,27 @@
+// prettier-ignore
 import { ComputePipeline } from '@luma.gl/core';
+// COMPUTE PIPELINE
+/** Creates a new compute pipeline when parameters change */
 export class WebGPUComputePipeline extends ComputePipeline {
-  constructor(device, props) {
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this.device = device;
-    const webgpuShader = this.props.cs;
-    this.handle = this.props.handle || this.device.handle.createComputePipeline({
-      label: this.props.id,
-      compute: {
-        module: webgpuShader.handle,
-        entryPoint: this.props.csEntryPoint
-      },
-      layout: 'auto'
-    });
-  }
-  _getBindGroupLayout() {
-    return this.handle.getBindGroupLayout(0);
-  }
+    device;
+    handle;
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        const webgpuShader = this.props.cs;
+        this.handle = this.props.handle || this.device.handle.createComputePipeline({
+            label: this.props.id,
+            compute: {
+                module: webgpuShader.handle,
+                entryPoint: this.props.csEntryPoint,
+                // constants: this.props.csConstants
+            },
+            layout: 'auto'
+        });
+    }
+    /** For internal use in render passes */
+    _getBindGroupLayout() {
+        // TODO: Cache?
+        return this.handle.getBindGroupLayout(0);
+    }
 }
-//# sourceMappingURL=webgpu-compute-pipeline.js.map

package/dist/adapter/resources/webgpu-external-texture.js

@@ -1,22 +1,32 @@
+// luma.gl, MIT license
 import { ExternalTexture } from '@luma.gl/core';
-import { WebGPUSampler } from "./webgpu-sampler.js";
+import { WebGPUSampler } from './webgpu-sampler';
+/**
+ * Cheap, temporary texture view for videos
+ * Only valid within same callback, destroyed automatically as a microtask.
+ */
 export class WebGPUExternalTexture extends ExternalTexture {
-  constructor(device, props) {
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this.sampler = void 0;
-    this.device = device;
-    this.handle = this.props.handle || this.device.handle.importExternalTexture({
-      source: props.source,
-      colorSpace: props.colorSpace
-    });
-    this.sampler = null;
-  }
-  destroy() {}
-  setSampler(sampler) {
-    this.sampler = sampler instanceof WebGPUSampler ? sampler : new WebGPUSampler(this.device, sampler);
-    return this;
-  }
+    device;
+    handle;
+    sampler;
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        this.handle = this.props.handle || this.device.handle.importExternalTexture({
+            source: props.source,
+            colorSpace: props.colorSpace
+        });
+        this.sampler = null;
+    }
+    destroy() {
+        // External textures are destroyed automatically,
+        // as a microtask, instead of manually or upon garbage collection like other resources.
+        // this.handle.destroy();
+    }
+    /** Set default sampler */
+    setSampler(sampler) {
+        // We can accept a sampler instance or set of props;
+        this.sampler = sampler instanceof WebGPUSampler ? sampler : new WebGPUSampler(this.device, sampler);
+        return this;
+    }
 }
-//# sourceMappingURL=webgpu-external-texture.js.map

package/dist/adapter/resources/webgpu-framebuffer.js

@@ -1,10 +1,14 @@
 import { Framebuffer } from '@luma.gl/core';
+/**
+ * Create new textures with correct size for all attachments.
+ * @note resize() destroys existing textures (if size has changed).
+ */
 export class WebGPUFramebuffer extends Framebuffer {
-  constructor(device, props) {
-    super(device, props);
-    this.device = void 0;
-    this.device = device;
-    this.autoCreateAttachmentTextures();
-  }
+    device;
+    constructor(device, props) {
+        super(device, props);
+        this.device = device;
+        // Auto create textures for attachments if needed
+        this.autoCreateAttachmentTextures();
+    }
 }
-//# sourceMappingURL=webgpu-framebuffer.js.map

package/dist/adapter/resources/webgpu-query.js

@@ -1,2 +1,43 @@
+/*
+import {Resource, Query, QueryProps} from '@luma.gl/core';
+import {WebGPUDevice} from '../webgpu-device';
 
-//# sourceMappingURL=webgpu-query.js.map
+export type WebGPUQueryProps = QueryProps & {
+  handle?: any;
+};
+
+const DEFAULT_QUERY_PROPS: Required<WebGPUQueryProps> = {
+  id: undefined,
+  handle: undefined,
+  userData: undefined,
+  type: 'timestamp',
+  count: 1,
+  pipelineStatistics: []
+};
+
+/**
+ * Immutable
+ *
+class WebGPUQuery extends Resource<WebGPUQueryProps> implements Query {
+  readonly device: WebGPUDevice;
+  readonly handle: GPUQuerySet;
+
+  constructor(device: WebGPUDevice, props: WebGPUQueryProps) {
+    super(device, props, DEFAULT_QUERY_PROPS);
+    this.handle = this.props.handle as GPUQuerySet || this.createHandle();
+    this.handle.label = this.props.id;
+  }
+
+  protected createHandle() {
+    return this.device.handle.createQuerySet({
+      type: this.props.type,
+      count: this.props.count,
+      pipelineStatistics: this.props.pipelineStatistics
+    });
+  }
+
+  override destroy(): void {
+    this.handle.destroy();
+  }
+}
+*/ 

package/dist/adapter/resources/webgpu-render-pass.js

@@ -1,115 +1,125 @@
 import { RenderPass, cast, log } from '@luma.gl/core';
 export class WebGPURenderPass extends RenderPass {
-  constructor(device) {
-    let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-    super(device, props);
-    this.device = void 0;
-    this.handle = void 0;
-    this.pipeline = null;
-    this.device = device;
-    const framebuffer = props.framebuffer || device.canvasContext.getCurrentFramebuffer();
-    const renderPassDescriptor = this.getRenderPassDescriptor(framebuffer);
-    log.groupCollapsed(3, `new WebGPURenderPass(${this.id})`)();
-    log.probe(3, JSON.stringify(renderPassDescriptor, null, 2))();
-    log.groupEnd(3)();
-    this.handle = this.props.handle || device.commandEncoder.beginRenderPass(renderPassDescriptor);
-    this.handle.label = this.props.id;
-  }
-  destroy() {}
-  end() {
-    this.handle.end();
-  }
-  setPipeline(pipeline) {
-    this.pipeline = cast(pipeline);
-    this.handle.setPipeline(this.pipeline.handle);
-  }
-  setBindings(bindings) {
-    var _this$pipeline, _this$pipeline2;
-    (_this$pipeline = this.pipeline) === null || _this$pipeline === void 0 ? void 0 : _this$pipeline.setBindings(bindings);
-    const bindGroup = (_this$pipeline2 = this.pipeline) === null || _this$pipeline2 === void 0 ? void 0 : _this$pipeline2._getBindGroup();
-    if (bindGroup) {
-      this.handle.setBindGroup(0, bindGroup);
+    device;
+    handle;
+    /** Active pipeline */
+    pipeline = null;
+    constructor(device, props = {}) {
+        super(device, props);
+        this.device = device;
+        const framebuffer = props.framebuffer || device.canvasContext.getCurrentFramebuffer();
+        const renderPassDescriptor = this.getRenderPassDescriptor(framebuffer);
+        log.groupCollapsed(3, `new WebGPURenderPass(${this.id})`)();
+        log.probe(3, JSON.stringify(renderPassDescriptor, null, 2))();
+        log.groupEnd(3)();
+        this.handle = this.props.handle || device.commandEncoder.beginRenderPass(renderPassDescriptor);
+        this.handle.label = this.props.id;
     }
-  }
-  setIndexBuffer(buffer, indexFormat) {
-    let offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-    let size = arguments.length > 3 ? arguments[3] : undefined;
-    this.handle.setIndexBuffer(cast(buffer).handle, indexFormat, offset, size);
-  }
-  setVertexBuffer(slot, buffer) {
-    let offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-    this.handle.setVertexBuffer(slot, cast(buffer).handle, offset);
-  }
-  draw(options) {
-    if (options.indexCount) {
-      this.handle.drawIndexed(options.indexCount, options.instanceCount, options.firstIndex, options.baseVertex, options.firstInstance);
-    } else {
-      this.handle.draw(options.vertexCount || 0, options.instanceCount || 1, options.firstIndex, options.firstInstance);
+    destroy() { }
+    end() {
+        this.handle.end();
     }
-  }
-  drawIndirect() {}
-  setParameters(parameters) {
-    const {
-      blendConstant,
-      stencilReference,
-      scissorRect,
-      viewport
-    } = parameters;
-    if (blendConstant) {
-      this.handle.setBlendConstant(blendConstant);
+    setPipeline(pipeline) {
+        this.pipeline = cast(pipeline);
+        this.handle.setPipeline(this.pipeline.handle);
     }
-    if (stencilReference) {
-      this.handle.setStencilReference(stencilReference);
+    /** Sets an array of bindings (uniform buffers, samplers, textures, ...) */
+    setBindings(bindings) {
+        this.pipeline?.setBindings(bindings);
+        const bindGroup = this.pipeline?._getBindGroup();
+        if (bindGroup) {
+            this.handle.setBindGroup(0, bindGroup);
+        }
     }
-    if (scissorRect) {
-      this.handle.setScissorRect(scissorRect[0], scissorRect[1], scissorRect[2], scissorRect[3]);
+    setIndexBuffer(buffer, indexFormat, offset = 0, size) {
+        this.handle.setIndexBuffer(cast(buffer).handle, indexFormat, offset, size);
     }
-    if (viewport) {
-      this.handle.setViewport(viewport[0], viewport[1], viewport[2], viewport[3], viewport[4], viewport[5]);
+    setVertexBuffer(slot, buffer, offset = 0) {
+        this.handle.setVertexBuffer(slot, cast(buffer).handle, offset);
     }
-  }
-  pushDebugGroup(groupLabel) {
-    this.handle.pushDebugGroup(groupLabel);
-  }
-  popDebugGroup() {
-    this.handle.popDebugGroup();
-  }
-  insertDebugMarker(markerLabel) {
-    this.handle.insertDebugMarker(markerLabel);
-  }
-  getRenderPassDescriptor(framebuffer) {
-    const renderPassDescriptor = {
-      colorAttachments: []
-    };
-    renderPassDescriptor.colorAttachments = framebuffer.colorAttachments.map(colorAttachment => ({
-      loadOp: this.props.clearColor !== false ? 'clear' : 'load',
-      colorClearValue: this.props.clearColor || [0, 0, 0, 0],
-      storeOp: this.props.discard ? 'discard' : 'store',
-      view: colorAttachment.createView()
-    }));
-    if (framebuffer.depthStencilAttachment) {
-      renderPassDescriptor.depthStencilAttachment = {
-        view: framebuffer.depthStencilAttachment.createView()
-      };
-      const {
-        depthStencilAttachment
-      } = renderPassDescriptor;
-      if (this.props.depthReadOnly) {
-        depthStencilAttachment.depthReadOnly = true;
-      }
-      depthStencilAttachment.depthClearValue = this.props.clearDepth || 0;
-      const hasDepthAspect = true;
-      if (hasDepthAspect) {
-        depthStencilAttachment.depthLoadOp = this.props.clearDepth !== false ? 'clear' : 'load';
-        depthStencilAttachment.depthStoreOp = 'store';
-      }
-      const hasStencilAspect = false;
-      if (hasStencilAspect) {
-        depthStencilAttachment.stencilLoadOp = this.props.clearStencil !== false ? 'clear' : 'load';
-        depthStencilAttachment.stencilStoreOp = 'store';
-      }
+    draw(options) {
+        if (options.indexCount) {
+            this.handle.drawIndexed(options.indexCount, options.instanceCount, options.firstIndex, options.baseVertex, options.firstInstance);
+        }
+        else {
+            this.handle.draw(options.vertexCount || 0, options.instanceCount || 1, options.firstIndex, options.firstInstance);
+        }
+    }
+    drawIndirect() {
+        // drawIndirect(indirectBuffer: GPUBuffer, indirectOffset: number): void;
+        // drawIndexedIndirect(indirectBuffer: GPUBuffer, indirectOffset: number): void;
+    }
+    setParameters(parameters) {
+        const { blendConstant, stencilReference, scissorRect, viewport } = parameters;
+        if (blendConstant) {
+            this.handle.setBlendConstant(blendConstant);
+        }
+        if (stencilReference) {
+            this.handle.setStencilReference(stencilReference);
+        }
+        if (scissorRect) {
+            this.handle.setScissorRect(scissorRect[0], scissorRect[1], scissorRect[2], scissorRect[3]);
+        }
+        // TODO - explain how 3 dimensions vs 2 in WebGL works.
+        if (viewport) {
+            this.handle.setViewport(viewport[0], viewport[1], viewport[2], viewport[3], viewport[4], viewport[5]);
+        }
+    }
+    pushDebugGroup(groupLabel) {
+        this.handle.pushDebugGroup(groupLabel);
+    }
+    popDebugGroup() {
+        this.handle.popDebugGroup();
+    }
+    insertDebugMarker(markerLabel) {
+        this.handle.insertDebugMarker(markerLabel);
+    }
+    // writeTimestamp(querySet: GPUQuerySet, queryIndex: number): void;
+    // beginOcclusionQuery(queryIndex: number): void;
+    // endOcclusionQuery(): void;
+    // beginPipelineStatisticsQuery(querySet: GPUQuerySet, queryIndex: number): void;
+    // 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.
+     */
+    getRenderPassDescriptor(framebuffer) {
+        const renderPassDescriptor = {
+            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.createView()
+        }));
+        if (framebuffer.depthStencilAttachment) {
+            renderPassDescriptor.depthStencilAttachment = {
+                view: framebuffer.depthStencilAttachment.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;
     }
-    return renderPassDescriptor;
-  }
 }
-//# sourceMappingURL=webgpu-render-pass.js.map