@luma.gl/engine 9.0.0-beta.5 → 9.0.0-beta.7

package/dist/dist.dev.js

@@ -63,6 +63,7 @@ var __exports__ = (() => {
     AnimationLoopTemplate: () => AnimationLoopTemplate,
     BufferTransform: () => BufferTransform,
     ClipSpace: () => ClipSpace,
+    Computation: () => Computation,
     ConeGeometry: () => ConeGeometry,
     CubeGeometry: () => CubeGeometry,
     CylinderGeometry: () => CylinderGeometry,
@@ -76,6 +77,7 @@ var __exports__ = (() => {
     PipelineFactory: () => PipelineFactory,
     PlaneGeometry: () => PlaneGeometry,
     ScenegraphNode: () => ScenegraphNode,
+    ShaderFactory: () => ShaderFactory,
     SphereGeometry: () => SphereGeometry,
     TextureTransform: () => TextureTransform,
     Timeline: () => Timeline,
@@ -276,8 +278,6 @@ var __exports__ = (() => {
   // ../../node_modules/@probe.gl/stats/dist/lib/stat.js
   var Stat = class {
     constructor(name, type) {
-      this.name = void 0;
-      this.type = void 0;
       this.sampleSize = 1;
       this.time = 0;
       this.count = 0;
@@ -312,26 +312,31 @@ var __exports__ = (() => {
       this.sampleSize = samples;
       return this;
     }
+    /** Call to increment count (+1) */
     incrementCount() {
       this.addCount(1);
       return this;
     }
+    /** Call to decrement count (-1) */
     decrementCount() {
       this.subtractCount(1);
       return this;
     }
+    /** Increase count */
     addCount(value) {
       this._count += value;
       this._samples++;
       this._checkSampling();
       return this;
     }
+    /** Decrease count */
     subtractCount(value) {
       this._count -= value;
       this._samples++;
       this._checkSampling();
       return this;
     }
+    /** Add an arbitrary timing and bump the count */
     addTime(time) {
       this._time += time;
       this.lastTiming = time;
@@ -339,11 +344,13 @@ var __exports__ = (() => {
       this._checkSampling();
       return this;
     }
+    /** Start a timer */
     timeStart() {
       this._startTime = getHiResTimestamp();
       this._timerPending = true;
       return this;
     }
+    /** End a timer. Adds to time and bumps the timing count. */
     timeEnd() {
       if (!this._timerPending) {
         return this;
@@ -356,18 +363,22 @@ var __exports__ = (() => {
     getSampleAverageCount() {
       return this.sampleSize > 0 ? this.lastSampleCount / this.sampleSize : 0;
     }
+    /** Calculate average time / count for the previous window */
     getSampleAverageTime() {
       return this.sampleSize > 0 ? this.lastSampleTime / this.sampleSize : 0;
     }
+    /** Calculate counts per second for the previous window */
     getSampleHz() {
       return this.lastSampleTime > 0 ? this.sampleSize / (this.lastSampleTime / 1e3) : 0;
     }
     getAverageCount() {
       return this.samples > 0 ? this.count / this.samples : 0;
     }
+    /** Calculate average time / count */
     getAverageTime() {
       return this.samples > 0 ? this.time / this.samples : 0;
     }
+    /** Calculate counts per second */
     getHz() {
       return this.time > 0 ? this.samples / (this.time / 1e3) : 0;
     }
@@ -388,23 +399,20 @@ var __exports__ = (() => {
   // ../../node_modules/@probe.gl/stats/dist/lib/stats.js
   var Stats = class {
     constructor(options) {
-      this.id = void 0;
       this.stats = {};
       this.id = options.id;
       this.stats = {};
       this._initializeStats(options.stats);
       Object.seal(this);
     }
-    get(name) {
-      let type = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "count";
-      return this._getOrCreate({
-        name,
-        type
-      });
+    /** Acquire a stat. Create if it doesn't exist. */
+    get(name, type = "count") {
+      return this._getOrCreate({ name, type });
     }
     get size() {
       return Object.keys(this.stats).length;
     }
+    /** Reset all stats */
     reset() {
       for (const stat of Object.values(this.stats)) {
         stat.reset();
@@ -428,15 +436,11 @@ var __exports__ = (() => {
       });
       return table;
     }
-    _initializeStats() {
-      let stats = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+    _initializeStats(stats = []) {
       stats.forEach((stat) => this._getOrCreate(stat));
     }
     _getOrCreate(stat) {
-      const {
-        name,
-        type
-      } = stat;
+      const { name, type } = stat;
       let result = this.stats[name];
       if (!result) {
         if (stat instanceof Stat) {
@@ -785,7 +789,14 @@ var __exports__ = (() => {
     /** 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
+        );
       }
     }
     /**
@@ -844,101 +855,14 @@ var __exports__ = (() => {
   }
 
   // src/model/model.ts
-  var import_core7 = __toESM(require_core(), 1);
   var import_core8 = __toESM(require_core(), 1);
   var import_core9 = __toESM(require_core(), 1);
+  var import_core10 = __toESM(require_core(), 1);
+  var import_core11 = __toESM(require_core(), 1);
   var import_shadertools2 = __toESM(require_shadertools(), 1);
 
-  // src/shader-inputs.ts
-  var import_core4 = __toESM(require_core(), 1);
-  var import_shadertools = __toESM(require_shadertools(), 1);
-  var ShaderInputs = class {
-    /** 
-     * The map of modules 
-     * @todo should should this include the resolved dependencies?
-     */
-    modules;
-    /** Stores the uniform values for each module */
-    moduleUniforms;
-    /** Stores the uniform bindings for each module  */
-    moduleBindings;
-    /** Tracks if uniforms have changed */
-    moduleUniformsChanged;
-    /**
-     * Create a new UniformStore instance
-     * @param modules
-     */
-    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))();
-      this.modules = modules;
-      this.moduleUniforms = {};
-      this.moduleBindings = {};
-      for (const [name, module] of Object.entries(modules)) {
-        const moduleName = name;
-        this.moduleUniforms[moduleName] = module.defaultUniforms || {};
-        this.moduleBindings[moduleName] = {};
-      }
-    }
-    /** Destroy */
-    destroy() {
-    }
-    /**
-     * Set module props
-     */
-    setProps(props) {
-      for (const name of Object.keys(props)) {
-        const moduleName = name;
-        const moduleProps = props[moduleName];
-        const module = this.modules[moduleName];
-        if (!module) {
-          import_core4.log.warn(`Module ${name} not found`)();
-          continue;
-        }
-        const oldUniforms = this.moduleUniforms[moduleName];
-        const uniforms = module.getUniforms?.(moduleProps, this.moduleUniforms[moduleName]) || moduleProps;
-        this.moduleUniforms[moduleName] = { ...oldUniforms, ...uniforms };
-      }
-    }
-    /** Merges all bindings for the shader (from the various modules) */
-    // getUniformBlocks(): Record<string, Texture | Sampler> {
-    //   return this.moduleUniforms;
-    // }
-    /** 
-     * Return the map of modules 
-     * @todo should should this include the resolved dependencies?
-     */
-    getModules() {
-      return Object.values(this.modules);
-    }
-    /** Get all uniform values for all modules */
-    getUniformValues() {
-      return this.moduleUniforms;
-    }
-    /** Merges all bindings for the shader (from the various modules) */
-    getBindings() {
-      const bindings = {};
-      for (const moduleBindings of Object.values(this.moduleBindings)) {
-        Object.assign(bindings, moduleBindings);
-      }
-      return bindings;
-    }
-    getDebugTable() {
-      const table = {};
-      for (const [moduleName, module] of Object.entries(this.moduleUniforms)) {
-        for (const [key, value] of Object.entries(module)) {
-          table[`${moduleName}.${key}`] = {
-            type: this.modules[moduleName].uniformTypes?.[key],
-            value: String(value)
-          };
-        }
-      }
-      return table;
-    }
-  };
-
   // src/geometry/gpu-geometry.ts
-  var import_core5 = __toESM(require_core(), 1);
+  var import_core4 = __toESM(require_core(), 1);
   var GPUGeometry = class {
     id;
     userData = {};
@@ -949,22 +873,21 @@ var __exports__ = (() => {
     indices;
     attributes;
     constructor(props) {
-      this.id = props.id || (0, import_core5.uid)("geometry");
+      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_core5.assert)(this.indices.usage === import_core5.Buffer.INDEX);
+        (0, import_core4.assert)(this.indices.usage === import_core4.Buffer.INDEX);
       }
     }
     destroy() {
-      this.indices.destroy();
-      this.attributes.positions.destroy();
-      this.attributes.normals.destroy();
-      this.attributes.texCoords.destroy();
-      this.attributes.colors?.destroy();
+      this.indices?.destroy();
+      for (const attribute of Object.values(this.attributes)) {
+        attribute.destroy();
+      }
     }
     getVertexCount() {
       return this.vertexCount;
@@ -999,7 +922,7 @@ var __exports__ = (() => {
       return void 0;
     }
     const data = geometry.indices.value;
-    return device.createBuffer({ usage: import_core5.Buffer.INDEX, data });
+    return device.createBuffer({ usage: import_core4.Buffer.INDEX, data });
   }
   function getAttributeBuffersFromGeometry(device, geometry) {
     const bufferLayout = [];
@@ -1022,20 +945,113 @@ var __exports__ = (() => {
       }
       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) });
+      bufferLayout.push({ name, format: (0, import_core4.getVertexFormatFromAttribute)(value, size, normalized) });
     }
     const vertexCount = geometry._calculateVertexCount(geometry.attributes, geometry.indices);
     return { attributes, bufferLayout, vertexCount };
   }
 
+  // src/shader-inputs.ts
+  var import_core5 = __toESM(require_core(), 1);
+  var import_shadertools = __toESM(require_shadertools(), 1);
+  var ShaderInputs = class {
+    /**
+     * The map of modules
+     * @todo should should this include the resolved dependencies?
+     */
+    modules;
+    /** Stores the uniform values for each module */
+    moduleUniforms;
+    /** Stores the uniform bindings for each module  */
+    moduleBindings;
+    /** Tracks if uniforms have changed */
+    moduleUniformsChanged;
+    /**
+     * Create a new UniformStore instance
+     * @param modules
+     */
+    constructor(modules) {
+      const allModules = (0, import_shadertools._resolveModules)(Object.values(modules));
+      import_core5.log.log(
+        1,
+        "Creating ShaderInputs with modules",
+        allModules.map((m) => m.name)
+      )();
+      this.modules = modules;
+      this.moduleUniforms = {};
+      this.moduleBindings = {};
+      for (const [name, module] of Object.entries(modules)) {
+        const moduleName = name;
+        this.moduleUniforms[moduleName] = module.defaultUniforms || {};
+        this.moduleBindings[moduleName] = {};
+      }
+    }
+    /** Destroy */
+    destroy() {
+    }
+    /**
+     * Set module props
+     */
+    setProps(props) {
+      for (const name of Object.keys(props)) {
+        const moduleName = name;
+        const moduleProps = props[moduleName];
+        const module = this.modules[moduleName];
+        if (!module) {
+          import_core5.log.warn(`Module ${name} not found`)();
+          continue;
+        }
+        const oldUniforms = this.moduleUniforms[moduleName];
+        const uniforms = module.getUniforms?.(moduleProps, this.moduleUniforms[moduleName]) || moduleProps;
+        this.moduleUniforms[moduleName] = { ...oldUniforms, ...uniforms };
+      }
+    }
+    /** Merges all bindings for the shader (from the various modules) */
+    // getUniformBlocks(): Record<string, Texture | Sampler> {
+    //   return this.moduleUniforms;
+    // }
+    /**
+     * Return the map of modules
+     * @todo should should this include the resolved dependencies?
+     */
+    getModules() {
+      return Object.values(this.modules);
+    }
+    /** Get all uniform values for all modules */
+    getUniformValues() {
+      return this.moduleUniforms;
+    }
+    /** Merges all bindings for the shader (from the various modules) */
+    getBindings() {
+      const bindings = {};
+      for (const moduleBindings of Object.values(this.moduleBindings)) {
+        Object.assign(bindings, moduleBindings);
+      }
+      return bindings;
+    }
+    getDebugTable() {
+      const table = {};
+      for (const [moduleName, module] of Object.entries(this.moduleUniforms)) {
+        for (const [key, value] of Object.entries(module)) {
+          table[`${moduleName}.${key}`] = {
+            type: this.modules[moduleName].uniformTypes?.[key],
+            value: String(value)
+          };
+        }
+      }
+      return table;
+    }
+  };
+
   // src/lib/pipeline-factory.ts
   var import_core6 = __toESM(require_core(), 1);
   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;
@@ -1043,40 +1059,59 @@ var __exports__ = (() => {
     constructor(device) {
       this.device = device;
     }
-    createRenderPipeline(options) {
-      const props = { ..._PipelineFactory.defaultProps, ...options };
-      const hash = this._hashRenderPipeline({ ...props });
-      if (!this._pipelineCache[hash]) {
-        const pipeline = this.device.createRenderPipeline({ ...props });
+    /** 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({
+          ...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
+    _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.source);
       const fsHash = props.fs ? this._getHash(props.fs.source) : 0;
       const varyingHash = "-";
       const bufferLayoutHash = this._getHash(JSON.stringify(props.bufferLayout));
-      switch (this.device.info.type) {
-        case "webgpu":
+      switch (this.device.type) {
+        default:
           const parameterHash = this._getHash(JSON.stringify(props.parameters));
           return `${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${parameterHash}BL${bufferLayoutHash}`;
-        default:
-          return `${vsHash}/${fsHash}V${varyingHash}BL${bufferLayoutHash}`;
       }
     }
     _getHash(key) {
@@ -1089,6 +1124,54 @@ var __exports__ = (() => {
   var PipelineFactory = _PipelineFactory;
   __publicField(PipelineFactory, "defaultProps", { ...import_core6.RenderPipeline.defaultProps });
 
+  // src/lib/shader-factory.ts
+  var import_core7 = __toESM(require_core(), 1);
+  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
   function getDebugTableForShaderLayout(layout, name) {
     const table = {};
@@ -1112,7 +1195,14 @@ var __exports__ = (() => {
   // src/debug/debug-framebuffer.ts
   var canvas = null;
   var ctx = null;
-  function debugFramebuffer(fbo, { id, minimap, opaque, top = "0", left = "0", rgbaScale = 1 }) {
+  function debugFramebuffer(fbo, {
+    id,
+    minimap,
+    opaque,
+    top = "0",
+    left = "0",
+    rgbaScale = 1
+  }) {
     if (!canvas) {
       canvas = document.createElement("canvas");
       canvas.id = id;
@@ -1150,9 +1240,11 @@ var __exports__ = (() => {
   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 */
@@ -1189,51 +1281,57 @@ var __exports__ = (() => {
     /** 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) {
       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(
         this.props.modules?.map((module) => [module.name, module]) || []
       );
       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 = (this.props.modules?.length > 0 ? this.props.modules : this.shaderInputs?.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
@@ -1254,7 +1352,9 @@ var __exports__ = (() => {
         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);
@@ -1266,7 +1366,7 @@ var __exports__ = (() => {
         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) {
@@ -1275,23 +1375,48 @@ var __exports__ = (() => {
       Object.seal(this);
     }
     destroy() {
+      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();
+      this._gpuGeometry?.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);
+        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;
-        this.pipeline.draw({
+        drawSuccess = this.pipeline.draw({
           renderPass,
           vertexArray: this.vertexArray,
           vertexCount: this.vertexCount,
@@ -1303,6 +1428,13 @@ var __exports__ = (() => {
         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)
     /**
@@ -1311,30 +1443,16 @@ var __exports__ = (() => {
      * @note Can trigger a pipeline rebuild / pipeline cache fetch on WebGPU
      */
     setGeometry(geometry) {
+      this._gpuGeometry?.destroy();
       const gpuGeometry = geometry && makeGPUGeometry(this.device, geometry);
-      this.setTopology(gpuGeometry.topology || "triangle-list");
-      this.bufferLayout = mergeBufferLayouts(gpuGeometry.bufferLayout, this.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).
@@ -1348,11 +1466,10 @@ var __exports__ = (() => {
     }
     /**
      * 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;
-      this._setPipelineNeedsUpdate("bufferLayout");
       this.pipeline = this._updatePipeline();
       this.vertexArray = this.device.createVertexArray({
         renderPipeline: this.pipeline
@@ -1360,6 +1477,7 @@ var __exports__ = (() => {
       if (this._gpuGeometry) {
         this._setGeometryAttributes(this._gpuGeometry);
       }
+      this._setPipelineNeedsUpdate("bufferLayout");
     }
     /**
      * Set GPU parameters.
@@ -1367,7 +1485,7 @@ var __exports__ = (() => {
      * @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");
       }
@@ -1379,6 +1497,7 @@ var __exports__ = (() => {
      */
     setVertexCount(vertexCount) {
       this.vertexCount = vertexCount;
+      this.setNeedsRedraw("vertexCount");
     }
     /**
      * Updates the instance count (used in draw calls)
@@ -1386,57 +1505,34 @@ var __exports__ = (() => {
      */
     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
@@ -1444,27 +1540,24 @@ var __exports__ = (() => {
      */
     setIndexBuffer(indexBuffer) {
       this.vertexArray.setIndexBuffer(indexBuffer);
-    }
-    /**
-     * Updates optional transform feedback. WebGL 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(
+        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));
+        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);
@@ -1476,12 +1569,13 @@ var __exports__ = (() => {
             set = true;
           }
         }
-        if (!set && _option !== "ignore-unknown") {
-          import_core8.log.warn(
+        if (!set && (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
@@ -1495,36 +1589,107 @@ var __exports__ = (() => {
       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(
+          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(
+          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;
+        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,
@@ -1533,10 +1698,14 @@ var __exports__ = (() => {
           vs,
           fs
         });
-        this._attributeInfos = (0, import_core9.getAttributeInfosFromLayouts)(
+        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;
     }
@@ -1544,33 +1713,33 @@ var __exports__ = (() => {
     _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;
@@ -1605,14 +1774,14 @@ var __exports__ = (() => {
     }
     // 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,
@@ -1629,8 +1798,11 @@ var __exports__ = (() => {
     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];
@@ -1646,10 +1818,11 @@ var __exports__ = (() => {
   }
   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
     };
   }
@@ -1658,7 +1831,7 @@ var __exports__ = (() => {
   }
 
   // src/transform/buffer-transform.ts
-  var import_core10 = __toESM(require_core(), 1);
+  var import_core12 = __toESM(require_core(), 1);
   var import_shadertools3 = __toESM(require_shadertools(), 1);
   var BufferTransform = class {
     device;
@@ -1666,10 +1839,10 @@ var __exports__ = (() => {
     transformFeedback;
     /** @deprecated Use device feature test. */
     static isSupported(device) {
-      return device.features.has("transform-feedback-webgl");
+      return device?.info?.type === "webgl";
     }
     constructor(device, props = Model.defaultProps) {
-      (0, import_core10.assert)(device.features.has("transform-feedback-webgl"), "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",
@@ -1710,7 +1883,7 @@ var __exports__ = (() => {
     }
     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;
@@ -1826,10 +1999,10 @@ var __exports__ = (() => {
   };
 
   // src/lib/clip-space.ts
-  var import_core12 = __toESM(require_core(), 1);
+  var import_core14 = __toESM(require_core(), 1);
 
   // src/geometry/geometry.ts
-  var import_core11 = __toESM(require_core(), 1);
+  var import_core13 = __toESM(require_core(), 1);
   var Geometry = class {
     id;
     /** Determines how vertices are read from the 'vertex' attributes */
@@ -1840,7 +2013,7 @@ var __exports__ = (() => {
     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;
@@ -1848,7 +2021,7 @@ var __exports__ = (() => {
       this.attributes = {};
       for (const [attributeName, attributeValue] of Object.entries(attributes)) {
         const attribute = ArrayBuffer.isView(attributeValue) ? { value: attributeValue } : attributeValue;
-        (0, import_core11.assert)(
+        (0, import_core13.assert)(
           ArrayBuffer.isView(attribute.value),
           `${this._print(attributeName)}: must be typed array or object with value as typed array`
         );
@@ -1856,7 +2029,7 @@ var __exports__ = (() => {
           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;
@@ -1871,7 +2044,7 @@ var __exports__ = (() => {
     getVertexCount() {
       return this.vertexCount;
     }
-    /** 
+    /**
      * Return an object with all attributes plus indices added as a field.
      * TODO Geometry types are a mess
      */
@@ -1888,10 +2061,10 @@ var __exports__ = (() => {
      * 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;
@@ -1907,13 +2080,13 @@ var __exports__ = (() => {
           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`\
+  var CLIPSPACE_VERTEX_SHADER = import_core14.glsl`\
 #version 300 es
 in vec2 aClipSpacePosition;
 in vec2 aTexCoord;
@@ -1934,28 +2107,25 @@ void main(void) {
   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 = __toESM(require_core(), 1);
+  var import_core15 = __toESM(require_core(), 1);
 
   // ../../node_modules/@math.gl/core/dist/lib/common.js
   var RADIANS_TO_DEGREES = 1 / Math.PI * 180;
@@ -3858,7 +4028,7 @@ void main(void) {
     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() {
@@ -3878,17 +4048,17 @@ void main(void) {
       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(scale2) {
-      (0, import_core13.assert)(scale2.length === 3, "setScale requires vector argument");
+      (0, import_core15.assert)(scale2.length === 3, "setScale requires vector argument");
       this.scale = scale2;
       return this;
     }
@@ -3940,7 +4110,7 @@ void main(void) {
       return this;
     }
     getCoordinateUniforms(viewMatrix, modelMatrix) {
-      (0, import_core13.assert)(viewMatrix);
+      (0, import_core15.assert)(viewMatrix);
       modelMatrix = modelMatrix || this.matrix;
       const worldMatrix = new Matrix4(viewMatrix).multiplyRight(modelMatrix);
       const worldInverse = worldMatrix.invert();
@@ -3997,13 +4167,13 @@ void main(void) {
   };
 
   // src/scenegraph/group-node.ts
-  var import_core16 = __toESM(require_core(), 1);
+  var import_core18 = __toESM(require_core(), 1);
   var GroupNode = class extends ScenegraphNode {
     children;
     constructor(props = {}) {
       props = Array.isArray(props) ? { children: props } : props;
       const { children = [] } = props;
-      import_core16.log.assert(
+      import_core18.log.assert(
         children.every((child) => child instanceof ScenegraphNode),
         "every child must an instance of ScenegraphNode"
       );
@@ -4011,7 +4181,10 @@ void main(void) {
       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) {
@@ -4023,11 +4196,7 @@ void main(void) {
         const halfSize = new Vector3(max).subtract(min).divide([2, 2, 2]);
         worldMatrix.transformAsVector(halfSize, halfSize);
         for (let v = 0; v < 8; v++) {
-          const position = new Vector3(
-            v & 1 ? -1 : 1,
-            v & 2 ? -1 : 1,
-            v & 4 ? -1 : 1
-          ).multiply(halfSize).add(center);
+          const position = new 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]);
@@ -4113,10 +4282,10 @@ void main(void) {
   };
 
   // src/geometries/cone-geometry.ts
-  var import_core18 = __toESM(require_core(), 1);
+  var import_core20 = __toESM(require_core(), 1);
 
   // src/geometries/truncated-cone-geometry.ts
-  var import_core17 = __toESM(require_core(), 1);
+  var import_core19 = __toESM(require_core(), 1);
   var INDEX_OFFSETS = {
     x: [2, 0, 1],
     y: [0, 1, 2],
@@ -4124,7 +4293,7 @@ void main(void) {
   };
   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,
@@ -4228,7 +4397,7 @@ void main(void) {
   // src/geometries/cone-geometry.ts
   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,
@@ -4241,23 +4410,25 @@ void main(void) {
   };
 
   // src/geometries/cube-geometry.ts
-  var import_core19 = __toESM(require_core(), 1);
+  var import_core21 = __toESM(require_core(), 1);
   var CubeGeometry = class extends Geometry {
     constructor(props = {}) {
-      const { id = (0, import_core19.uid)("cube-geometry"), indices = true } = props;
-      super(indices ? {
-        ...props,
-        id,
-        topology: "triangle-list",
-        indices: { size: 1, value: CUBE_INDICES },
-        attributes: { ...ATTRIBUTES, ...props.attributes }
-      } : {
-        ...props,
-        id,
-        topology: "triangle-list",
-        indices: void 0,
-        attributes: { ...NON_INDEXED_ATTRIBUTES, ...props.attributes }
-      });
+      const { id = (0, import_core21.uid)("cube-geometry"), indices = true } = props;
+      super(
+        indices ? {
+          ...props,
+          id,
+          topology: "triangle-list",
+          indices: { size: 1, value: CUBE_INDICES },
+          attributes: { ...ATTRIBUTES, ...props.attributes }
+        } : {
+          ...props,
+          id,
+          topology: "triangle-list",
+          indices: void 0,
+          attributes: { ...NON_INDEXED_ATTRIBUTES, ...props.attributes }
+        }
+      );
     }
   };
   var CUBE_INDICES = new Uint16Array([
@@ -4851,10 +5022,10 @@ void main(void) {
   };
 
   // src/geometries/cylinder-geometry.ts
-  var import_core20 = __toESM(require_core(), 1);
+  var import_core22 = __toESM(require_core(), 1);
   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,
@@ -4865,12 +5036,12 @@ void main(void) {
   };
 
   // src/geometries/ico-sphere-geometry.ts
-  var import_core21 = __toESM(require_core(), 1);
+  var import_core23 = __toESM(require_core(), 1);
   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,
@@ -5012,7 +5183,7 @@ void main(void) {
   }
 
   // src/geometries/plane-geometry.ts
-  var import_core23 = __toESM(require_core(), 1);
+  var import_core25 = __toESM(require_core(), 1);
 
   // src/geometry/geometry-utils.ts
   function unpackIndexedGeometry(geometry) {
@@ -5045,7 +5216,7 @@ void main(void) {
   // src/geometries/plane-geometry.ts
   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,
@@ -5135,10 +5306,10 @@ void main(void) {
   }
 
   // src/geometries/sphere-geometry.ts
-  var import_core24 = __toESM(require_core(), 1);
+  var import_core26 = __toESM(require_core(), 1);
   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,
@@ -5212,6 +5383,219 @@ void main(void) {
       }
     };
   }
+
+  // src/computation.ts
+  var import_core27 = __toESM(require_core(), 1);
+  var import_core28 = __toESM(require_core(), 1);
+  var import_core29 = __toESM(require_core(), 1);
+  var import_shadertools5 = __toESM(require_shadertools(), 1);
+  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) {
+      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(
+        this.props.modules?.map((module) => [module.name, module]) || []
+      );
+      this.setShaderInputs(props.shaderInputs || new ShaderInputs(moduleMap));
+      this.props.shaderLayout ||= (0, import_shadertools5.getShaderLayoutFromWGSL)(this.props.source);
+      const platformInfo = getPlatformInfo2(device);
+      const modules = (this.props.modules?.length > 0 ? this.props.modules : this.shaderInputs?.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
+    };
+  }
   return __toCommonJS(src_exports);
 })();
       return __exports__;