@luma.gl/engine 9.0.0-beta.1 → 9.0.0-beta.10

package/dist/index.cjs

@@ -22,13 +22,14 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
+// dist/index.js
+var dist_exports = {};
+__export(dist_exports, {
   AnimationLoop: () => AnimationLoop,
   AnimationLoopTemplate: () => AnimationLoopTemplate,
   BufferTransform: () => BufferTransform,
   ClipSpace: () => ClipSpace,
+  Computation: () => Computation,
   ConeGeometry: () => ConeGeometry,
   CubeGeometry: () => CubeGeometry,
   CylinderGeometry: () => CylinderGeometry,
@@ -42,6 +43,7 @@ __export(src_exports, {
   PipelineFactory: () => PipelineFactory,
   PlaneGeometry: () => PlaneGeometry,
   ScenegraphNode: () => ScenegraphNode,
+  ShaderFactory: () => ShaderFactory,
   SphereGeometry: () => SphereGeometry,
   TextureTransform: () => TextureTransform,
   Timeline: () => Timeline,
@@ -49,9 +51,9 @@ __export(src_exports, {
   _ShaderInputs: () => ShaderInputs,
   makeAnimationLoop: () => makeAnimationLoop
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(dist_exports);
 
-// src/animation/timeline.ts
+// dist/animation/timeline.js
 var channelHandles = 1;
 var animationHandles = 1;
 var Timeline = class {
@@ -156,7 +158,7 @@ var Timeline = class {
   }
 };
 
-// src/animation/key-frames.ts
+// dist/animation/key-frames.js
 var KeyFrames = class {
   startIndex = -1;
   endIndex = -1;
@@ -213,7 +215,7 @@ var KeyFrames = class {
   }
 };
 
-// src/animation-loop/animation-loop-template.ts
+// dist/animation-loop/animation-loop-template.js
 var AnimationLoopTemplate = class {
   constructor(animationProps) {
   }
@@ -222,7 +224,7 @@ var AnimationLoopTemplate = class {
   }
 };
 
-// src/animation-loop/animation-loop.ts
+// dist/animation-loop/animation-loop.js
 var import_core = require("@luma.gl/core");
 var import_core2 = require("@luma.gl/core");
 var import_stats = require("@probe.gl/stats");
@@ -564,7 +566,14 @@ var AnimationLoop = class {
   /** Default viewport setup */
   _resizeViewport() {
     if (this.props.autoResizeViewport && this.device.gl) {
-      this.device.gl.viewport(0, 0, this.device.gl.drawingBufferWidth, this.device.gl.drawingBufferHeight);
+      this.device.gl.viewport(
+        0,
+        0,
+        // @ts-expect-error Expose canvasContext
+        this.device.gl.drawingBufferWidth,
+        // @ts-expect-error Expose canvasContext
+        this.device.gl.drawingBufferHeight
+      );
     }
   }
   /**
@@ -602,7 +611,7 @@ var AnimationLoop = class {
   }
 };
 
-// src/animation-loop/make-animation-loop.ts
+// dist/animation-loop/make-animation-loop.js
 var import_core3 = require("@luma.gl/core");
 function makeAnimationLoop(AnimationLoopTemplateCtor, props) {
   let renderLoop = null;
@@ -623,18 +632,110 @@ function makeAnimationLoop(AnimationLoopTemplateCtor, props) {
   return animationLoop;
 }
 
-// src/model/model.ts
-var import_core7 = require("@luma.gl/core");
+// dist/model/model.js
 var import_core8 = require("@luma.gl/core");
 var import_core9 = require("@luma.gl/core");
+var import_core10 = require("@luma.gl/core");
+var import_core11 = require("@luma.gl/core");
 var import_shadertools2 = require("@luma.gl/shadertools");
 
-// src/shader-inputs.ts
+// dist/geometry/gpu-geometry.js
 var import_core4 = require("@luma.gl/core");
+var GPUGeometry = class {
+  id;
+  userData = {};
+  /** Determines how vertices are read from the 'vertex' attributes */
+  topology;
+  bufferLayout = [];
+  vertexCount;
+  indices;
+  attributes;
+  constructor(props) {
+    this.id = props.id || (0, import_core4.uid)("geometry");
+    this.topology = props.topology;
+    this.indices = props.indices || null;
+    this.attributes = props.attributes;
+    this.vertexCount = props.vertexCount;
+    this.bufferLayout = props.bufferLayout || [];
+    if (this.indices) {
+      (0, import_core4.assert)(this.indices.usage === import_core4.Buffer.INDEX);
+    }
+  }
+  destroy() {
+    var _a;
+    (_a = this.indices) == null ? void 0 : _a.destroy();
+    for (const attribute of Object.values(this.attributes)) {
+      attribute.destroy();
+    }
+  }
+  getVertexCount() {
+    return this.vertexCount;
+  }
+  getAttributes() {
+    return this.attributes;
+  }
+  getIndexes() {
+    return this.indices;
+  }
+  _calculateVertexCount(positions) {
+    const vertexCount = positions.byteLength / 12;
+    return vertexCount;
+  }
+};
+function makeGPUGeometry(device, geometry) {
+  if (geometry instanceof GPUGeometry) {
+    return geometry;
+  }
+  const indices = getIndexBufferFromGeometry(device, geometry);
+  const { attributes, bufferLayout } = getAttributeBuffersFromGeometry(device, geometry);
+  return new GPUGeometry({
+    topology: geometry.topology || "triangle-list",
+    bufferLayout,
+    vertexCount: geometry.vertexCount,
+    indices,
+    attributes
+  });
+}
+function getIndexBufferFromGeometry(device, geometry) {
+  if (!geometry.indices) {
+    return void 0;
+  }
+  const data = geometry.indices.value;
+  return device.createBuffer({ usage: import_core4.Buffer.INDEX, data });
+}
+function getAttributeBuffersFromGeometry(device, geometry) {
+  const bufferLayout = [];
+  const attributes = {};
+  for (const [attributeName, attribute] of Object.entries(geometry.attributes)) {
+    let name = attributeName;
+    switch (attributeName) {
+      case "POSITION":
+        name = "positions";
+        break;
+      case "NORMAL":
+        name = "normals";
+        break;
+      case "TEXCOORD_0":
+        name = "texCoords";
+        break;
+      case "COLOR_0":
+        name = "colors";
+        break;
+    }
+    attributes[name] = device.createBuffer({ data: attribute.value, id: `${attributeName}-buffer` });
+    const { value, size, normalized } = attribute;
+    bufferLayout.push({ name, format: (0, import_core4.getVertexFormatFromAttribute)(value, size, normalized) });
+  }
+  const vertexCount = geometry._calculateVertexCount(geometry.attributes, geometry.indices);
+  return { attributes, bufferLayout, vertexCount };
+}
+
+// dist/shader-inputs.js
+var import_core5 = require("@luma.gl/core");
 var import_shadertools = require("@luma.gl/shadertools");
 var ShaderInputs = class {
-  /** 
-   * The map of modules 
+  /**
+   * The map of modules
    * @todo should should this include the resolved dependencies?
    */
   modules;
@@ -650,7 +751,7 @@ var ShaderInputs = class {
    */
   constructor(modules) {
     const allModules = (0, import_shadertools._resolveModules)(Object.values(modules));
-    import_core4.log.log(1, "Creating ShaderInputs with modules", allModules.map((m) => m.name))();
+    import_core5.log.log(1, "Creating ShaderInputs with modules", allModules.map((m) => m.name))();
     this.modules = modules;
     this.moduleUniforms = {};
     this.moduleBindings = {};
@@ -673,7 +774,7 @@ var ShaderInputs = class {
       const moduleProps = props[moduleName];
       const module2 = this.modules[moduleName];
       if (!module2) {
-        import_core4.log.warn(`Module ${name} not found`)();
+        import_core5.log.warn(`Module ${name} not found`)();
         continue;
       }
       const oldUniforms = this.moduleUniforms[moduleName];
@@ -685,8 +786,8 @@ var ShaderInputs = class {
   // getUniformBlocks(): Record<string, Texture | Sampler> {
   //   return this.moduleUniforms;
   // }
-  /** 
-   * Return the map of modules 
+  /**
+   * Return the map of modules
    * @todo should should this include the resolved dependencies?
    */
   getModules() {
@@ -719,106 +820,15 @@ var ShaderInputs = class {
   }
 };
 
-// src/geometry/gpu-geometry.ts
-var import_core5 = require("@luma.gl/core");
-var GPUGeometry = class {
-  id;
-  userData = {};
-  /** Determines how vertices are read from the 'vertex' attributes */
-  topology;
-  bufferLayout = [];
-  vertexCount;
-  indices;
-  attributes;
-  constructor(props) {
-    this.id = props.id || (0, import_core5.uid)("geometry");
-    this.topology = props.topology;
-    this.indices = props.indices || null;
-    this.attributes = props.attributes;
-    this.vertexCount = props.vertexCount;
-    this.bufferLayout = props.bufferLayout || [];
-    if (this.indices) {
-      (0, import_core5.assert)(this.indices.usage === import_core5.Buffer.INDEX);
-    }
-  }
-  destroy() {
-    var _a;
-    this.indices.destroy();
-    this.attributes.positions.destroy();
-    this.attributes.normals.destroy();
-    this.attributes.texCoords.destroy();
-    (_a = this.attributes.colors) == null ? void 0 : _a.destroy();
-  }
-  getVertexCount() {
-    return this.vertexCount;
-  }
-  getAttributes() {
-    return this.attributes;
-  }
-  getIndexes() {
-    return this.indices;
-  }
-  _calculateVertexCount(positions) {
-    const vertexCount = positions.byteLength / 12;
-    return vertexCount;
-  }
-};
-function makeGPUGeometry(device, geometry) {
-  if (geometry instanceof GPUGeometry) {
-    return geometry;
-  }
-  const indices = getIndexBufferFromGeometry(device, geometry);
-  const { attributes, bufferLayout } = getAttributeBuffersFromGeometry(device, geometry);
-  return new GPUGeometry({
-    topology: geometry.topology || "triangle-list",
-    bufferLayout,
-    vertexCount: geometry.vertexCount,
-    indices,
-    attributes
-  });
-}
-function getIndexBufferFromGeometry(device, geometry) {
-  if (!geometry.indices) {
-    return void 0;
-  }
-  const data = geometry.indices.value;
-  return device.createBuffer({ usage: import_core5.Buffer.INDEX, data });
-}
-function getAttributeBuffersFromGeometry(device, geometry) {
-  const bufferLayout = [];
-  const attributes = {};
-  for (const [attributeName, attribute] of Object.entries(geometry.attributes)) {
-    let name = attributeName;
-    switch (attributeName) {
-      case "POSITION":
-        name = "positions";
-        break;
-      case "NORMAL":
-        name = "normals";
-        break;
-      case "TEXCOORD_0":
-        name = "texCoords";
-        break;
-      case "COLOR_0":
-        name = "colors";
-        break;
-    }
-    attributes[name] = device.createBuffer({ data: attribute.value, id: `${attributeName}-buffer` });
-    const { value, size, normalized } = attribute;
-    bufferLayout.push({ name, format: (0, import_core5.getVertexFormatFromAttribute)(value, size, normalized) });
-  }
-  const vertexCount = geometry._calculateVertexCount(geometry.attributes, geometry.indices);
-  return { attributes, bufferLayout, vertexCount };
-}
-
-// src/lib/pipeline-factory.ts
+// dist/lib/pipeline-factory.js
 var import_core6 = require("@luma.gl/core");
 var _PipelineFactory = class {
   device;
   _hashCounter = 0;
   _hashes = {};
-  _useCounts = {};
-  _pipelineCache = {};
+  _renderPipelineCache = {};
+  _computePipelineCache = {};
+  /** Get the singleton default pipeline factory for the specified device */
   static getDefaultPipelineFactory(device) {
     device._lumaData.defaultPipelineFactory = device._lumaData.defaultPipelineFactory || new _PipelineFactory(device);
     return device._lumaData.defaultPipelineFactory;
@@ -826,55 +836,59 @@ var _PipelineFactory = class {
   constructor(device) {
     this.device = device;
   }
-  createRenderPipeline(options) {
-    const props = { ..._PipelineFactory.defaultProps, ...options };
-    const hash = this._hashRenderPipeline({ ...props });
-    if (!this._pipelineCache[hash]) {
+  /** Return a RenderPipeline matching props. Reuses a similar pipeline if already created. */
+  createRenderPipeline(props) {
+    const allProps = { ...import_core6.RenderPipeline.defaultProps, ...props };
+    const hash = this._hashRenderPipeline(allProps);
+    if (!this._renderPipelineCache[hash]) {
       const pipeline = this.device.createRenderPipeline({
-        ...props,
-        vs: this.device.createShader({ stage: "vertex", source: props.vs }),
-        fs: props.fs ? this.device.createShader({ stage: "fragment", source: props.fs }) : null
+        ...allProps,
+        id: allProps.id ? `${allProps.id}-cached` : void 0
+      });
+      pipeline.hash = hash;
+      this._renderPipelineCache[hash] = { pipeline, useCount: 0 };
+    }
+    this._renderPipelineCache[hash].useCount++;
+    return this._renderPipelineCache[hash].pipeline;
+  }
+  createComputePipeline(props) {
+    const allProps = { ...import_core6.ComputePipeline.defaultProps, ...props };
+    const hash = this._hashComputePipeline(allProps);
+    if (!this._computePipelineCache[hash]) {
+      const pipeline = this.device.createComputePipeline({
+        ...allProps,
+        id: allProps.id ? `${allProps.id}-cached` : void 0
       });
       pipeline.hash = hash;
-      this._pipelineCache[hash] = pipeline;
-      this._useCounts[hash] = 0;
+      this._computePipelineCache[hash] = { pipeline, useCount: 0 };
     }
-    this._useCounts[hash]++;
-    return this._pipelineCache[hash];
+    this._computePipelineCache[hash].useCount++;
+    return this._computePipelineCache[hash].pipeline;
   }
   release(pipeline) {
     const hash = pipeline.hash;
-    this._useCounts[hash]--;
-    if (this._useCounts[hash] === 0) {
-      this._pipelineCache[hash].destroy();
-      delete this._pipelineCache[hash];
-      delete this._useCounts[hash];
+    const cache = pipeline instanceof import_core6.ComputePipeline ? this._computePipelineCache : this._renderPipelineCache;
+    cache[hash].useCount--;
+    if (cache[hash].useCount === 0) {
+      cache[hash].pipeline.destroy();
+      delete cache[hash];
     }
   }
   // PRIVATE
-  _createRenderPipeline(props) {
-    if (!props.fs) {
-      throw new Error("fs");
-    }
-    const pipeline = this.device.createRenderPipeline({
-      ...props,
-      vs: this.device.createShader({ stage: "vertex", source: props.vs }),
-      fs: props.fs ? this.device.createShader({ stage: "fragment", source: props.fs }) : null
-    });
-    return pipeline;
+  _hashComputePipeline(props) {
+    const shaderHash = this._getHash(props.shader.source);
+    return `${shaderHash}`;
   }
   /** Calculate a hash based on all the inputs for a render pipeline */
   _hashRenderPipeline(props) {
-    const vsHash = this._getHash(props.vs);
-    const fsHash = props.fs ? this._getHash(props.fs) : 0;
+    const vsHash = this._getHash(props.vs.source);
+    const fsHash = props.fs ? this._getHash(props.fs.source) : 0;
     const varyingHash = "-";
-    switch (this.device.info.type) {
-      case "webgpu":
-        const parameterHash = this._getHash(JSON.stringify(props.parameters));
-        const bufferLayoutHash = this._getHash(JSON.stringify(props.bufferLayout));
-        return `${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${parameterHash}BL${bufferLayoutHash}}`;
+    const bufferLayoutHash = this._getHash(JSON.stringify(props.bufferLayout));
+    switch (this.device.type) {
       default:
-        return `${vsHash}/${fsHash}V${varyingHash}`;
+        const parameterHash = this._getHash(JSON.stringify(props.parameters));
+        return `${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${parameterHash}BL${bufferLayoutHash}`;
     }
   }
   _getHash(key) {
@@ -885,13 +899,57 @@ var _PipelineFactory = class {
   }
 };
 var PipelineFactory = _PipelineFactory;
-__publicField(PipelineFactory, "defaultProps", {
-  ...import_core6.RenderPipeline.defaultProps,
-  vs: void 0,
-  fs: void 0
-});
+__publicField(PipelineFactory, "defaultProps", { ...import_core6.RenderPipeline.defaultProps });
+
+// dist/lib/shader-factory.js
+var import_core7 = require("@luma.gl/core");
+var _ShaderFactory = class {
+  device;
+  _cache = {};
+  /** Returns the default ShaderFactory for the given {@link Device}, creating one if necessary. */
+  static getDefaultShaderFactory(device) {
+    device._lumaData.defaultShaderFactory ||= new _ShaderFactory(device);
+    return device._lumaData.defaultShaderFactory;
+  }
+  /** @internal */
+  constructor(device) {
+    this.device = device;
+  }
+  /** Requests a {@link Shader} from the cache, creating a new Shader only if necessary. */
+  createShader(props) {
+    const key = this._hashShader(props);
+    let cacheEntry = this._cache[key];
+    if (!cacheEntry) {
+      const shader = this.device.createShader({
+        ...props,
+        id: props.id ? `${props.id}-cached` : void 0
+      });
+      this._cache[key] = cacheEntry = { shader, useCount: 0 };
+    }
+    cacheEntry.useCount++;
+    return cacheEntry.shader;
+  }
+  /** Releases a previously-requested {@link Shader}, destroying it if no users remain. */
+  release(shader) {
+    const key = this._hashShader(shader);
+    const cacheEntry = this._cache[key];
+    if (cacheEntry) {
+      cacheEntry.useCount--;
+      if (cacheEntry.useCount === 0) {
+        delete this._cache[key];
+        cacheEntry.shader.destroy();
+      }
+    }
+  }
+  // PRIVATE
+  _hashShader(value) {
+    return `${value.stage}:${value.source}`;
+  }
+};
+var ShaderFactory = _ShaderFactory;
+__publicField(ShaderFactory, "defaultProps", { ...import_core7.Shader.defaultProps });
 
-// src/debug/debug-shader-layout.ts
+// dist/debug/debug-shader-layout.js
 function getDebugTableForShaderLayout(layout, name) {
   var _a;
   const table = {};
@@ -912,7 +970,7 @@ function getDebugTableForShaderLayout(layout, name) {
   return table;
 }
 
-// src/debug/debug-framebuffer.ts
+// dist/debug/debug-framebuffer.js
 var canvas = null;
 var ctx = null;
 function debugFramebuffer(fbo, { id, minimap, opaque, top = "0", left = "0", rgbaScale = 1 }) {
@@ -947,15 +1005,17 @@ function debugFramebuffer(fbo, { id, minimap, opaque, top = "0", left = "0", rgb
   ctx.putImageData(imageData, 0, 0);
 }
 
-// src/model/model.ts
+// dist/model/model.js
 var LOG_DRAW_PRIORITY = 2;
 var LOG_DRAW_TIMEOUT = 1e4;
 var _Model = class {
   device;
   id;
+  source;
   vs;
   fs;
   pipelineFactory;
+  shaderFactory;
   userData = {};
   // Fixed properties (change can trigger pipeline rebuild)
   /** The render pipeline GPU parameters, depth testing etc */
@@ -992,52 +1052,56 @@ var _Model = class {
   /** ShaderInputs instance */
   shaderInputs;
   _uniformStore;
-  _pipelineNeedsUpdate = "newly created";
   _attributeInfos = {};
   _gpuGeometry = null;
   _getModuleUniforms;
   props;
+  _pipelineNeedsUpdate = "newly created";
+  _needsRedraw = "initializing";
+  _destroyed = false;
+  /** "Time" of last draw. Monotonically increasing timestamp */
+  _lastDrawTimestamp = -1;
   constructor(device, props) {
     var _a, _b, _c;
     this.props = { ..._Model.defaultProps, ...props };
     props = this.props;
-    this.id = props.id || (0, import_core8.uid)("model");
+    this.id = props.id || (0, import_core10.uid)("model");
     this.device = device;
     Object.assign(this.userData, props.userData);
-    const moduleMap = Object.fromEntries(
-      ((_a = this.props.modules) == null ? void 0 : _a.map((module2) => [module2.name, module2])) || []
-    );
+    const moduleMap = Object.fromEntries(((_a = this.props.modules) == null ? void 0 : _a.map((module2) => [module2.name, module2])) || []);
     this.setShaderInputs(props.shaderInputs || new ShaderInputs(moduleMap));
-    const isWebGPU = this.device.info.type === "webgpu";
-    if (this.props.source) {
-      if (isWebGPU) {
-        this.props.shaderLayout ||= (0, import_shadertools2.getShaderLayoutFromWGSL)(this.props.source);
-      }
-      this.props.fs = this.props.source;
-      this.props.vs = this.props.source;
-    }
-    if (isWebGPU && typeof this.props.vs !== "string") {
-      this.props.shaderLayout ||= (0, import_shadertools2.getShaderLayoutFromWGSL)(this.props.vs.wgsl);
-    }
     const platformInfo = getPlatformInfo(device);
     const modules = (((_b = this.props.modules) == null ? void 0 : _b.length) > 0 ? this.props.modules : (_c = this.shaderInputs) == null ? void 0 : _c.getModules()) || [];
-    const { vs, fs, getUniforms } = this.props.shaderAssembler.assembleShaders({
-      platformInfo,
-      ...this.props,
-      modules
-    });
-    this.vs = vs;
-    this.fs = fs;
-    this._getModuleUniforms = getUniforms;
+    const isWebGPU = this.device.type === "webgpu";
+    if (isWebGPU && this.props.source) {
+      this.props.shaderLayout ||= (0, import_shadertools2.getShaderLayoutFromWGSL)(this.props.source);
+      const { source, getUniforms } = this.props.shaderAssembler.assembleShader({
+        platformInfo,
+        ...this.props,
+        modules
+      });
+      this.source = source;
+      this._getModuleUniforms = getUniforms;
+    } else {
+      const { vs, fs, getUniforms } = this.props.shaderAssembler.assembleShaderPair({
+        platformInfo,
+        ...this.props,
+        modules
+      });
+      this.vs = vs;
+      this.fs = fs;
+      this._getModuleUniforms = getUniforms;
+    }
     this.vertexCount = this.props.vertexCount;
     this.instanceCount = this.props.instanceCount;
     this.topology = this.props.topology;
     this.bufferLayout = this.props.bufferLayout;
     this.parameters = this.props.parameters;
     if (props.geometry) {
-      this._gpuGeometry = this.setGeometry(props.geometry);
+      this.setGeometry(props.geometry);
     }
     this.pipelineFactory = props.pipelineFactory || PipelineFactory.getDefaultPipelineFactory(this.device);
+    this.shaderFactory = props.shaderFactory || ShaderFactory.getDefaultShaderFactory(this.device);
     this.pipeline = this._updatePipeline();
     this.vertexArray = device.createVertexArray({
       renderPipeline: this.pipeline
@@ -1058,7 +1122,9 @@ var _Model = class {
       this.setIndexBuffer(props.indexBuffer);
     }
     if (props.attributes) {
-      this.setAttributes(props.attributes);
+      this.setAttributes(props.attributes, {
+        ignoreUnknownAttributes: props.ignoreUnknownAttributes
+      });
     }
     if (props.constantAttributes) {
       this.setConstantAttributes(props.constantAttributes);
@@ -1070,7 +1136,7 @@ var _Model = class {
       this.setUniforms(props.uniforms);
     }
     if (props.moduleSettings) {
-      import_core8.log.warn("Model.props.moduleSettings is deprecated. Use Model.shaderInputs.setProps()")();
+      import_core10.log.warn("Model.props.moduleSettings is deprecated. Use Model.shaderInputs.setProps()")();
       this.updateModuleSettings(props.moduleSettings);
     }
     if (props.transformFeedback) {
@@ -1079,31 +1145,67 @@ var _Model = class {
     Object.seal(this);
   }
   destroy() {
+    var _a;
+    if (this._destroyed)
+      return;
     this.pipelineFactory.release(this.pipeline);
+    this.shaderFactory.release(this.pipeline.vs);
+    if (this.pipeline.fs) {
+      this.shaderFactory.release(this.pipeline.fs);
+    }
     this._uniformStore.destroy();
+    (_a = this._gpuGeometry) == null ? void 0 : _a.destroy();
+    this._destroyed = true;
   }
   // Draw call
+  /** Query redraw status. Clears the status. */
+  needsRedraw() {
+    if (this._getBindingsUpdateTimestamp() > this._lastDrawTimestamp) {
+      this.setNeedsRedraw("contents of bound textures or buffers updated");
+    }
+    const needsRedraw = this._needsRedraw;
+    this._needsRedraw = false;
+    return needsRedraw;
+  }
+  /** Mark the model as needing a redraw */
+  setNeedsRedraw(reason) {
+    this._needsRedraw ||= reason;
+  }
   predraw() {
     this.updateShaderInputs();
+    this.pipeline = this._updatePipeline();
   }
   draw(renderPass) {
     this.predraw();
+    let drawSuccess;
     try {
       this._logDrawCallStart();
       this.pipeline = this._updatePipeline();
       this.pipeline.setBindings(this.bindings);
-      this.pipeline.setUniforms(this.uniforms);
-      this.pipeline.draw({
+      if (!(0, import_core10.isObjectEmpty)(this.uniforms)) {
+        this.pipeline.setUniformsWebGL(this.uniforms);
+      }
+      const { indexBuffer } = this.vertexArray;
+      const indexCount = indexBuffer ? indexBuffer.byteLength / (indexBuffer.indexType === "uint32" ? 4 : 2) : void 0;
+      drawSuccess = this.pipeline.draw({
         renderPass,
         vertexArray: this.vertexArray,
         vertexCount: this.vertexCount,
         instanceCount: this.instanceCount,
+        indexCount,
         transformFeedback: this.transformFeedback
       });
     } finally {
       this._logDrawCallEnd();
     }
     this._logFramebuffer(renderPass);
+    if (drawSuccess) {
+      this._lastDrawTimestamp = this.device.timestamp;
+      this._needsRedraw = false;
+    } else {
+      this._needsRedraw = "waiting for resource initialization";
+    }
+    return drawSuccess;
   }
   // Update fixed fields (can trigger pipeline rebuild)
   /**
@@ -1112,30 +1214,17 @@ var _Model = class {
    * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
    */
   setGeometry(geometry) {
+    var _a;
+    (_a = this._gpuGeometry) == null ? void 0 : _a.destroy();
     const gpuGeometry = geometry && makeGPUGeometry(this.device, geometry);
-    this.setTopology(gpuGeometry.topology || "triangle-list");
-    this.bufferLayout = mergeBufferLayouts(this.bufferLayout, gpuGeometry.bufferLayout);
-    if (this.vertexArray) {
-      this._setGeometryAttributes(gpuGeometry);
-    }
-    return gpuGeometry;
-  }
-  /**
-   * Updates the optional geometry attributes
-   * Geometry, sets several attributes, indexBuffer, and also vertex count
-   * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
-   */
-  _setGeometryAttributes(gpuGeometry) {
-    const attributes = { ...gpuGeometry.attributes };
-    for (const [attributeName] of Object.entries(attributes)) {
-      if (!this.pipeline.shaderLayout.attributes.find((layout) => layout.name === attributeName) && attributeName !== "positions") {
-        delete attributes[attributeName];
+    if (gpuGeometry) {
+      this.setTopology(gpuGeometry.topology || "triangle-list");
+      this.bufferLayout = mergeBufferLayouts(gpuGeometry.bufferLayout, this.bufferLayout);
+      if (this.vertexArray) {
+        this._setGeometryAttributes(gpuGeometry);
       }
     }
-    this.vertexCount = gpuGeometry.vertexCount;
-    this.setIndexBuffer(gpuGeometry.indices);
-    this.setAttributes(gpuGeometry.attributes, "ignore-unknown");
-    this.setAttributes(attributes);
+    this._gpuGeometry = gpuGeometry;
   }
   /**
    * Updates the primitive topology ('triangle-list', 'triangle-strip' etc).
@@ -1149,7 +1238,7 @@ var _Model = class {
   }
   /**
    * Updates the buffer layout.
-   * @note Triggers a pipeline rebuild / pipeline cache fetch on WebGPU
+   * @note Triggers a pipeline rebuild / pipeline cache fetch
    */
   setBufferLayout(bufferLayout) {
     this.bufferLayout = this._gpuGeometry ? mergeBufferLayouts(bufferLayout, this._gpuGeometry.bufferLayout) : bufferLayout;
@@ -1168,7 +1257,7 @@ var _Model = class {
    * @param parameters
    */
   setParameters(parameters) {
-    if (!(0, import_core8.deepEqual)(parameters, this.parameters, 2)) {
+    if (!(0, import_core10.deepEqual)(parameters, this.parameters, 2)) {
       this.parameters = parameters;
       this._setPipelineNeedsUpdate("parameters");
     }
@@ -1180,6 +1269,7 @@ var _Model = class {
    */
   setVertexCount(vertexCount) {
     this.vertexCount = vertexCount;
+    this.setNeedsRedraw("vertexCount");
   }
   /**
    * Updates the instance count (used in draw calls)
@@ -1187,57 +1277,34 @@ var _Model = class {
    */
   setInstanceCount(instanceCount) {
     this.instanceCount = instanceCount;
+    this.setNeedsRedraw("instanceCount");
   }
   setShaderInputs(shaderInputs) {
     this.shaderInputs = shaderInputs;
-    this._uniformStore = new import_core7.UniformStore(this.shaderInputs.modules);
+    this._uniformStore = new import_core9.UniformStore(this.shaderInputs.modules);
     for (const moduleName of Object.keys(this.shaderInputs.modules)) {
       const uniformBuffer = this._uniformStore.getManagedUniformBuffer(this.device, moduleName);
       this.bindings[`${moduleName}Uniforms`] = uniformBuffer;
     }
-  }
-  /**
-   * Updates shader module settings (which results in uniforms being set)
-   */
-  setShaderModuleProps(props) {
-    const uniforms = this._getModuleUniforms(props);
-    const keys = Object.keys(uniforms).filter((k) => {
-      const uniform = uniforms[k];
-      return !(0, import_core8.isNumberArray)(uniform) && typeof uniform !== "number" && typeof uniform !== "boolean";
-    });
-    const bindings = {};
-    for (const k of keys) {
-      bindings[k] = uniforms[k];
-      delete uniforms[k];
-    }
+    this.setNeedsRedraw("shaderInputs");
   }
   updateShaderInputs() {
     this._uniformStore.setUniforms(this.shaderInputs.getUniformValues());
-  }
-  /**
-   * @deprecated Updates shader module settings (which results in uniforms being set)
-   */
-  updateModuleSettings(props) {
-    import_core8.log.warn("Model.updateModuleSettings is deprecated. Use Model.shaderInputs.setProps()")();
-    const { bindings, uniforms } = (0, import_core8.splitUniformsAndBindings)(this._getModuleUniforms(props));
-    Object.assign(this.bindings, bindings);
-    Object.assign(this.uniforms, uniforms);
+    this.setNeedsRedraw("shaderInputs");
   }
   /**
    * Sets bindings (textures, samplers, uniform buffers)
    */
   setBindings(bindings) {
     Object.assign(this.bindings, bindings);
+    this.setNeedsRedraw("bindings");
   }
   /**
-   * Sets individual uniforms
-   * @deprecated WebGL only, use uniform buffers for portability
-   * @param uniforms
-   * @returns self for chaining
+   * Updates optional transform feedback. WebGL only.
    */
-  setUniforms(uniforms) {
-    this.pipeline.setUniforms(uniforms);
-    Object.assign(this.uniforms, uniforms);
+  setTransformFeedback(transformFeedback) {
+    this.transformFeedback = transformFeedback;
+    this.setNeedsRedraw("transformFeedback");
   }
   /**
    * Sets the index buffer
@@ -1245,27 +1312,20 @@ var _Model = class {
    */
   setIndexBuffer(indexBuffer) {
     this.vertexArray.setIndexBuffer(indexBuffer);
-  }
-  /**
-   * Updates optional transform feedback. WebGL 2 only.
-   */
-  setTransformFeedback(transformFeedback) {
-    this.transformFeedback = transformFeedback;
+    this.setNeedsRedraw("indexBuffer");
   }
   /**
    * Sets attributes (buffers)
    * @note Overrides any attributes previously set with the same name
    */
-  setAttributes(buffers, _option) {
+  setAttributes(buffers, options) {
     if (buffers.indices) {
-      import_core8.log.warn(
-        `Model:${this.id} setAttributes() - indexBuffer should be set using setIndexBuffer()`
-      )();
+      import_core10.log.warn(`Model:${this.id} setAttributes() - indexBuffer should be set using setIndexBuffer()`)();
     }
     for (const [bufferName, buffer] of Object.entries(buffers)) {
       const bufferLayout = this.bufferLayout.find((layout) => getAttributeNames(layout).includes(bufferName));
       if (!bufferLayout) {
-        import_core8.log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
+        import_core10.log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
         continue;
       }
       const attributeNames = getAttributeNames(bufferLayout);
@@ -1277,12 +1337,11 @@ var _Model = class {
           set = true;
         }
       }
-      if (!set && _option !== "ignore-unknown") {
-        import_core8.log.warn(
-          `Model(${this.id}): Ignoring buffer "${buffer.id}" for unknown attribute "${bufferName}"`
-        )();
+      if (!set && ((options == null ? void 0 : options.ignoreUnknownAttributes) || this.props.ignoreUnknownAttributes)) {
+        import_core10.log.warn(`Model(${this.id}): Ignoring buffer "${buffer.id}" for unknown attribute "${bufferName}"`)();
       }
     }
+    this.setNeedsRedraw("attributes");
   }
   /**
    * Sets constant attributes
@@ -1296,37 +1355,103 @@ var _Model = class {
     for (const [attributeName, value] of Object.entries(attributes)) {
       const attributeInfo = this._attributeInfos[attributeName];
       if (attributeInfo) {
-        this.vertexArray.setConstant(attributeInfo.location, value);
+        this.vertexArray.setConstantWebGL(attributeInfo.location, value);
       } else {
-        import_core8.log.warn(
-          `Model "${this.id}: Ignoring constant supplied for unknown attribute "${attributeName}"`
-        )();
+        import_core10.log.warn(`Model "${this.id}: Ignoring constant supplied for unknown attribute "${attributeName}"`)();
+      }
+    }
+    this.setNeedsRedraw("constants");
+  }
+  // DEPRECATED METHODS
+  /**
+   * Sets individual uniforms
+   * @deprecated WebGL only, use uniform buffers for portability
+   * @param uniforms
+   */
+  setUniforms(uniforms) {
+    if (!(0, import_core10.isObjectEmpty)(uniforms)) {
+      this.pipeline.setUniformsWebGL(uniforms);
+      Object.assign(this.uniforms, uniforms);
+    }
+    this.setNeedsRedraw("uniforms");
+  }
+  /**
+   * @deprecated Updates shader module settings (which results in uniforms being set)
+   */
+  updateModuleSettings(props) {
+    import_core10.log.warn("Model.updateModuleSettings is deprecated. Use Model.shaderInputs.setProps()")();
+    const { bindings, uniforms } = (0, import_core10.splitUniformsAndBindings)(this._getModuleUniforms(props));
+    Object.assign(this.bindings, bindings);
+    Object.assign(this.uniforms, uniforms);
+    this.setNeedsRedraw("moduleSettings");
+  }
+  // Internal methods
+  /** Get the timestamp of the latest updated bound GPU memory resource (buffer/texture). */
+  _getBindingsUpdateTimestamp() {
+    let timestamp = 0;
+    for (const binding of Object.values(this.bindings)) {
+      if (binding instanceof import_core8.TextureView) {
+        timestamp = Math.max(timestamp, binding.texture.updateTimestamp);
+      } else if (binding instanceof import_core8.Buffer || binding instanceof import_core8.Texture) {
+        timestamp = Math.max(timestamp, binding.updateTimestamp);
+      } else if (!(binding instanceof import_core8.Sampler)) {
+        timestamp = Math.max(timestamp, binding.buffer.updateTimestamp);
+      }
+    }
+    return timestamp;
+  }
+  /**
+   * Updates the optional geometry attributes
+   * Geometry, sets several attributes, indexBuffer, and also vertex count
+   * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
+   */
+  _setGeometryAttributes(gpuGeometry) {
+    const attributes = { ...gpuGeometry.attributes };
+    for (const [attributeName] of Object.entries(attributes)) {
+      if (!this.pipeline.shaderLayout.attributes.find((layout) => layout.name === attributeName) && attributeName !== "positions") {
+        delete attributes[attributeName];
       }
     }
+    this.vertexCount = gpuGeometry.vertexCount;
+    this.setIndexBuffer(gpuGeometry.indices);
+    this.setAttributes(gpuGeometry.attributes, { ignoreUnknownAttributes: true });
+    this.setAttributes(attributes, { ignoreUnknownAttributes: this.props.ignoreUnknownAttributes });
+    this.setNeedsRedraw("geometry attributes");
   }
+  /** Mark pipeline as needing update */
   _setPipelineNeedsUpdate(reason) {
-    this._pipelineNeedsUpdate = this._pipelineNeedsUpdate || reason;
+    this._pipelineNeedsUpdate ||= reason;
+    this.setNeedsRedraw(reason);
   }
+  /** Update pipeline if needed */
   _updatePipeline() {
     if (this._pipelineNeedsUpdate) {
+      let prevShaderVs = null;
+      let prevShaderFs = null;
       if (this.pipeline) {
-        import_core8.log.log(
-          1,
-          `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`
-        )();
+        import_core10.log.log(1, `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`)();
+        prevShaderVs = this.pipeline.vs;
+        prevShaderFs = this.pipeline.fs;
       }
       this._pipelineNeedsUpdate = false;
-      const vs = this.device.createShader({
+      const vs = this.shaderFactory.createShader({
         id: `${this.id}-vertex`,
         stage: "vertex",
-        source: this.vs
+        source: this.source || this.vs,
+        debug: this.props.debugShaders
       });
-      const fs = this.fs ? this.device.createShader({
-        id: `${this.id}-fragment`,
-        stage: "fragment",
-        source: this.fs
-      }) : null;
-      this.pipeline = this.device.createRenderPipeline({
+      let fs = null;
+      if (this.source) {
+        fs = vs;
+      } else if (this.fs) {
+        fs = this.shaderFactory.createShader({
+          id: `${this.id}-fragment`,
+          stage: "fragment",
+          source: this.source || this.fs,
+          debug: this.props.debugShaders
+        });
+      }
+      this.pipeline = this.pipelineFactory.createRenderPipeline({
         ...this.props,
         bufferLayout: this.bufferLayout,
         topology: this.topology,
@@ -1334,10 +1459,11 @@ var _Model = class {
         vs,
         fs
       });
-      this._attributeInfos = (0, import_core9.getAttributeInfosFromLayouts)(
-        this.pipeline.shaderLayout,
-        this.bufferLayout
-      );
+      this._attributeInfos = (0, import_core11.getAttributeInfosFromLayouts)(this.pipeline.shaderLayout, this.bufferLayout);
+      if (prevShaderVs)
+        this.shaderFactory.release(prevShaderVs);
+      if (prevShaderFs)
+        this.shaderFactory.release(prevShaderFs);
     }
     return this.pipeline;
   }
@@ -1345,33 +1471,33 @@ var _Model = class {
   _lastLogTime = 0;
   _logOpen = false;
   _logDrawCallStart() {
-    const logDrawTimeout = import_core8.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT;
-    if (import_core8.log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
+    const logDrawTimeout = import_core10.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT;
+    if (import_core10.log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
       return;
     }
     this._lastLogTime = Date.now();
     this._logOpen = true;
-    import_core8.log.group(LOG_DRAW_PRIORITY, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core8.log.level <= 2 })();
+    import_core10.log.group(LOG_DRAW_PRIORITY, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core10.log.level <= 2 })();
   }
   _logDrawCallEnd() {
     if (this._logOpen) {
       const shaderLayoutTable = getDebugTableForShaderLayout(this.pipeline.shaderLayout, this.id);
-      import_core8.log.table(LOG_DRAW_PRIORITY, shaderLayoutTable)();
+      import_core10.log.table(LOG_DRAW_PRIORITY, shaderLayoutTable)();
       const uniformTable = this.shaderInputs.getDebugTable();
       for (const [name, value] of Object.entries(this.uniforms)) {
         uniformTable[name] = { value };
       }
-      import_core8.log.table(LOG_DRAW_PRIORITY, uniformTable)();
+      import_core10.log.table(LOG_DRAW_PRIORITY, uniformTable)();
       const attributeTable = this._getAttributeDebugTable();
-      import_core8.log.table(LOG_DRAW_PRIORITY, this._attributeInfos)();
-      import_core8.log.table(LOG_DRAW_PRIORITY, attributeTable)();
-      import_core8.log.groupEnd(LOG_DRAW_PRIORITY)();
+      import_core10.log.table(LOG_DRAW_PRIORITY, this._attributeInfos)();
+      import_core10.log.table(LOG_DRAW_PRIORITY, attributeTable)();
+      import_core10.log.groupEnd(LOG_DRAW_PRIORITY)();
       this._logOpen = false;
     }
   }
   _drawCount = 0;
   _logFramebuffer(renderPass) {
-    const debugFramebuffers = import_core8.log.get("framebuffer");
+    const debugFramebuffers = import_core10.log.get("framebuffer");
     this._drawCount++;
     if (!debugFramebuffers || this._drawCount++ > 3 && this._drawCount % 60) {
       return;
@@ -1387,10 +1513,7 @@ var _Model = class {
       table[attributeInfo.location] = {
         name,
         type: attributeInfo.shaderType,
-        values: this._getBufferOrConstantValues(
-          this.vertexArray.attributes[attributeInfo.location],
-          attributeInfo.bufferDataType
-        )
+        values: this._getBufferOrConstantValues(this.vertexArray.attributes[attributeInfo.location], attributeInfo.bufferDataType)
       };
     }
     if (this.vertexArray.indexBuffer) {
@@ -1406,14 +1529,14 @@ var _Model = class {
   }
   // TODO - fix typing of luma data types
   _getBufferOrConstantValues(attribute, dataType) {
-    const TypedArrayConstructor = (0, import_core7.getTypedArrayFromDataType)(dataType);
-    const typedArray = attribute instanceof import_core7.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
+    const TypedArrayConstructor = (0, import_core11.getTypedArrayFromDataType)(dataType);
+    const typedArray = attribute instanceof import_core8.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
     return typedArray.toString();
   }
 };
 var Model = _Model;
 __publicField(Model, "defaultProps", {
-  ...import_core7.RenderPipeline.defaultProps,
+  ...import_core9.RenderPipeline.defaultProps,
   source: null,
   vs: null,
   fs: null,
@@ -1430,8 +1553,11 @@ __publicField(Model, "defaultProps", {
   varyings: [],
   shaderInputs: void 0,
   pipelineFactory: void 0,
+  shaderFactory: void 0,
   transformFeedback: void 0,
-  shaderAssembler: import_shadertools2.ShaderAssembler.getDefaultShaderAssembler()
+  shaderAssembler: import_shadertools2.ShaderAssembler.getDefaultShaderAssembler(),
+  debugShaders: void 0,
+  ignoreUnknownAttributes: void 0
 });
 function mergeBufferLayouts(layouts1, layouts2) {
   const layouts = [...layouts1];
@@ -1447,10 +1573,11 @@ function mergeBufferLayouts(layouts1, layouts2) {
 }
 function getPlatformInfo(device) {
   return {
-    type: device.info.type,
+    type: device.type,
     shaderLanguage: device.info.shadingLanguage,
     shaderLanguageVersion: device.info.shadingLanguageVersion,
     gpu: device.info.gpu,
+    // HACK - we pretend that the DeviceFeatures is a Set, it has a similar API
     features: device.features
   };
 }
@@ -1459,8 +1586,8 @@ function getAttributeNames(bufferLayout) {
   return bufferLayout.attributes ? (_a = bufferLayout.attributes) == null ? void 0 : _a.map((layout) => layout.attribute) : [bufferLayout.name];
 }
 
-// src/transform/buffer-transform.ts
-var import_core10 = require("@luma.gl/core");
+// dist/transform/buffer-transform.js
+var import_core12 = require("@luma.gl/core");
 var import_shadertools3 = require("@luma.gl/shadertools");
 var BufferTransform = class {
   device;
@@ -1468,14 +1595,15 @@ var BufferTransform = class {
   transformFeedback;
   /** @deprecated Use device feature test. */
   static isSupported(device) {
-    return device.features.has("transform-feedback-webgl2");
+    var _a;
+    return ((_a = device == null ? void 0 : device.info) == null ? void 0 : _a.type) === "webgl";
   }
   constructor(device, props = Model.defaultProps) {
-    (0, import_core10.assert)(device.features.has("transform-feedback-webgl2"), "Device must support transform feedback");
+    (0, import_core12.assert)(BufferTransform.isSupported(device), "BufferTransform not yet implemented on WebGPU");
     this.device = device;
     this.model = new Model(this.device, {
       id: props.id || "buffer-transform-model",
-      fs: props.fs || (0, import_shadertools3.getPassthroughFS)({ version: 300 }),
+      fs: props.fs || (0, import_shadertools3.getPassthroughFS)(),
       topology: props.topology || "point-list",
       ...props
     });
@@ -1512,7 +1640,7 @@ var BufferTransform = class {
   }
   readAsync(varyingName) {
     const result = this.getBuffer(varyingName);
-    if (result instanceof import_core10.Buffer) {
+    if (result instanceof import_core12.Buffer) {
       return result.readAsync();
     }
     const { buffer, byteOffset = 0, byteLength = buffer.byteLength } = result;
@@ -1520,7 +1648,7 @@ var BufferTransform = class {
   }
 };
 
-// src/transform/texture-transform.ts
+// dist/transform/texture-transform.js
 var import_shadertools4 = require("@luma.gl/shadertools");
 var FS_OUTPUT_VARIABLE = "transform_output";
 var TextureTransform = class {
@@ -1545,7 +1673,6 @@ var TextureTransform = class {
     this.model = new Model(this.device, {
       id: props.id || "texture-transform-model",
       fs: props.fs || (0, import_shadertools4.getPassthroughFS)({
-        version: 300,
         input: props.targetTextureVarying,
         inputChannels: props.targetTextureChannels,
         output: FS_OUTPUT_VARIABLE
@@ -1628,11 +1755,11 @@ var TextureTransform = class {
   }
 };
 
-// src/lib/clip-space.ts
-var import_core12 = require("@luma.gl/core");
+// dist/lib/clip-space.js
+var import_core14 = require("@luma.gl/core");
 
-// src/geometry/geometry.ts
-var import_core11 = require("@luma.gl/core");
+// dist/geometry/geometry.js
+var import_core13 = require("@luma.gl/core");
 var Geometry = class {
   id;
   /** Determines how vertices are read from the 'vertex' attributes */
@@ -1643,7 +1770,7 @@ var Geometry = class {
   userData = {};
   constructor(props) {
     const { attributes = {}, indices = null, vertexCount = null } = props;
-    this.id = props.id || (0, import_core11.uid)("geometry");
+    this.id = props.id || (0, import_core13.uid)("geometry");
     this.topology = props.topology;
     if (indices) {
       this.indices = ArrayBuffer.isView(indices) ? { value: indices, size: 1 } : indices;
@@ -1651,15 +1778,12 @@ var Geometry = class {
     this.attributes = {};
     for (const [attributeName, attributeValue] of Object.entries(attributes)) {
       const attribute = ArrayBuffer.isView(attributeValue) ? { value: attributeValue } : attributeValue;
-      (0, import_core11.assert)(
-        ArrayBuffer.isView(attribute.value),
-        `${this._print(attributeName)}: must be typed array or object with value as typed array`
-      );
+      (0, import_core13.assert)(ArrayBuffer.isView(attribute.value), `${this._print(attributeName)}: must be typed array or object with value as typed array`);
       if ((attributeName === "POSITION" || attributeName === "positions") && !attribute.size) {
         attribute.size = 3;
       }
       if (attributeName === "indices") {
-        (0, import_core11.assert)(!this.indices);
+        (0, import_core13.assert)(!this.indices);
         this.indices = attribute;
       } else {
         this.attributes[attributeName] = attribute;
@@ -1674,7 +1798,7 @@ var Geometry = class {
   getVertexCount() {
     return this.vertexCount;
   }
-  /** 
+  /**
    * Return an object with all attributes plus indices added as a field.
    * TODO Geometry types are a mess
    */
@@ -1691,10 +1815,10 @@ var Geometry = class {
    * type: indices, vertices, uvs
    * size: elements per vertex
    * target: WebGL buffer type (string or constant)
-   * 
-   * @param attributes 
-   * @param indices 
-   * @returns 
+   *
+   * @param attributes
+   * @param indices
+   * @returns
    */
   _setAttributes(attributes, indices) {
     return this;
@@ -1710,67 +1834,62 @@ var Geometry = class {
         vertexCount = Math.min(vertexCount, value.length / size);
       }
     }
-    (0, import_core11.assert)(Number.isFinite(vertexCount));
+    (0, import_core13.assert)(Number.isFinite(vertexCount));
     return vertexCount;
   }
 };
 
-// src/lib/clip-space.ts
-var CLIPSPACE_VERTEX_SHADER = import_core12.glsl`\
+// dist/lib/clip-space.js
+var CLIPSPACE_VERTEX_SHADER = `#version 300 es
 in vec2 aClipSpacePosition;
 in vec2 aTexCoord;
 in vec2 aCoordinate;
-
 out vec2 position;
 out vec2 coordinate;
 out vec2 uv;
-
 void main(void) {
-  gl_Position = vec4(aClipSpacePosition, 0., 1.);
-  position = aClipSpacePosition;
-  coordinate = aCoordinate;
-  uv = aTexCoord;
+gl_Position = vec4(aClipSpacePosition, 0., 1.);
+position = aClipSpacePosition;
+coordinate = aCoordinate;
+uv = aTexCoord;
 }
 `;
 var POSITIONS = [-1, -1, 1, -1, -1, 1, 1, 1];
 var ClipSpace = class extends Model {
   constructor(device, opts) {
     const TEX_COORDS = POSITIONS.map((coord) => coord === -1 ? 0 : coord);
-    super(
-      device,
-      {
-        ...opts,
-        vs: CLIPSPACE_VERTEX_SHADER,
+    super(device, {
+      ...opts,
+      vs: CLIPSPACE_VERTEX_SHADER,
+      vertexCount: 4,
+      geometry: new Geometry({
+        topology: "triangle-strip",
         vertexCount: 4,
-        geometry: new Geometry({
-          topology: "triangle-strip",
-          vertexCount: 4,
-          attributes: {
-            aClipSpacePosition: { size: 2, value: new Float32Array(POSITIONS) },
-            aTexCoord: { size: 2, value: new Float32Array(TEX_COORDS) },
-            aCoordinate: { size: 2, value: new Float32Array(TEX_COORDS) }
-          }
-        })
-      }
-    );
+        attributes: {
+          aClipSpacePosition: { size: 2, value: new Float32Array(POSITIONS) },
+          aTexCoord: { size: 2, value: new Float32Array(TEX_COORDS) },
+          aCoordinate: { size: 2, value: new Float32Array(TEX_COORDS) }
+        }
+      })
+    });
   }
 };
 
-// src/scenegraph/scenegraph-node.ts
-var import_core13 = require("@luma.gl/core");
-var import_core14 = require("@math.gl/core");
+// dist/scenegraph/scenegraph-node.js
+var import_core15 = require("@luma.gl/core");
+var import_core16 = require("@math.gl/core");
 var ScenegraphNode = class {
   id;
-  matrix = new import_core14.Matrix4();
+  matrix = new import_core16.Matrix4();
   display = true;
-  position = new import_core14.Vector3();
-  rotation = new import_core14.Vector3();
-  scale = new import_core14.Vector3(1, 1, 1);
+  position = new import_core16.Vector3();
+  rotation = new import_core16.Vector3();
+  scale = new import_core16.Vector3(1, 1, 1);
   userData = {};
   props = {};
   constructor(props = {}) {
     const { id } = props;
-    this.id = id || (0, import_core13.uid)(this.constructor.name);
+    this.id = id || (0, import_core15.uid)(this.constructor.name);
     this._setScenegraphNodeProps(props);
   }
   getBounds() {
@@ -1790,17 +1909,17 @@ var ScenegraphNode = class {
     return `{type: ScenegraphNode, id: ${this.id})}`;
   }
   setPosition(position) {
-    (0, import_core13.assert)(position.length === 3, "setPosition requires vector argument");
+    (0, import_core15.assert)(position.length === 3, "setPosition requires vector argument");
     this.position = position;
     return this;
   }
   setRotation(rotation) {
-    (0, import_core13.assert)(rotation.length === 3, "setRotation requires vector argument");
+    (0, import_core15.assert)(rotation.length === 3, "setRotation requires vector argument");
     this.rotation = rotation;
     return this;
   }
   setScale(scale) {
-    (0, import_core13.assert)(scale.length === 3, "setScale requires vector argument");
+    (0, import_core15.assert)(scale.length === 3, "setScale requires vector argument");
     this.scale = scale;
     return this;
   }
@@ -1852,9 +1971,9 @@ var ScenegraphNode = class {
     return this;
   }
   getCoordinateUniforms(viewMatrix, modelMatrix) {
-    (0, import_core13.assert)(viewMatrix);
+    (0, import_core15.assert)(viewMatrix);
     modelMatrix = modelMatrix || this.matrix;
-    const worldMatrix = new import_core14.Matrix4(viewMatrix).multiplyRight(modelMatrix);
+    const worldMatrix = new import_core16.Matrix4(viewMatrix).multiplyRight(modelMatrix);
     const worldInverse = worldMatrix.invert();
     const worldInverseTranspose = worldInverse.transpose();
     return {
@@ -1908,39 +2027,35 @@ var ScenegraphNode = class {
   }
 };
 
-// src/scenegraph/group-node.ts
-var import_core15 = require("@math.gl/core");
-var import_core16 = require("@luma.gl/core");
+// dist/scenegraph/group-node.js
+var import_core17 = require("@math.gl/core");
+var import_core18 = require("@luma.gl/core");
 var GroupNode = class extends ScenegraphNode {
   children;
   constructor(props = {}) {
     props = Array.isArray(props) ? { children: props } : props;
     const { children = [] } = props;
-    import_core16.log.assert(
-      children.every((child) => child instanceof ScenegraphNode),
-      "every child must an instance of ScenegraphNode"
-    );
+    import_core18.log.assert(children.every((child) => child instanceof ScenegraphNode), "every child must an instance of ScenegraphNode");
     super(props);
     this.children = children;
   }
   getBounds() {
-    const result = [[Infinity, Infinity, Infinity], [-Infinity, -Infinity, -Infinity]];
+    const result = [
+      [Infinity, Infinity, Infinity],
+      [-Infinity, -Infinity, -Infinity]
+    ];
     this.traverse((node, { worldMatrix }) => {
       const bounds = node.getBounds();
       if (!bounds) {
         return;
       }
       const [min, max] = bounds;
-      const center = new import_core15.Vector3(min).add(max).divide([2, 2, 2]);
+      const center = new import_core17.Vector3(min).add(max).divide([2, 2, 2]);
       worldMatrix.transformAsPoint(center, center);
-      const halfSize = new import_core15.Vector3(max).subtract(min).divide([2, 2, 2]);
+      const halfSize = new import_core17.Vector3(max).subtract(min).divide([2, 2, 2]);
       worldMatrix.transformAsVector(halfSize, halfSize);
       for (let v = 0; v < 8; v++) {
-        const position = new import_core15.Vector3(
-          v & 1 ? -1 : 1,
-          v & 2 ? -1 : 1,
-          v & 4 ? -1 : 1
-        ).multiply(halfSize).add(center);
+        const position = new import_core17.Vector3(v & 1 ? -1 : 1, v & 2 ? -1 : 1, v & 4 ? -1 : 1).multiply(halfSize).add(center);
         for (let i = 0; i < 3; i++) {
           result[0][i] = Math.min(result[0][i], position[i]);
           result[1][i] = Math.max(result[1][i], position[i]);
@@ -1980,8 +2095,8 @@ var GroupNode = class extends ScenegraphNode {
     this.children = [];
     return this;
   }
-  traverse(visitor, { worldMatrix = new import_core15.Matrix4() } = {}) {
-    const modelMatrix = new import_core15.Matrix4(worldMatrix).multiplyRight(this.matrix);
+  traverse(visitor, { worldMatrix = new import_core17.Matrix4() } = {}) {
+    const modelMatrix = new import_core17.Matrix4(worldMatrix).multiplyRight(this.matrix);
     for (const child of this.children) {
       if (child instanceof GroupNode) {
         child.traverse(visitor, { worldMatrix: modelMatrix });
@@ -1992,7 +2107,7 @@ var GroupNode = class extends ScenegraphNode {
   }
 };
 
-// src/scenegraph/model-node.ts
+// dist/scenegraph/model-node.js
 var ModelNode = class extends ScenegraphNode {
   model;
   bounds = null;
@@ -2025,11 +2140,11 @@ var ModelNode = class extends ScenegraphNode {
   }
 };
 
-// src/geometries/cone-geometry.ts
-var import_core18 = require("@luma.gl/core");
+// dist/geometries/cone-geometry.js
+var import_core20 = require("@luma.gl/core");
 
-// src/geometries/truncated-cone-geometry.ts
-var import_core17 = require("@luma.gl/core");
+// dist/geometries/truncated-cone-geometry.js
+var import_core19 = require("@luma.gl/core");
 var INDEX_OFFSETS = {
   x: [2, 0, 1],
   y: [0, 1, 2],
@@ -2037,7 +2152,7 @@ var INDEX_OFFSETS = {
 };
 var TruncatedConeGeometry = class extends Geometry {
   constructor(props = {}) {
-    const { id = (0, import_core17.uid)("truncated-code-geometry") } = props;
+    const { id = (0, import_core19.uid)("truncated-code-geometry") } = props;
     const { indices, attributes } = tesselateTruncatedCone(props);
     super({
       ...props,
@@ -2054,16 +2169,7 @@ var TruncatedConeGeometry = class extends Geometry {
   }
 };
 function tesselateTruncatedCone(props = {}) {
-  const {
-    bottomRadius = 0,
-    topRadius = 0,
-    height = 1,
-    nradial = 10,
-    nvertical = 10,
-    verticalAxis = "y",
-    topCap = false,
-    bottomCap = false
-  } = props;
+  const { bottomRadius = 0, topRadius = 0, height = 1, nradial = 10, nvertical = 10, verticalAxis = "y", topCap = false, bottomCap = false } = props;
   const extra = (topCap ? 2 : 0) + (bottomCap ? 2 : 0);
   const numVertices = (nradial + 1) * (nvertical + 1 + extra);
   const slant = Math.atan2(bottomRadius - topRadius, height);
@@ -2138,10 +2244,10 @@ function tesselateTruncatedCone(props = {}) {
   };
 }
 
-// src/geometries/cone-geometry.ts
+// dist/geometries/cone-geometry.js
 var ConeGeometry = class extends TruncatedConeGeometry {
   constructor(props = {}) {
-    const { id = (0, import_core18.uid)("cone-geometry"), radius = 1, cap = true } = props;
+    const { id = (0, import_core20.uid)("cone-geometry"), radius = 1, cap = true } = props;
     super({
       ...props,
       id,
@@ -2153,11 +2259,11 @@ var ConeGeometry = class extends TruncatedConeGeometry {
   }
 };
 
-// src/geometries/cube-geometry.ts
-var import_core19 = require("@luma.gl/core");
+// dist/geometries/cube-geometry.js
+var import_core21 = require("@luma.gl/core");
 var CubeGeometry = class extends Geometry {
   constructor(props = {}) {
-    const { id = (0, import_core19.uid)("cube-geometry"), indices = true } = props;
+    const { id = (0, import_core21.uid)("cube-geometry"), indices = true } = props;
     super(indices ? {
       ...props,
       id,
@@ -2763,11 +2869,11 @@ var NON_INDEXED_ATTRIBUTES = {
   COLOR_0: { size: 3, value: CUBE_NON_INDEXED_COLORS }
 };
 
-// src/geometries/cylinder-geometry.ts
-var import_core20 = require("@luma.gl/core");
+// dist/geometries/cylinder-geometry.js
+var import_core22 = require("@luma.gl/core");
 var CylinderGeometry = class extends TruncatedConeGeometry {
   constructor(props = {}) {
-    const { id = (0, import_core20.uid)("cylinder-geometry"), radius = 1 } = props;
+    const { id = (0, import_core22.uid)("cylinder-geometry"), radius = 1 } = props;
     super({
       ...props,
       id,
@@ -2777,14 +2883,14 @@ var CylinderGeometry = class extends TruncatedConeGeometry {
   }
 };
 
-// src/geometries/ico-sphere-geometry.ts
-var import_core21 = require("@luma.gl/core");
-var import_core22 = require("@math.gl/core");
+// dist/geometries/ico-sphere-geometry.js
+var import_core23 = require("@luma.gl/core");
+var import_core24 = require("@math.gl/core");
 var ICO_POSITIONS = [-1, 0, 0, 0, 1, 0, 0, 0, -1, 0, 0, 1, 0, -1, 0, 1, 0, 0];
 var ICO_INDICES = [3, 4, 5, 3, 5, 1, 3, 1, 0, 3, 0, 4, 4, 0, 2, 4, 2, 5, 2, 0, 1, 5, 2, 1];
 var IcoSphereGeometry = class extends Geometry {
   constructor(props = {}) {
-    const { id = (0, import_core21.uid)("ico-sphere-geometry") } = props;
+    const { id = (0, import_core23.uid)("ico-sphere-geometry") } = props;
     const { indices, attributes } = tesselateIcosaHedron(props);
     super({
       ...props,
@@ -2877,7 +2983,7 @@ function tesselateIcosaHedron(props) {
     const u3 = 1 - phi3 / PI2;
     const vec1 = [x3 - x2, y3 - y2, z3 - z2];
     const vec2 = [x1 - x2, y1 - y2, z1 - z2];
-    const normal = new import_core22.Vector3(vec1).cross(vec2).normalize();
+    const normal = new import_core24.Vector3(vec1).cross(vec2).normalize();
     let newIndex;
     if ((u1 === 0 || u2 === 0 || u3 === 0) && (u1 === 0 || u1 > 0.5) && (u2 === 0 || u2 > 0.5) && (u3 === 0 || u3 > 0.5)) {
       positions.push(positions[in1 + 0], positions[in1 + 1], positions[in1 + 2]);
@@ -2925,10 +3031,10 @@ function tesselateIcosaHedron(props) {
   };
 }
 
-// src/geometries/plane-geometry.ts
-var import_core23 = require("@luma.gl/core");
+// dist/geometries/plane-geometry.js
+var import_core25 = require("@luma.gl/core");
 
-// src/geometry/geometry-utils.ts
+// dist/geometry/geometry-utils.js
 function unpackIndexedGeometry(geometry) {
   const { indices, attributes } = geometry;
   if (!indices) {
@@ -2956,10 +3062,10 @@ function unpackIndexedGeometry(geometry) {
   };
 }
 
-// src/geometries/plane-geometry.ts
+// dist/geometries/plane-geometry.js
 var PlaneGeometry = class extends Geometry {
   constructor(props = {}) {
-    const { id = (0, import_core23.uid)("plane-geometry") } = props;
+    const { id = (0, import_core25.uid)("plane-geometry") } = props;
     const { indices, attributes } = tesselatePlane(props);
     super({
       ...props,
@@ -3048,11 +3154,11 @@ function tesselatePlane(props) {
   return unpack ? unpackIndexedGeometry(geometry) : geometry;
 }
 
-// src/geometries/sphere-geometry.ts
-var import_core24 = require("@luma.gl/core");
+// dist/geometries/sphere-geometry.js
+var import_core26 = require("@luma.gl/core");
 var SphereGeometry = class extends Geometry {
   constructor(props = {}) {
-    const { id = (0, import_core24.uid)("sphere-geometry") } = props;
+    const { id = (0, import_core26.uid)("sphere-geometry") } = props;
     const { indices, attributes } = tesselateSphere(props);
     super({
       ...props,
@@ -3126,3 +3232,213 @@ function tesselateSphere(props) {
     }
   };
 }
+
+// dist/computation.js
+var import_core27 = require("@luma.gl/core");
+var import_core28 = require("@luma.gl/core");
+var import_core29 = require("@luma.gl/core");
+var import_shadertools5 = require("@luma.gl/shadertools");
+var LOG_DRAW_PRIORITY2 = 2;
+var LOG_DRAW_TIMEOUT2 = 1e4;
+var _Computation = class {
+  device;
+  id;
+  pipelineFactory;
+  shaderFactory;
+  userData = {};
+  /** Bindings (textures, samplers, uniform buffers) */
+  bindings = {};
+  /** The underlying GPU "program". @note May be recreated if parameters change */
+  pipeline;
+  /** the underlying compiled compute shader */
+  shader;
+  source;
+  /** ShaderInputs instance */
+  shaderInputs;
+  _uniformStore;
+  _pipelineNeedsUpdate = "newly created";
+  _getModuleUniforms;
+  props;
+  _destroyed = false;
+  constructor(device, props) {
+    var _a, _b, _c;
+    if (device.type !== "webgpu") {
+      throw new Error("Computation is only supported in WebGPU");
+    }
+    this.props = { ..._Computation.defaultProps, ...props };
+    props = this.props;
+    this.id = props.id || (0, import_core28.uid)("model");
+    this.device = device;
+    Object.assign(this.userData, props.userData);
+    const moduleMap = Object.fromEntries(((_a = this.props.modules) == null ? void 0 : _a.map((module2) => [module2.name, module2])) || []);
+    this.setShaderInputs(props.shaderInputs || new ShaderInputs(moduleMap));
+    this.props.shaderLayout ||= (0, import_shadertools5.getShaderLayoutFromWGSL)(this.props.source);
+    const platformInfo = getPlatformInfo2(device);
+    const modules = (((_b = this.props.modules) == null ? void 0 : _b.length) > 0 ? this.props.modules : (_c = this.shaderInputs) == null ? void 0 : _c.getModules()) || [];
+    this.pipelineFactory = props.pipelineFactory || PipelineFactory.getDefaultPipelineFactory(this.device);
+    this.shaderFactory = props.shaderFactory || ShaderFactory.getDefaultShaderFactory(this.device);
+    const { source, getUniforms } = this.props.shaderAssembler.assembleShader({
+      platformInfo,
+      ...this.props,
+      modules
+    });
+    this.source = source;
+    this._getModuleUniforms = getUniforms;
+    this.pipeline = this._updatePipeline();
+    if (props.bindings) {
+      this.setBindings(props.bindings);
+    }
+    Object.seal(this);
+  }
+  destroy() {
+    if (this._destroyed)
+      return;
+    this.pipelineFactory.release(this.pipeline);
+    this.shaderFactory.release(this.shader);
+    this._uniformStore.destroy();
+    this._destroyed = true;
+  }
+  // Draw call
+  predraw() {
+    this.updateShaderInputs();
+  }
+  dispatch(computePass, x, y, z) {
+    try {
+      this._logDrawCallStart();
+      this.pipeline = this._updatePipeline();
+      this.pipeline.setBindings(this.bindings);
+      computePass.setPipeline(this.pipeline);
+      computePass.setBindings([]);
+      computePass.dispatch(x, y, z);
+    } finally {
+      this._logDrawCallEnd();
+    }
+  }
+  // Update fixed fields (can trigger pipeline rebuild)
+  // Update dynamic fields
+  /**
+   * Updates the vertex count (used in draw calls)
+   * @note Any attributes with stepMode=vertex need to be at least this big
+   */
+  setVertexCount(vertexCount) {
+  }
+  /**
+   * Updates the instance count (used in draw calls)
+   * @note Any attributes with stepMode=instance need to be at least this big
+   */
+  setInstanceCount(instanceCount) {
+  }
+  setShaderInputs(shaderInputs) {
+    this.shaderInputs = shaderInputs;
+    this._uniformStore = new import_core27.UniformStore(this.shaderInputs.modules);
+    for (const moduleName of Object.keys(this.shaderInputs.modules)) {
+      const uniformBuffer = this._uniformStore.getManagedUniformBuffer(this.device, moduleName);
+      this.bindings[`${moduleName}Uniforms`] = uniformBuffer;
+    }
+  }
+  /**
+   * Updates shader module settings (which results in uniforms being set)
+   */
+  setShaderModuleProps(props) {
+    const uniforms = this._getModuleUniforms(props);
+    const keys = Object.keys(uniforms).filter((k) => {
+      const uniform = uniforms[k];
+      return !(0, import_core28.isNumberArray)(uniform) && typeof uniform !== "number" && typeof uniform !== "boolean";
+    });
+    const bindings = {};
+    for (const k of keys) {
+      bindings[k] = uniforms[k];
+      delete uniforms[k];
+    }
+  }
+  updateShaderInputs() {
+    this._uniformStore.setUniforms(this.shaderInputs.getUniformValues());
+  }
+  /**
+   * Sets bindings (textures, samplers, uniform buffers)
+   */
+  setBindings(bindings) {
+    Object.assign(this.bindings, bindings);
+  }
+  _setPipelineNeedsUpdate(reason) {
+    this._pipelineNeedsUpdate = this._pipelineNeedsUpdate || reason;
+  }
+  _updatePipeline() {
+    if (this._pipelineNeedsUpdate) {
+      let prevShader = null;
+      if (this.pipeline) {
+        import_core28.log.log(1, `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`)();
+        prevShader = this.shader;
+      }
+      this._pipelineNeedsUpdate = false;
+      this.shader = this.shaderFactory.createShader({
+        id: `${this.id}-fragment`,
+        stage: "compute",
+        source: this.source,
+        debug: this.props.debugShaders
+      });
+      this.pipeline = this.pipelineFactory.createComputePipeline({
+        ...this.props,
+        shader: this.shader
+      });
+      if (prevShader) {
+        this.shaderFactory.release(prevShader);
+      }
+    }
+    return this.pipeline;
+  }
+  /** Throttle draw call logging */
+  _lastLogTime = 0;
+  _logOpen = false;
+  _logDrawCallStart() {
+    const logDrawTimeout = import_core28.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT2;
+    if (import_core28.log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
+      return;
+    }
+    this._lastLogTime = Date.now();
+    this._logOpen = true;
+    import_core28.log.group(LOG_DRAW_PRIORITY2, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core28.log.level <= 2 })();
+  }
+  _logDrawCallEnd() {
+    if (this._logOpen) {
+      const uniformTable = this.shaderInputs.getDebugTable();
+      import_core28.log.table(LOG_DRAW_PRIORITY2, uniformTable)();
+      import_core28.log.groupEnd(LOG_DRAW_PRIORITY2)();
+      this._logOpen = false;
+    }
+  }
+  _drawCount = 0;
+  // TODO - fix typing of luma data types
+  _getBufferOrConstantValues(attribute, dataType) {
+    const TypedArrayConstructor = (0, import_core29.getTypedArrayFromDataType)(dataType);
+    const typedArray = attribute instanceof import_core27.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
+    return typedArray.toString();
+  }
+};
+var Computation = _Computation;
+__publicField(Computation, "defaultProps", {
+  ...import_core27.ComputePipeline.defaultProps,
+  id: "unnamed",
+  handle: void 0,
+  userData: {},
+  source: "",
+  modules: [],
+  defines: {},
+  bindings: void 0,
+  shaderInputs: void 0,
+  pipelineFactory: void 0,
+  shaderFactory: void 0,
+  shaderAssembler: import_shadertools5.ShaderAssembler.getDefaultShaderAssembler(),
+  debugShaders: void 0
+});
+function getPlatformInfo2(device) {
+  return {
+    type: device.type,
+    shaderLanguage: device.info.shadingLanguage,
+    shaderLanguageVersion: device.info.shadingLanguageVersion,
+    gpu: device.info.gpu,
+    // HACK - we pretend that the DeviceFeatures is a Set, it has a similar API
+    features: device.features
+  };
+}
+//# sourceMappingURL=index.cjs.map