@luma.gl/engine 9.3.0-alpha.4 → 9.3.0-alpha.6

package/dist/dist.dev.js

@@ -281,10 +281,22 @@ var __exports__ = (() => {
 
   // src/animation-loop/request-animation-frame.ts
   function requestAnimationFramePolyfill(callback) {
-    return typeof window !== "undefined" && window.requestAnimationFrame ? window.requestAnimationFrame(callback) : setTimeout(callback, 1e3 / 60);
+    const browserRequestAnimationFrame = typeof window !== "undefined" ? window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame : null;
+    if (browserRequestAnimationFrame) {
+      return browserRequestAnimationFrame.call(window, callback);
+    }
+    return setTimeout(
+      () => callback(typeof performance !== "undefined" ? performance.now() : Date.now()),
+      1e3 / 60
+    );
   }
   function cancelAnimationFramePolyfill(timerId) {
-    return typeof window !== "undefined" && window.cancelAnimationFrame ? window.cancelAnimationFrame(timerId) : clearTimeout(timerId);
+    const browserCancelAnimationFrame = typeof window !== "undefined" ? window.cancelAnimationFrame || window.webkitCancelAnimationFrame || window.mozCancelAnimationFrame : null;
+    if (browserCancelAnimationFrame) {
+      browserCancelAnimationFrame.call(window, timerId);
+      return;
+    }
+    clearTimeout(timerId);
   }
 
   // ../../node_modules/@probe.gl/stats/dist/utils/hi-res-timestamp.js
@@ -482,6 +494,7 @@ var __exports__ = (() => {
 
   // src/animation-loop/animation-loop.ts
   var statIdCounter = 0;
+  var ANIMATION_LOOP_STATS = "Animation Loop";
   var _AnimationLoop = class {
     device = null;
     canvas = null;
@@ -489,6 +502,7 @@ var __exports__ = (() => {
     animationProps = null;
     timeline = null;
     stats;
+    sharedStats;
     cpuTime;
     gpuTime;
     frameRate;
@@ -501,7 +515,7 @@ var __exports__ = (() => {
     _resolveNextFrame = null;
     _cpuStartTime = 0;
     _error = null;
-    // _gpuTimeQuery: Query | null = null;
+    _lastFrameTime = 0;
     /*
      * @param {HTMLCanvasElement} canvas - if provided, width and height will be passed to context
      */
@@ -511,10 +525,12 @@ var __exports__ = (() => {
       if (!props.device) {
         throw new Error("No device provided");
       }
-      this.stats = props.stats || new Stats({ id: "animation-loop-stats" });
+      this.stats = props.stats || new Stats({ id: `animation-loop-${statIdCounter++}` });
+      this.sharedStats = import_core.luma.stats.get(ANIMATION_LOOP_STATS);
+      this.frameRate = this.stats.get("Frame Rate");
+      this.frameRate.setSampleSize(1);
       this.cpuTime = this.stats.get("CPU Time");
       this.gpuTime = this.stats.get("GPU Time");
-      this.frameRate = this.stats.get("Frame Rate");
       this.setProps({ autoResizeViewport: props.autoResizeViewport });
       this.start = this.start.bind(this);
       this.stop = this.stop.bind(this);
@@ -524,6 +540,7 @@ var __exports__ = (() => {
     destroy() {
       this.stop();
       this._setDisplay(null);
+      this.device?._disableDebugGPUTime();
     }
     /** @deprecated Use .destroy() */
     delete() {
@@ -588,15 +605,16 @@ var __exports__ = (() => {
         this._nextFramePromise = null;
         this._resolveNextFrame = null;
         this._running = false;
+        this._lastFrameTime = 0;
       }
       return this;
     }
     /** Explicitly draw a frame */
-    redraw() {
+    redraw(time) {
       if (this.device?.isLost || this._error) {
         return this;
       }
-      this._beginFrameTimers();
+      this._beginFrameTimers(time);
       this._setupFrame();
       this._updateAnimationProps();
       this._renderFrame(this._getAnimationProps());
@@ -643,6 +661,7 @@ var __exports__ = (() => {
       this._initializeAnimationProps();
       this._updateAnimationProps();
       this._resizeViewport();
+      this.device?._enableDebugGPUTime();
     }
     _setDisplay(display) {
       if (this.display) {
@@ -667,11 +686,11 @@ var __exports__ = (() => {
       cancelAnimationFramePolyfill(this._animationFrameId);
       this._animationFrameId = null;
     }
-    _animationFrame() {
+    _animationFrame(time) {
       if (!this._running) {
         return;
       }
-      this.redraw();
+      this.redraw(time);
       this._requestAnimationFrame();
     }
     // Called on each frame, can be overridden to call onRender multiple times
@@ -785,14 +804,8 @@ var __exports__ = (() => {
       if (!this.device) {
         return { width: 1, height: 1, aspect: 1 };
       }
-      const [width, height] = this.device?.getDefaultCanvasContext().getDevicePixelSize() || [1, 1];
-      let aspect = 1;
-      const canvas2 = this.device?.getDefaultCanvasContext().canvas;
-      if (canvas2 && canvas2.clientHeight) {
-        aspect = canvas2.clientWidth / canvas2.clientHeight;
-      } else if (width > 0 && height > 0) {
-        aspect = width / height;
-      }
+      const [width, height] = this.device.getDefaultCanvasContext().getDrawingBufferSize();
+      const aspect = width > 0 && height > 0 ? width / height : 1;
       return { width, height, aspect };
     }
     /** @deprecated Default viewport setup */
@@ -808,13 +821,61 @@ var __exports__ = (() => {
         );
       }
     }
-    _beginFrameTimers() {
-      this.frameRate.timeEnd();
-      this.frameRate.timeStart();
+    _beginFrameTimers(time) {
+      const now = time ?? (typeof performance !== "undefined" ? performance.now() : Date.now());
+      if (this._lastFrameTime) {
+        const frameTime = now - this._lastFrameTime;
+        if (frameTime > 0) {
+          this.frameRate.addTime(frameTime);
+        }
+      }
+      this._lastFrameTime = now;
+      if (this.device?._isDebugGPUTimeEnabled()) {
+        this._consumeEncodedGpuTime();
+      }
       this.cpuTime.timeStart();
     }
     _endFrameTimers() {
+      if (this.device?._isDebugGPUTimeEnabled()) {
+        this._consumeEncodedGpuTime();
+      }
       this.cpuTime.timeEnd();
+      this._updateSharedStats();
+    }
+    _consumeEncodedGpuTime() {
+      if (!this.device) {
+        return;
+      }
+      const gpuTimeMs = this.device.commandEncoder._gpuTimeMs;
+      if (gpuTimeMs !== void 0) {
+        this.gpuTime.addTime(gpuTimeMs);
+        this.device.commandEncoder._gpuTimeMs = void 0;
+      }
+    }
+    _updateSharedStats() {
+      if (this.stats === this.sharedStats) {
+        return;
+      }
+      for (const name of Object.keys(this.sharedStats.stats)) {
+        if (!this.stats.stats[name]) {
+          delete this.sharedStats.stats[name];
+        }
+      }
+      this.stats.forEach((sourceStat) => {
+        const targetStat = this.sharedStats.get(sourceStat.name, sourceStat.type);
+        targetStat.sampleSize = sourceStat.sampleSize;
+        targetStat.time = sourceStat.time;
+        targetStat.count = sourceStat.count;
+        targetStat.samples = sourceStat.samples;
+        targetStat.lastTiming = sourceStat.lastTiming;
+        targetStat.lastSampleTime = sourceStat.lastSampleTime;
+        targetStat.lastSampleCount = sourceStat.lastSampleCount;
+        targetStat._count = sourceStat._count;
+        targetStat._time = sourceStat._time;
+        targetStat._samples = sourceStat._samples;
+        targetStat._startTime = sourceStat._startTime;
+        targetStat._timerPending = sourceStat._timerPending;
+      });
     }
     // Event handling
     _startEventHandling() {
@@ -843,7 +904,7 @@ var __exports__ = (() => {
     },
     onError: (error) => console.error(error),
     // eslint-disable-line no-console
-    stats: import_core.luma.stats.get(`animation-loop-${statIdCounter++}`),
+    stats: void 0,
     // view parameters
     autoResizeViewport: false
   });
@@ -875,7 +936,10 @@ var __exports__ = (() => {
     return animationLoop;
   }
   function setError(device, error) {
-    const canvas2 = device?.getDefaultCanvasContext().canvas;
+    if (!device) {
+      return;
+    }
+    const canvas2 = device.getDefaultCanvasContext().canvas;
     if (canvas2 instanceof HTMLCanvasElement) {
       canvas2.style.overflow = "visible";
       let errorDiv = document.getElementById("animation-loop-error");
@@ -892,6 +956,9 @@ var __exports__ = (() => {
     }
   }
   function clearError(device) {
+    if (!device) {
+      return;
+    }
     const errorDiv = document.getElementById("animation-loop-error");
     if (errorDiv) {
       errorDiv.remove();
@@ -899,8 +966,8 @@ var __exports__ = (() => {
   }
 
   // src/model/model.ts
-  var import_core12 = __toESM(require_core(), 1);
-  var import_shadertools3 = __toESM(require_shadertools(), 1);
+  var import_core10 = __toESM(require_core(), 1);
+  var import_shadertools2 = __toESM(require_shadertools(), 1);
 
   // src/geometry/gpu-geometry.ts
   var import_core3 = __toESM(require_core(), 1);
@@ -1019,13 +1086,11 @@ var __exports__ = (() => {
       return moduleData.defaultPipelineFactory;
     }
     device;
-    cachingEnabled;
-    destroyPolicy;
-    debug;
     _hashCounter = 0;
     _hashes = {};
     _renderPipelineCache = {};
     _computePipelineCache = {};
+    _sharedRenderPipelineCache = {};
     get [Symbol.toStringTag]() {
       return "PipelineFactory";
     }
@@ -1034,35 +1099,34 @@ var __exports__ = (() => {
     }
     constructor(device) {
       this.device = device;
-      this.cachingEnabled = device.props._cachePipelines;
-      this.destroyPolicy = device.props._cacheDestroyPolicy;
-      this.debug = device.props.debugFactories;
     }
     /** Return a RenderPipeline matching supplied props. Reuses an equivalent pipeline if already created. */
     createRenderPipeline(props) {
-      if (!this.cachingEnabled) {
+      if (!this.device.props._cachePipelines) {
         return this.device.createRenderPipeline(props);
       }
       const allProps = { ...import_core4.RenderPipeline.defaultProps, ...props };
       const cache = this._renderPipelineCache;
       const hash = this._hashRenderPipeline(allProps);
-      let pipeline = cache[hash]?.pipeline;
+      let pipeline = cache[hash]?.resource;
       if (!pipeline) {
+        const sharedRenderPipeline = this.device.type === "webgl" && this.device.props._sharePipelines ? this.createSharedRenderPipeline(allProps) : void 0;
         pipeline = this.device.createRenderPipeline({
           ...allProps,
-          id: allProps.id ? `${allProps.id}-cached` : uid("unnamed-cached")
+          id: allProps.id ? `${allProps.id}-cached` : uid("unnamed-cached"),
+          _sharedRenderPipeline: sharedRenderPipeline
         });
         pipeline.hash = hash;
-        cache[hash] = { pipeline, useCount: 1 };
-        if (this.debug) {
+        cache[hash] = { resource: pipeline, useCount: 1 };
+        if (this.device.props.debugFactories) {
           import_core4.log.log(3, `${this}: ${pipeline} created, count=${cache[hash].useCount}`)();
         }
       } else {
         cache[hash].useCount++;
-        if (this.debug) {
+        if (this.device.props.debugFactories) {
           import_core4.log.log(
             3,
-            `${this}: ${cache[hash].pipeline} reused, count=${cache[hash].useCount}, (id=${props.id})`
+            `${this}: ${cache[hash].resource} reused, count=${cache[hash].useCount}, (id=${props.id})`
           )();
         }
       }
@@ -1070,36 +1134,36 @@ var __exports__ = (() => {
     }
     /** Return a ComputePipeline matching supplied props. Reuses an equivalent pipeline if already created. */
     createComputePipeline(props) {
-      if (!this.cachingEnabled) {
+      if (!this.device.props._cachePipelines) {
         return this.device.createComputePipeline(props);
       }
       const allProps = { ...import_core4.ComputePipeline.defaultProps, ...props };
       const cache = this._computePipelineCache;
       const hash = this._hashComputePipeline(allProps);
-      let pipeline = cache[hash]?.pipeline;
+      let pipeline = cache[hash]?.resource;
       if (!pipeline) {
         pipeline = this.device.createComputePipeline({
           ...allProps,
           id: allProps.id ? `${allProps.id}-cached` : void 0
         });
         pipeline.hash = hash;
-        cache[hash] = { pipeline, useCount: 1 };
-        if (this.debug) {
+        cache[hash] = { resource: pipeline, useCount: 1 };
+        if (this.device.props.debugFactories) {
           import_core4.log.log(3, `${this}: ${pipeline} created, count=${cache[hash].useCount}`)();
         }
       } else {
         cache[hash].useCount++;
-        if (this.debug) {
+        if (this.device.props.debugFactories) {
           import_core4.log.log(
             3,
-            `${this}: ${cache[hash].pipeline} reused, count=${cache[hash].useCount}, (id=${props.id})`
+            `${this}: ${cache[hash].resource} reused, count=${cache[hash].useCount}, (id=${props.id})`
           )();
         }
       }
       return pipeline;
     }
     release(pipeline) {
-      if (!this.cachingEnabled) {
+      if (!this.device.props._cachePipelines) {
         pipeline.destroy();
         return;
       }
@@ -1108,28 +1172,55 @@ var __exports__ = (() => {
       cache[hash].useCount--;
       if (cache[hash].useCount === 0) {
         this._destroyPipeline(pipeline);
-        if (this.debug) {
+        if (this.device.props.debugFactories) {
           import_core4.log.log(3, `${this}: ${pipeline} released and destroyed`)();
         }
       } else if (cache[hash].useCount < 0) {
         import_core4.log.error(`${this}: ${pipeline} released, useCount < 0, resetting`)();
         cache[hash].useCount = 0;
-      } else if (this.debug) {
+      } else if (this.device.props.debugFactories) {
         import_core4.log.log(3, `${this}: ${pipeline} released, count=${cache[hash].useCount}`)();
       }
     }
+    createSharedRenderPipeline(props) {
+      const sharedPipelineHash = this._hashSharedRenderPipeline(props);
+      let sharedCacheItem = this._sharedRenderPipelineCache[sharedPipelineHash];
+      if (!sharedCacheItem) {
+        const sharedRenderPipeline = this.device._createSharedRenderPipelineWebGL(props);
+        sharedCacheItem = { resource: sharedRenderPipeline, useCount: 0 };
+        this._sharedRenderPipelineCache[sharedPipelineHash] = sharedCacheItem;
+      }
+      sharedCacheItem.useCount++;
+      return sharedCacheItem.resource;
+    }
+    releaseSharedRenderPipeline(pipeline) {
+      if (!pipeline.sharedRenderPipeline) {
+        return;
+      }
+      const sharedPipelineHash = this._hashSharedRenderPipeline(pipeline.sharedRenderPipeline.props);
+      const sharedCacheItem = this._sharedRenderPipelineCache[sharedPipelineHash];
+      if (!sharedCacheItem) {
+        return;
+      }
+      sharedCacheItem.useCount--;
+      if (sharedCacheItem.useCount === 0) {
+        sharedCacheItem.resource.destroy();
+        delete this._sharedRenderPipelineCache[sharedPipelineHash];
+      }
+    }
     // PRIVATE
-    /** Destroy a cached pipeline, removing it from the cache (depending on destroy policy) */
+    /** Destroy a cached pipeline, removing it from the cache if configured to do so. */
     _destroyPipeline(pipeline) {
       const cache = this._getCache(pipeline);
-      switch (this.destroyPolicy) {
-        case "never":
-          return false;
-        case "unused":
-          delete cache[pipeline.hash];
-          pipeline.destroy();
-          return true;
+      if (!this.device.props._destroyPipelines) {
+        return false;
+      }
+      delete cache[pipeline.hash];
+      pipeline.destroy();
+      if (pipeline instanceof import_core4.RenderPipeline) {
+        this.releaseSharedRenderPipeline(pipeline);
       }
+      return true;
     }
     /** Get the appropriate cache for the type of pipeline */
     _getCache(pipeline) {
@@ -1158,24 +1249,35 @@ var __exports__ = (() => {
     _hashRenderPipeline(props) {
       const vsHash = props.vs ? this._getHash(props.vs.source) : 0;
       const fsHash = props.fs ? this._getHash(props.fs.source) : 0;
-      const varyingHash = "-";
+      const varyingHash = this._getWebGLVaryingHash(props);
       const bufferLayoutHash = this._getHash(JSON.stringify(props.bufferLayout));
       const { type } = this.device;
       switch (type) {
         case "webgl":
-          return `${type}/R/${vsHash}/${fsHash}V${varyingHash}BL${bufferLayoutHash}`;
+          const webglParameterHash = this._getHash(JSON.stringify(props.parameters));
+          return `${type}/R/${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${webglParameterHash}BL${bufferLayoutHash}`;
         case "webgpu":
         default:
           const parameterHash = this._getHash(JSON.stringify(props.parameters));
           return `${type}/R/${vsHash}/${fsHash}V${varyingHash}T${props.topology}P${parameterHash}BL${bufferLayoutHash}`;
       }
     }
+    _hashSharedRenderPipeline(props) {
+      const vsHash = props.vs ? this._getHash(props.vs.source) : 0;
+      const fsHash = props.fs ? this._getHash(props.fs.source) : 0;
+      const varyingHash = this._getWebGLVaryingHash(props);
+      return `webgl/S/${vsHash}/${fsHash}V${varyingHash}`;
+    }
     _getHash(key) {
       if (this._hashes[key] === void 0) {
         this._hashes[key] = this._hashCounter++;
       }
       return this._hashes[key];
     }
+    _getWebGLVaryingHash(props) {
+      const { varyings = [], bufferMode = null } = props;
+      return this._getHash(JSON.stringify({ varyings, bufferMode }));
+    }
   };
   var PipelineFactory = _PipelineFactory;
   __publicField(PipelineFactory, "defaultProps", { ...import_core4.RenderPipeline.defaultProps });
@@ -1190,9 +1292,6 @@ var __exports__ = (() => {
       return moduleData.defaultShaderFactory;
     }
     device;
-    cachingEnabled;
-    destroyPolicy;
-    debug;
     _cache = {};
     get [Symbol.toStringTag]() {
       return "ShaderFactory";
@@ -1203,40 +1302,37 @@ var __exports__ = (() => {
     /** @internal */
     constructor(device) {
       this.device = device;
-      this.cachingEnabled = device.props._cacheShaders;
-      this.destroyPolicy = device.props._cacheDestroyPolicy;
-      this.debug = true;
     }
     /** Requests a {@link Shader} from the cache, creating a new Shader only if necessary. */
     createShader(props) {
-      if (!this.cachingEnabled) {
+      if (!this.device.props._cacheShaders) {
         return this.device.createShader(props);
       }
       const key = this._hashShader(props);
       let cacheEntry = this._cache[key];
       if (!cacheEntry) {
-        const shader = this.device.createShader({
+        const resource = this.device.createShader({
           ...props,
           id: props.id ? `${props.id}-cached` : void 0
         });
-        this._cache[key] = cacheEntry = { shader, useCount: 1 };
-        if (this.debug) {
-          import_core5.log.log(3, `${this}: Created new shader ${shader.id}`)();
+        this._cache[key] = cacheEntry = { resource, useCount: 1 };
+        if (this.device.props.debugFactories) {
+          import_core5.log.log(3, `${this}: Created new shader ${resource.id}`)();
         }
       } else {
         cacheEntry.useCount++;
-        if (this.debug) {
+        if (this.device.props.debugFactories) {
           import_core5.log.log(
             3,
-            `${this}: Reusing shader ${cacheEntry.shader.id} count=${cacheEntry.useCount}`
+            `${this}: Reusing shader ${cacheEntry.resource.id} count=${cacheEntry.useCount}`
           )();
         }
       }
-      return cacheEntry.shader;
+      return cacheEntry.resource;
     }
     /** Releases a previously-requested {@link Shader}, destroying it if no users remain. */
     release(shader) {
-      if (!this.cachingEnabled) {
+      if (!this.device.props._cacheShaders) {
         shader.destroy();
         return;
       }
@@ -1245,16 +1341,16 @@ var __exports__ = (() => {
       if (cacheEntry) {
         cacheEntry.useCount--;
         if (cacheEntry.useCount === 0) {
-          if (this.destroyPolicy === "unused") {
+          if (this.device.props._destroyShaders) {
             delete this._cache[key];
-            cacheEntry.shader.destroy();
-            if (this.debug) {
+            cacheEntry.resource.destroy();
+            if (this.device.props.debugFactories) {
               import_core5.log.log(3, `${this}: Releasing shader ${shader.id}, destroyed`)();
             }
           }
         } else if (cacheEntry.useCount < 0) {
           throw new Error(`ShaderFactory: Shader ${shader.id} released too many times`);
-        } else if (this.debug) {
+        } else if (this.device.props.debugFactories) {
           import_core5.log.log(3, `${this}: Releasing shader ${shader.id} count=${cacheEntry.useCount}`)();
         }
       }
@@ -1574,7 +1670,7 @@ var __exports__ = (() => {
   };
 
   // src/dynamic-texture/dynamic-texture.ts
-  var import_core11 = __toESM(require_core(), 1);
+  var import_core9 = __toESM(require_core(), 1);
 
   // src/dynamic-texture/texture-data.ts
   var import_core8 = __toESM(require_core(), 1);
@@ -1642,6 +1738,15 @@ var __exports__ = (() => {
   function isTextureImageData(data) {
     return typeof data === "object" && data !== null && "data" in data && "width" in data && "height" in data;
   }
+  function resolveTextureImageFormat(data) {
+    const { textureFormat, format } = data;
+    if (textureFormat && format && textureFormat !== format) {
+      throw new Error(
+        `Conflicting texture formats "${textureFormat}" and "${format}" provided for the same mip level`
+      );
+    }
+    return textureFormat ?? format;
+  }
   function getCubeFaceIndex(face) {
     const idx = TEXTURE_CUBE_FACE_MAP[face];
     if (idx === void 0)
@@ -1674,6 +1779,7 @@ var __exports__ = (() => {
         subresources.push({
           type: "texture-data",
           data: imageData,
+          textureFormat: resolveTextureImageFormat(imageData),
           z,
           mipLevel
         });
@@ -1716,656 +1822,6 @@ var __exports__ = (() => {
     return subresources;
   }
 
-  // src/dynamic-texture/mipmaps.ts
-  var import_core10 = __toESM(require_core(), 1);
-
-  // src/compute/computation.ts
-  var import_core9 = __toESM(require_core(), 1);
-  var import_shadertools2 = __toESM(require_shadertools(), 1);
-  var LOG_DRAW_PRIORITY = 2;
-  var LOG_DRAW_TIMEOUT = 1e4;
-  var _Computation = class {
-    device;
-    id;
-    pipelineFactory;
-    shaderFactory;
-    userData = {};
-    /** Bindings (textures, samplers, uniform buffers) */
-    bindings = {};
-    /** The underlying GPU pipeline. */
-    pipeline;
-    /** Assembled compute shader source */
-    source;
-    /** the underlying compiled compute shader */
-    // @ts-ignore Set in function called from constructor
-    shader;
-    /** ShaderInputs instance */
-    shaderInputs;
-    // @ts-ignore Set in function called from constructor
-    _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 || uid("model");
-      this.device = device;
-      Object.assign(this.userData, props.userData);
-      const moduleMap = Object.fromEntries(
-        this.props.modules?.map((module) => [module.name, module]) || []
-      );
-      this.shaderInputs = props.shaderInputs || new ShaderInputs(moduleMap);
-      this.setShaderInputs(this.shaderInputs);
-      this.props.shaderLayout ||= device.getShaderLayout(this.props.source);
-      const platformInfo = getPlatformInfo(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: source3, getUniforms: getUniforms2 } = this.props.shaderAssembler.assembleWGSLShader({
-        platformInfo,
-        ...this.props,
-        modules
-      });
-      this.source = source3;
-      this._getModuleUniforms = getUniforms2;
-      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_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 !isNumericArray(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_core9.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,
-          debugShaders: 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_core9.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT;
-      if (import_core9.log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
-        return;
-      }
-      this._lastLogTime = Date.now();
-      this._logOpen = true;
-      import_core9.log.group(LOG_DRAW_PRIORITY, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core9.log.level <= 2 })();
-    }
-    _logDrawCallEnd() {
-      if (this._logOpen) {
-        const uniformTable = this.shaderInputs.getDebugTable();
-        import_core9.log.table(LOG_DRAW_PRIORITY, uniformTable)();
-        import_core9.log.groupEnd(LOG_DRAW_PRIORITY)();
-        this._logOpen = false;
-      }
-    }
-    _drawCount = 0;
-    // TODO - fix typing of luma data types
-    _getBufferOrConstantValues(attribute, dataType) {
-      const TypedArrayConstructor = (0, import_core9.getTypedArrayConstructor)(dataType);
-      const typedArray = attribute instanceof import_core9.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
-      return typedArray.toString();
-    }
-  };
-  var Computation = _Computation;
-  __publicField(Computation, "defaultProps", {
-    ...import_core9.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_shadertools2.ShaderAssembler.getDefaultShaderAssembler(),
-    debugShaders: void 0
-  });
-  function getPlatformInfo(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
-    };
-  }
-
-  // src/dynamic-texture/mipmaps.ts
-  var RENDER_DIMENSIONS = [
-    "2d",
-    "2d-array",
-    "cube",
-    "cube-array"
-  ];
-  var WORKGROUP_SIZE = {
-    x: 4,
-    y: 4,
-    z: 4
-  };
-  function generateMipmap(device, texture) {
-    if (texture.mipLevels <= 1) {
-      return;
-    }
-    if (device.type !== "webgpu") {
-      throw new Error(
-        `Cannot generate mipmaps on device type "${device.type}". Use generateMipmapsWebGL for WebGL devices.`
-      );
-    }
-    if (texture.dimension === "3d") {
-      generateMipmaps3D(device, texture);
-      return;
-    }
-    if (RENDER_DIMENSIONS.includes(texture.dimension)) {
-      generateMipmapsRender(device, texture);
-      return;
-    }
-    throw new Error(
-      `Cannot generate mipmaps for texture dimension "${texture.dimension}" with WebGPU.`
-    );
-  }
-  function generateMipmapsRender(device, texture) {
-    validateFormatCapabilities(device, texture, ["render", "filter"], "render");
-    const colorAttachmentFormat = getColorAttachmentFormat(
-      texture.format,
-      "render",
-      texture.dimension
-    );
-    const viewDimension = texture.dimension;
-    const shader = getRenderMipmapWGSL(viewDimension);
-    const sampler = device.createSampler({ minFilter: "linear", magFilter: "linear" });
-    const uniformValues = new Uint32Array(1);
-    const uniformsBuffer = device.createBuffer({
-      byteLength: 16,
-      usage: import_core10.Buffer.UNIFORM | import_core10.Buffer.COPY_DST
-    });
-    const model = new Model(device, {
-      source: shader,
-      colorAttachmentFormats: [colorAttachmentFormat],
-      topology: "triangle-list",
-      vertexCount: 3,
-      shaderLayout: {
-        attributes: [],
-        bindings: [
-          { type: "sampler", name: "sourceSampler", group: 0, location: 0 },
-          {
-            type: "texture",
-            name: "sourceTexture",
-            group: 0,
-            location: 1,
-            viewDimension,
-            sampleType: "float"
-          },
-          { type: "uniform", name: "uniforms", group: 0, location: 2 }
-        ]
-      },
-      bindings: {
-        sourceSampler: sampler,
-        sourceTexture: texture,
-        uniforms: uniformsBuffer
-      }
-    });
-    let sourceWidth = texture.width;
-    let sourceHeight = texture.height;
-    const layerCount = texture.dimension === "2d" ? 1 : texture.depth;
-    try {
-      for (let baseMipLevel = 1; baseMipLevel < texture.mipLevels; ++baseMipLevel) {
-        validateFormatCapabilities(device, texture, ["render", "filter"], "render");
-        const sourceMipLevel = baseMipLevel - 1;
-        const destinationWidth = Math.max(1, sourceWidth >> 1);
-        const destinationHeight = Math.max(1, sourceHeight >> 1);
-        const sourceView = texture.createView({
-          dimension: viewDimension,
-          baseMipLevel: sourceMipLevel,
-          mipLevelCount: 1,
-          baseArrayLayer: 0,
-          arrayLayerCount: texture.depth
-        });
-        model.setBindings({ sourceTexture: sourceView });
-        for (let baseArrayLayer = 0; baseArrayLayer < layerCount; ++baseArrayLayer) {
-          uniformValues[0] = baseArrayLayer;
-          uniformsBuffer.write(uniformValues);
-          const destinationView = texture.createView({
-            dimension: "2d",
-            baseMipLevel,
-            mipLevelCount: 1,
-            baseArrayLayer,
-            arrayLayerCount: 1
-          });
-          const framebuffer = device.createFramebuffer({
-            colorAttachments: [destinationView]
-          });
-          const renderPass = device.beginRenderPass({
-            id: `mipmap-generation:${texture.format}:${baseMipLevel}:${baseArrayLayer}`,
-            framebuffer
-          });
-          renderPass.setParameters({
-            viewport: [0, 0, destinationWidth, destinationHeight, 0, 1],
-            scissorRect: [0, 0, destinationWidth, destinationHeight]
-          });
-          model.draw(renderPass);
-          renderPass.end();
-          device.submit();
-          destinationView.destroy();
-          framebuffer.destroy();
-        }
-        sourceView.destroy();
-        sourceWidth = destinationWidth;
-        sourceHeight = destinationHeight;
-      }
-    } finally {
-      model.destroy();
-      sampler.destroy();
-      uniformsBuffer.destroy();
-    }
-  }
-  function getColorAttachmentFormat(format, path, dimension) {
-    if (import_core10.textureFormatDecoder.isColor(format)) {
-      return format;
-    }
-    throw new Error(
-      `Cannot run ${path} mipmap generation for ${dimension} texture with format "${format}". Only color textures can be used for this operation. Required capabilities: color. Actual capabilities: color=false.`
-    );
-  }
-  function generateMipmaps3D(device, texture) {
-    validateFormatCapabilities(device, texture, ["filter", "store"], "compute");
-    const format = getColorAttachmentFormat(texture.format, "compute", texture.dimension);
-    const shaderSource = get3DComputeMipmapWGSL(format);
-    const uniformsBuffer = device.createBuffer({
-      byteLength: 32,
-      usage: import_core10.Buffer.UNIFORM | import_core10.Buffer.COPY_DST
-    });
-    const uniformValues = new Uint32Array(8);
-    let sourceWidth = texture.width;
-    let sourceHeight = texture.height;
-    let sourceDepth = texture.depth;
-    try {
-      for (let destinationMipLevel = 1; destinationMipLevel < texture.mipLevels; ++destinationMipLevel) {
-        validateFormatCapabilities(device, texture, ["filter", "store"], "compute");
-        const destinationWidth = Math.max(1, sourceWidth >> 1);
-        const destinationHeight = Math.max(1, sourceHeight >> 1);
-        const destinationDepth = Math.max(1, sourceDepth >> 1);
-        uniformValues[0] = sourceWidth;
-        uniformValues[1] = sourceHeight;
-        uniformValues[2] = sourceDepth;
-        uniformValues[3] = destinationWidth;
-        uniformValues[4] = destinationHeight;
-        uniformValues[5] = destinationDepth;
-        uniformValues[6] = 0;
-        uniformsBuffer.write(uniformValues);
-        const sourceView = texture.createView({
-          dimension: "3d",
-          baseMipLevel: destinationMipLevel - 1,
-          mipLevelCount: 1,
-          baseArrayLayer: 0,
-          arrayLayerCount: 1
-        });
-        const destinationView = texture.createView({
-          dimension: "3d",
-          baseMipLevel: destinationMipLevel,
-          mipLevelCount: 1,
-          baseArrayLayer: 0,
-          arrayLayerCount: 1
-        });
-        const computation = new Computation(device, {
-          source: shaderSource,
-          shaderLayout: {
-            bindings: [
-              {
-                type: "texture",
-                name: "sourceTexture",
-                group: 0,
-                location: 0,
-                viewDimension: "3d",
-                sampleType: "float"
-              },
-              {
-                type: "storage",
-                name: "destinationTexture",
-                group: 0,
-                location: 1,
-                format,
-                viewDimension: "3d",
-                access: "write-only"
-              },
-              { type: "uniform", name: "uniforms", group: 0, location: 2 }
-            ]
-          },
-          bindings: {
-            sourceTexture: sourceView,
-            destinationTexture: destinationView,
-            uniforms: uniformsBuffer
-          }
-        });
-        const workgroupsX = Math.ceil(destinationWidth / WORKGROUP_SIZE.x);
-        const workgroupsY = Math.ceil(destinationHeight / WORKGROUP_SIZE.y);
-        const workgroupsZ = Math.ceil(destinationDepth / WORKGROUP_SIZE.z);
-        const computePass = device.beginComputePass({});
-        computation.dispatch(computePass, workgroupsX, workgroupsY, workgroupsZ);
-        computePass.end();
-        device.submit();
-        computation.destroy();
-        sourceView.destroy();
-        destinationView.destroy();
-        sourceWidth = destinationWidth;
-        sourceHeight = destinationHeight;
-        sourceDepth = destinationDepth;
-      }
-    } finally {
-      uniformsBuffer.destroy();
-    }
-  }
-  function validateFormatCapabilities(device, texture, requiredCapabilities, path) {
-    const { format, dimension } = texture;
-    const capabilities = device.getTextureFormatCapabilities(format);
-    const missingCapabilities = requiredCapabilities.filter((capability) => !capabilities[capability]);
-    if (missingCapabilities.length > 0) {
-      const required = requiredCapabilities.join(" + ");
-      const actual = requiredCapabilities.map((capability) => `${capability}=${capabilities[capability]}`).join(", ");
-      throw new Error(
-        `Cannot run ${path} mipmap generation for ${dimension} texture with format "${format}". Required capabilities: ${required}. Actual capabilities: ${actual}.`
-      );
-    }
-  }
-  function getSourceTextureType(dimension) {
-    switch (dimension) {
-      case "2d":
-        return "texture_2d<f32>";
-      case "2d-array":
-        return "texture_2d_array<f32>";
-      case "cube":
-        return "texture_cube<f32>";
-      case "cube-array":
-        return "texture_cube_array<f32>";
-      default:
-        throw new Error(`Unsupported render dimension "${dimension}" for mipmap generation.`);
-    }
-  }
-  function getRenderMipmapWGSL(dimension) {
-    const sourceSnippet = getRenderMipmapSampleSnippet(dimension);
-    return `
-struct MipmapUniforms {
-  sourceLayer: u32,
-};
-
-fn _touchUniform(uniforms: MipmapUniforms) {
-  let unusedSourceLayer = uniforms.sourceLayer;
-}
-
-const faceMat = array(
-  mat3x3f(
-    0.0,  0.0,  -2.0,
-    0.0, -2.0,   0.0,
-    1.0,  1.0,   1.0
-  ),  // pos-x
-  mat3x3f(
-    0.0,  0.0,   2.0,
-    0.0, -2.0,   0.0,
-    -1.0,  1.0,  -1.0
-  ),  // neg-x
-  mat3x3f(
-    2.0,  0.0,   0.0,
-    0.0,  0.0,   2.0,
-    -1.0,  1.0,  -1.0
-  ),  // pos-y
-  mat3x3f(
-    2.0,  0.0,   0.0,
-    0.0,  0.0,  -2.0,
-    -1.0, -1.0,   1.0
-  ),  // neg-y
-  mat3x3f(
-    2.0,  0.0,   0.0,
-    0.0, -2.0,   0.0,
-    -1.0,  1.0,   1.0
-  ),  // pos-z
-  mat3x3f(
-    -2.0, 0.0,   0.0,
-    0.0, -2.0,   0.0,
-    1.0,   1.0,  -1.0
-  )   // neg-z
-);
-
-struct FragmentInputs {
-  @builtin(position) position: vec4f,
-  @location(0) texcoord: vec2f
-};
-
-struct VertexOutput {
-  @builtin(position) position: vec4f,
-  @location(0) texcoord: vec2f
-};
-
-@group(0) @binding(0) var sourceSampler: sampler;
-@group(0) @binding(1) var sourceTexture: ${getSourceTextureType(dimension)};
-@group(0) @binding(2) var<uniform> uniforms: MipmapUniforms;
-
-@vertex
-fn vertexMain(
-  @builtin(vertex_index) vertexIndex: u32
-) -> VertexOutput {
-  const positions = array(
-    vec2f(-1.0, -1.0),
-    vec2f(-1.0,  3.0),
-    vec2f( 3.0, -1.0)
-  );
-
-  let xy = positions[vertexIndex];
-  return VertexOutput(
-    vec4f(xy, 0.0, 1.0),
-    xy * vec2f(0.5, -0.5) + vec2f(0.5)
-  );
-}
-
-@fragment
-fn fragmentMain(fsInput: VertexOutput) -> @location(0) vec4f {
-  _touchUniform(uniforms);
-  return ${sourceSnippet};
-}
-`;
-  }
-  function getRenderMipmapSampleSnippet(dimension) {
-    const layer = "uniforms.sourceLayer";
-    switch (dimension) {
-      case "2d":
-        return "textureSampleLevel(sourceTexture, sourceSampler, fsInput.texcoord, 0.0)";
-      case "2d-array":
-        return `textureSampleLevel(sourceTexture, sourceSampler, fsInput.texcoord, i32(${layer}), 0.0)`;
-      case "cube":
-        return `textureSampleLevel(sourceTexture, sourceSampler, faceMat[i32(${layer})] * vec3f(fract(fsInput.texcoord), 1.0), 0.0)`;
-      case "cube-array":
-        return `textureSampleLevel(sourceTexture, sourceSampler, faceMat[i32(${layer} % 6u)] * vec3f(fract(fsInput.texcoord), 1.0), i32(${layer} / 6u), 0.0)`;
-      default:
-        throw new Error(`Unsupported render dimension "${dimension}" for mipmap generation.`);
-    }
-  }
-  function get3DComputeMipmapWGSL(format) {
-    return `
-struct MipmapUniforms {
-  sourceWidth: u32,
-  sourceHeight: u32,
-  sourceDepth: u32,
-  destinationWidth: u32,
-  destinationHeight: u32,
-  destinationDepth: u32,
-  padding: u32,
-};
-
-@group(0) @binding(0) var sourceTexture: texture_3d<f32>;
-@group(0) @binding(1) var destinationTexture: texture_storage_3d<${format}, write>;
-@group(0) @binding(2) var<uniform> uniforms: MipmapUniforms;
-
-@compute @workgroup_size(${WORKGROUP_SIZE.x}, ${WORKGROUP_SIZE.y}, ${WORKGROUP_SIZE.z})
-fn main(@builtin(global_invocation_id) id: vec3<u32>) {
-  if (
-    id.x >= uniforms.destinationWidth ||
-    id.y >= uniforms.destinationHeight ||
-    id.z >= uniforms.destinationDepth
-  ) {
-    return;
-  }
-
-  let sourceBase = id * 2u;
-  let sourceX0 = min(sourceBase.x, uniforms.sourceWidth - 1u);
-  let sourceY0 = min(sourceBase.y, uniforms.sourceHeight - 1u);
-  let sourceZ0 = min(sourceBase.z, uniforms.sourceDepth - 1u);
-
-  let sourceX1 = min(sourceBase.x + 1u, uniforms.sourceWidth - 1u);
-  let sourceY1 = min(sourceBase.y + 1u, uniforms.sourceHeight - 1u);
-  let sourceZ1 = min(sourceBase.z + 1u, uniforms.sourceDepth - 1u);
-
-  var sum = textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX0), i32(sourceY0), i32(sourceZ0)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX1), i32(sourceY0), i32(sourceZ0)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX0), i32(sourceY1), i32(sourceZ0)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX1), i32(sourceY1), i32(sourceZ0)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX0), i32(sourceY0), i32(sourceZ1)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX1), i32(sourceY0), i32(sourceZ1)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX0), i32(sourceY1), i32(sourceZ1)),
-    0
-  );
-  sum += textureLoad(
-    sourceTexture,
-    vec3<i32>(i32(sourceX1), i32(sourceY1), i32(sourceZ1)),
-    0
-  );
-
-  textureStore(
-    destinationTexture,
-    vec3<i32>(i32(id.x), i32(id.y), i32(id.z)),
-    vec4<f32>(sum.xyz / 8.0, sum.w / 8.0)
-  );
-}
-`;
-  }
-
   // src/dynamic-texture/dynamic-texture.ts
   var _DynamicTexture = class {
     device;
@@ -2422,6 +1878,9 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       try {
         const propsWithSyncData = await this._loadAllData(originalPropsWithAsyncData);
         this._checkNotDestroyed();
+        const subresources = propsWithSyncData.data ? getTextureSubresources(propsWithSyncData) : [];
+        const userProvidedFormat = "format" in originalPropsWithAsyncData && originalPropsWithAsyncData.format !== void 0;
+        const userProvidedUsage = "usage" in originalPropsWithAsyncData && originalPropsWithAsyncData.usage !== void 0;
         const deduceSize = () => {
           if (this.props.width && this.props.height) {
             return { width: this.props.width, height: this.props.height };
@@ -2436,54 +1895,44 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
         if (!size || size.width <= 0 || size.height <= 0) {
           throw new Error(`${this} size could not be determined or was zero`);
         }
+        const textureData = analyzeTextureSubresources(this.device, subresources, size, {
+          format: userProvidedFormat ? originalPropsWithAsyncData.format : void 0
+        });
+        const resolvedFormat = textureData.format ?? this.props.format;
         const baseTextureProps = {
           ...this.props,
           ...size,
+          format: resolvedFormat,
           mipLevels: 1,
           // temporary; updated below
           data: void 0
         };
-        if (this.device.type === "webgpu" && this.props.mipmaps) {
-          const requiredUsage = this.props.dimension === "3d" ? import_core11.Texture.SAMPLE | import_core11.Texture.STORAGE | import_core11.Texture.COPY_DST | import_core11.Texture.COPY_SRC : import_core11.Texture.SAMPLE | import_core11.Texture.RENDER | import_core11.Texture.COPY_DST | import_core11.Texture.COPY_SRC;
+        if (this.device.isTextureFormatCompressed(resolvedFormat) && !userProvidedUsage) {
+          baseTextureProps.usage = import_core9.Texture.SAMPLE | import_core9.Texture.COPY_DST;
+        }
+        const shouldGenerateMipmaps = this.props.mipmaps && !textureData.hasExplicitMipChain && !this.device.isTextureFormatCompressed(resolvedFormat);
+        if (this.device.type === "webgpu" && shouldGenerateMipmaps) {
+          const requiredUsage = this.props.dimension === "3d" ? import_core9.Texture.SAMPLE | import_core9.Texture.STORAGE | import_core9.Texture.COPY_DST | import_core9.Texture.COPY_SRC : import_core9.Texture.SAMPLE | import_core9.Texture.RENDER | import_core9.Texture.COPY_DST | import_core9.Texture.COPY_SRC;
           baseTextureProps.usage |= requiredUsage;
         }
         const maxMips = this.device.getMipLevelCount(baseTextureProps.width, baseTextureProps.height);
-        const desired = this.props.mipLevels === "auto" ? maxMips : Math.max(1, Math.min(maxMips, this.props.mipLevels ?? 1));
+        const desired = textureData.hasExplicitMipChain ? textureData.mipLevels : this.props.mipLevels === "auto" ? maxMips : Math.max(1, Math.min(maxMips, this.props.mipLevels ?? 1));
         const finalTextureProps = { ...baseTextureProps, mipLevels: desired };
         this._texture = this.device.createTexture(finalTextureProps);
         this._sampler = this.texture.sampler;
         this._view = this.texture.view;
-        if (propsWithSyncData.data) {
-          switch (propsWithSyncData.dimension) {
-            case "1d":
-              this.setTexture1DData(propsWithSyncData.data);
-              break;
-            case "2d":
-              this.setTexture2DData(propsWithSyncData.data);
-              break;
-            case "3d":
-              this.setTexture3DData(propsWithSyncData.data);
-              break;
-            case "2d-array":
-              this.setTextureArrayData(propsWithSyncData.data);
-              break;
-            case "cube":
-              this.setTextureCubeData(propsWithSyncData.data);
-              break;
-            case "cube-array":
-              this.setTextureCubeArrayData(propsWithSyncData.data);
-              break;
-            default: {
-              throw new Error(`Unhandled dimension ${propsWithSyncData.dimension}`);
-            }
-          }
+        if (textureData.subresources.length) {
+          this._setTextureSubresources(textureData.subresources);
         }
-        if (this.props.mipmaps) {
+        if (this.props.mipmaps && !textureData.hasExplicitMipChain && !shouldGenerateMipmaps) {
+          import_core9.log.warn(`${this} skipping auto-generated mipmaps for compressed texture format`)();
+        }
+        if (shouldGenerateMipmaps) {
           this.generateMipmaps();
         }
         this.isReady = true;
         this.resolveReady(this.texture);
-        import_core11.log.info(0, `${this} created`)();
+        import_core9.log.info(0, `${this} created`)();
       } catch (e) {
         const err = e instanceof Error ? e : new Error(String(e));
         this.rejectReady(err);
@@ -2503,15 +1952,15 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       if (this.device.type === "webgl") {
         this.texture.generateMipmapsWebGL();
       } else if (this.device.type === "webgpu") {
-        generateMipmap(this.device, this.texture);
+        this.device.generateMipmapsWebGPU(this.texture);
       } else {
-        import_core11.log.warn(`${this} mipmaps not supported on ${this.device.type}`);
+        import_core9.log.warn(`${this} mipmaps not supported on ${this.device.type}`);
       }
     }
     /** Set sampler or create one from props */
     setSampler(sampler = {}) {
       this._checkReady();
-      const s = sampler instanceof import_core11.Sampler ? sampler : this.device.createSampler(sampler);
+      const s = sampler instanceof import_core9.Sampler ? sampler : this.device.createSampler(sampler);
       this.texture.setSampler(s);
       this._sampler = s;
     }
@@ -2529,7 +1978,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       this._sampler = this.texture.sampler;
       this._view = this.texture.view;
       prev.destroy();
-      import_core11.log.info(`${this} resized`);
+      import_core9.log.info(`${this} resized`);
       return true;
     }
     /** Convert cube face label to texture slice index. Index can be used with `setTexture2DData()`. */
@@ -2603,8 +2052,13 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
             this.texture.copyExternalImage({ image, z, mipLevel, flipY });
             break;
           case "texture-data":
-            const { data } = subresource;
-            this.texture.writeData(getAlignedUploadData(this.texture, data), {
+            const { data, textureFormat } = subresource;
+            if (textureFormat && textureFormat !== this.texture.format) {
+              throw new Error(
+                `${this} mip level ${mipLevel} uses format "${textureFormat}" but texture format is "${this.texture.format}"`
+              );
+            }
+            this.texture.writeData(data.data, {
               x: 0,
               y: 0,
               z,
@@ -2628,45 +2082,155 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     }
     _checkNotDestroyed() {
       if (this.destroyed) {
-        import_core11.log.warn(`${this} already destroyed`);
+        import_core9.log.warn(`${this} already destroyed`);
       }
     }
     _checkReady() {
       if (!this.isReady) {
-        import_core11.log.warn(`${this} Cannot perform this operation before ready`);
+        import_core9.log.warn(`${this} Cannot perform this operation before ready`);
       }
     }
   };
   var DynamicTexture = _DynamicTexture;
   __publicField(DynamicTexture, "defaultProps", {
-    ...import_core11.Texture.defaultProps,
+    ...import_core9.Texture.defaultProps,
     dimension: "2d",
     data: null,
     mipmaps: false
   });
-  function getAlignedUploadData(texture, data) {
-    const { width, height, data: uploadData } = data;
-    const { bytesPerPixel } = texture.device.getTextureFormatInfo(texture.format);
-    const bytesPerRow = width * bytesPerPixel;
-    const alignedBytesPerRow = Math.ceil(bytesPerRow / texture.byteAlignment) * texture.byteAlignment;
-    if (alignedBytesPerRow === bytesPerRow) {
-      return uploadData;
-    }
-    const sourceBytes = new Uint8Array(
-      uploadData.buffer,
-      uploadData.byteOffset,
-      uploadData.byteLength
-    );
-    const paddedBytes = new Uint8Array(alignedBytesPerRow * height);
-    for (let row = 0; row < height; row++) {
-      const sourceOffset = row * bytesPerRow;
-      const destinationOffset = row * alignedBytesPerRow;
-      paddedBytes.set(
-        sourceBytes.subarray(sourceOffset, sourceOffset + bytesPerRow),
-        destinationOffset
+  function getTextureSubresources(props) {
+    if (!props.data) {
+      return [];
+    }
+    switch (props.dimension) {
+      case "1d":
+        return getTexture1DSubresources(props.data);
+      case "2d":
+        return getTexture2DSubresources(0, props.data);
+      case "3d":
+        return getTexture3DSubresources(props.data);
+      case "2d-array":
+        return getTextureArraySubresources(props.data);
+      case "cube":
+        return getTextureCubeSubresources(props.data);
+      case "cube-array":
+        return getTextureCubeArraySubresources(props.data);
+      default:
+        throw new Error(`Unhandled dimension ${props.dimension}`);
+    }
+  }
+  function analyzeTextureSubresources(device, subresources, size, options) {
+    if (subresources.length === 0) {
+      return {
+        subresources,
+        mipLevels: 1,
+        format: options.format,
+        hasExplicitMipChain: false
+      };
+    }
+    const groupedSubresources = /* @__PURE__ */ new Map();
+    for (const subresource of subresources) {
+      const group = groupedSubresources.get(subresource.z) ?? [];
+      group.push(subresource);
+      groupedSubresources.set(subresource.z, group);
+    }
+    const hasExplicitMipChain = subresources.some((subresource) => subresource.mipLevel > 0);
+    let resolvedFormat = options.format;
+    let resolvedMipLevels = Number.POSITIVE_INFINITY;
+    const validSubresources = [];
+    for (const [z, sliceSubresources] of groupedSubresources) {
+      const sortedSubresources = [...sliceSubresources].sort(
+        (left, right) => left.mipLevel - right.mipLevel
       );
+      const baseLevel = sortedSubresources[0];
+      if (!baseLevel || baseLevel.mipLevel !== 0) {
+        throw new Error(`DynamicTexture: slice ${z} is missing mip level 0`);
+      }
+      const baseSize = getTextureSubresourceSize(device, baseLevel);
+      if (baseSize.width !== size.width || baseSize.height !== size.height) {
+        throw new Error(
+          `DynamicTexture: slice ${z} base level dimensions ${baseSize.width}x${baseSize.height} do not match expected ${size.width}x${size.height}`
+        );
+      }
+      const baseFormat = getTextureSubresourceFormat(baseLevel);
+      if (baseFormat) {
+        if (resolvedFormat && resolvedFormat !== baseFormat) {
+          throw new Error(
+            `DynamicTexture: slice ${z} base level format "${baseFormat}" does not match texture format "${resolvedFormat}"`
+          );
+        }
+        resolvedFormat = baseFormat;
+      }
+      const mipLevelLimit = resolvedFormat && device.isTextureFormatCompressed(resolvedFormat) ? (
+        // Block-compressed formats cannot have mips smaller than a single compression block.
+        getMaxCompressedMipLevels(device, baseSize.width, baseSize.height, resolvedFormat)
+      ) : device.getMipLevelCount(baseSize.width, baseSize.height);
+      let validMipLevelsForSlice = 0;
+      for (let expectedMipLevel = 0; expectedMipLevel < sortedSubresources.length; expectedMipLevel++) {
+        const subresource = sortedSubresources[expectedMipLevel];
+        if (!subresource || subresource.mipLevel !== expectedMipLevel) {
+          break;
+        }
+        if (expectedMipLevel >= mipLevelLimit) {
+          break;
+        }
+        const subresourceSize = getTextureSubresourceSize(device, subresource);
+        const expectedWidth = Math.max(1, baseSize.width >> expectedMipLevel);
+        const expectedHeight = Math.max(1, baseSize.height >> expectedMipLevel);
+        if (subresourceSize.width !== expectedWidth || subresourceSize.height !== expectedHeight) {
+          break;
+        }
+        const subresourceFormat = getTextureSubresourceFormat(subresource);
+        if (subresourceFormat) {
+          if (!resolvedFormat) {
+            resolvedFormat = subresourceFormat;
+          }
+          if (subresourceFormat !== resolvedFormat) {
+            break;
+          }
+        }
+        validMipLevelsForSlice++;
+        validSubresources.push(subresource);
+      }
+      resolvedMipLevels = Math.min(resolvedMipLevels, validMipLevelsForSlice);
+    }
+    const mipLevels = Number.isFinite(resolvedMipLevels) ? Math.max(1, resolvedMipLevels) : 1;
+    return {
+      // Keep every slice trimmed to the same mip count so the texture shape stays internally consistent.
+      subresources: validSubresources.filter((subresource) => subresource.mipLevel < mipLevels),
+      mipLevels,
+      format: resolvedFormat,
+      hasExplicitMipChain
+    };
+  }
+  function getTextureSubresourceFormat(subresource) {
+    if (subresource.type !== "texture-data") {
+      return void 0;
+    }
+    return subresource.textureFormat ?? resolveTextureImageFormat(subresource.data);
+  }
+  function getTextureSubresourceSize(device, subresource) {
+    switch (subresource.type) {
+      case "external-image":
+        return device.getExternalImageSize(subresource.image);
+      case "texture-data":
+        return { width: subresource.data.width, height: subresource.data.height };
+      default:
+        throw new Error("Unsupported texture subresource");
     }
-    return paddedBytes;
+  }
+  function getMaxCompressedMipLevels(device, baseWidth, baseHeight, format) {
+    const { blockWidth = 1, blockHeight = 1 } = device.getTextureFormatInfo(format);
+    let mipLevels = 1;
+    for (let mipLevel = 1; ; mipLevel++) {
+      const width = Math.max(1, baseWidth >> mipLevel);
+      const height = Math.max(1, baseHeight >> mipLevel);
+      if (width < blockWidth || height < blockHeight) {
+        break;
+      }
+      mipLevels++;
+    }
+    return mipLevels;
   }
   async function awaitAllPromises(x) {
     x = await x;
@@ -2687,8 +2251,8 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
   }
 
   // src/model/model.ts
-  var LOG_DRAW_PRIORITY2 = 2;
-  var LOG_DRAW_TIMEOUT2 = 1e4;
+  var LOG_DRAW_PRIORITY = 2;
+  var LOG_DRAW_TIMEOUT = 1e4;
   var _Model = class {
     /** Device that created this model */
     device;
@@ -2771,7 +2335,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       );
       const shaderInputs = props.shaderInputs || new ShaderInputs(moduleMap, { disableWarnings: this.props.disableWarnings });
       this.setShaderInputs(shaderInputs);
-      const platformInfo = getPlatformInfo2(device);
+      const platformInfo = getPlatformInfo(device);
       const modules = (
         // @ts-ignore shaderInputs is assigned in setShaderInputs above.
         (this.props.modules?.length > 0 ? this.props.modules : this.shaderInputs?.getModules()) || []
@@ -2843,7 +2407,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       if (!this._destroyed) {
         this.pipelineFactory.release(this.pipeline);
         this.shaderFactory.release(this.pipeline.vs);
-        if (this.pipeline.fs) {
+        if (this.pipeline.fs && this.pipeline.fs !== this.pipeline.vs) {
           this.shaderFactory.release(this.pipeline.fs);
         }
         this._uniformStore.destroy();
@@ -2878,7 +2442,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     draw(renderPass) {
       const loadingBinding = this._areBindingsLoading();
       if (loadingBinding) {
-        import_core12.log.info(LOG_DRAW_PRIORITY2, `>>> DRAWING ABORTED ${this.id}: ${loadingBinding} not loaded`)();
+        import_core10.log.info(LOG_DRAW_PRIORITY, `>>> DRAWING ABORTED ${this.id}: ${loadingBinding} not loaded`)();
         return false;
       }
       try {
@@ -2893,9 +2457,6 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
         this._logDrawCallStart();
         this.pipeline = this._updatePipeline();
         const syncBindings = this._getBindings();
-        this.pipeline.setBindings(syncBindings, {
-          disableWarnings: this.props.disableWarnings
-        });
         const { indexBuffer } = this.vertexArray;
         const indexCount = indexBuffer ? indexBuffer.byteLength / (indexBuffer.indexType === "uint32" ? 4 : 2) : void 0;
         drawSuccess = this.pipeline.draw({
@@ -2906,6 +2467,11 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
           instanceCount: this.instanceCount,
           indexCount,
           transformFeedback: this.transformFeedback || void 0,
+          // Pipelines may be shared across models when caching is enabled, so bindings
+          // and WebGL uniforms must be supplied on every draw instead of being stored
+          // on the pipeline instance.
+          bindings: syncBindings,
+          uniforms: this.props.uniforms,
           // WebGL shares underlying cached pipelines even for models that have different parameters and topology,
           // so we must provide our unique parameters to each draw
           // (In WebGPU most parameters are encoded in the pipeline and cannot be changed per draw call)
@@ -3008,7 +2574,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     /** Set the shader inputs */
     setShaderInputs(shaderInputs) {
       this.shaderInputs = shaderInputs;
-      this._uniformStore = new import_core12.UniformStore(this.shaderInputs.modules);
+      this._uniformStore = new import_core10.UniformStore(this.shaderInputs.modules);
       for (const [moduleName, module] of Object.entries(this.shaderInputs.modules)) {
         if (shaderModuleHasUniforms(module)) {
           const uniformBuffer = this._uniformStore.getManagedUniformBuffer(this.device, moduleName);
@@ -3052,7 +2618,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     setAttributes(buffers, options) {
       const disableWarnings = options?.disableWarnings ?? this.props.disableWarnings;
       if (buffers["indices"]) {
-        import_core12.log.warn(
+        import_core10.log.warn(
           `Model:${this.id} setAttributes() - indexBuffer should be set using setIndexBuffer()`
         )();
       }
@@ -3065,7 +2631,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
         const bufferLayout = bufferLayoutHelper.getBufferLayout(bufferName);
         if (!bufferLayout) {
           if (!disableWarnings) {
-            import_core12.log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
+            import_core10.log.warn(`Model(${this.id}): Missing layout for buffer "${bufferName}".`)();
           }
           continue;
         }
@@ -3080,7 +2646,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
           }
         }
         if (!set && !disableWarnings) {
-          import_core12.log.warn(
+          import_core10.log.warn(
             `Model(${this.id}): Ignoring buffer "${buffer.id}" for unknown attribute "${bufferName}"`
           )();
         }
@@ -3101,7 +2667,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
         if (attributeInfo) {
           this.vertexArray.setConstantWebGL(attributeInfo.location, value);
         } else if (!(options?.disableWarnings ?? this.props.disableWarnings)) {
-          import_core12.log.warn(
+          import_core10.log.warn(
             `Model "${this.id}: Ignoring constant supplied for unknown attribute "${attributeName}"`
           )();
         }
@@ -3136,16 +2702,16 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     _getBindingsUpdateTimestamp() {
       let timestamp = 0;
       for (const binding of Object.values(this.bindings)) {
-        if (binding instanceof import_core12.TextureView) {
+        if (binding instanceof import_core10.TextureView) {
           timestamp = Math.max(timestamp, binding.texture.updateTimestamp);
-        } else if (binding instanceof import_core12.Buffer || binding instanceof import_core12.Texture) {
+        } else if (binding instanceof import_core10.Buffer || binding instanceof import_core10.Texture) {
           timestamp = Math.max(timestamp, binding.updateTimestamp);
         } else if (binding instanceof DynamicTexture) {
           timestamp = binding.texture ? Math.max(timestamp, binding.texture.updateTimestamp) : (
             // The texture will become available in the future
             Infinity
           );
-        } else if (!(binding instanceof import_core12.Sampler)) {
+        } else if (!(binding instanceof import_core10.Sampler)) {
           timestamp = Math.max(timestamp, binding.buffer.updateTimestamp);
         }
       }
@@ -3180,7 +2746,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
         let prevShaderVs = null;
         let prevShaderFs = null;
         if (this.pipeline) {
-          import_core12.log.log(
+          import_core10.log.log(
             1,
             `Model ${this.id}: Recreating pipeline because "${this._pipelineNeedsUpdate}".`
           )();
@@ -3216,14 +2782,15 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
           vs: vs3,
           fs: fs3
         });
-        this._attributeInfos = (0, import_core12.getAttributeInfosFromLayouts)(
+        this._attributeInfos = (0, import_core10.getAttributeInfosFromLayouts)(
           this.pipeline.shaderLayout,
           this.bufferLayout
         );
         if (prevShaderVs)
           this.shaderFactory.release(prevShaderVs);
-        if (prevShaderFs)
+        if (prevShaderFs && prevShaderFs !== prevShaderVs) {
           this.shaderFactory.release(prevShaderFs);
+        }
       }
       return this.pipeline;
     }
@@ -3231,24 +2798,24 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     _lastLogTime = 0;
     _logOpen = false;
     _logDrawCallStart() {
-      const logDrawTimeout = import_core12.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT2;
-      if (import_core12.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_core12.log.group(LOG_DRAW_PRIORITY2, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core12.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_core12.log.table(LOG_DRAW_PRIORITY2, shaderLayoutTable)();
+        import_core10.log.table(LOG_DRAW_PRIORITY, shaderLayoutTable)();
         const uniformTable = this.shaderInputs.getDebugTable();
-        import_core12.log.table(LOG_DRAW_PRIORITY2, uniformTable)();
+        import_core10.log.table(LOG_DRAW_PRIORITY, uniformTable)();
         const attributeTable = this._getAttributeDebugTable();
-        import_core12.log.table(LOG_DRAW_PRIORITY2, this._attributeInfos)();
-        import_core12.log.table(LOG_DRAW_PRIORITY2, attributeTable)();
-        import_core12.log.groupEnd(LOG_DRAW_PRIORITY2)();
+        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;
       }
     }
@@ -3287,14 +2854,14 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     }
     // TODO - fix typing of luma data types
     _getBufferOrConstantValues(attribute, dataType) {
-      const TypedArrayConstructor = (0, import_core12.getTypedArrayConstructor)(dataType);
-      const typedArray = attribute instanceof import_core12.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
+      const TypedArrayConstructor = (0, import_core10.getTypedArrayConstructor)(dataType);
+      const typedArray = attribute instanceof import_core10.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
       return typedArray.toString();
     }
   };
   var Model = _Model;
   __publicField(Model, "defaultProps", {
-    ...import_core12.RenderPipeline.defaultProps,
+    ...import_core10.RenderPipeline.defaultProps,
     source: void 0,
     vs: null,
     fs: null,
@@ -3307,6 +2874,8 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     indexBuffer: null,
     attributes: {},
     constantAttributes: {},
+    bindings: {},
+    uniforms: {},
     varyings: [],
     isInstanced: void 0,
     instanceCount: 0,
@@ -3315,14 +2884,14 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
     pipelineFactory: void 0,
     shaderFactory: void 0,
     transformFeedback: void 0,
-    shaderAssembler: import_shadertools3.ShaderAssembler.getDefaultShaderAssembler(),
+    shaderAssembler: import_shadertools2.ShaderAssembler.getDefaultShaderAssembler(),
     debugShaders: void 0,
     disableWarnings: void 0
   });
   function shaderModuleHasUniforms(module) {
     return Boolean(module.uniformTypes && !isObjectEmpty(module.uniformTypes));
   }
-  function getPlatformInfo2(device) {
+  function getPlatformInfo(device) {
     return {
       type: device.type,
       shaderLanguage: device.info.shadingLanguage,
@@ -3340,8 +2909,8 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
   }
 
   // src/compute/buffer-transform.ts
-  var import_core13 = __toESM(require_core(), 1);
-  var import_shadertools4 = __toESM(require_shadertools(), 1);
+  var import_core11 = __toESM(require_core(), 1);
+  var import_shadertools3 = __toESM(require_shadertools(), 1);
   var _BufferTransform = class {
     device;
     model;
@@ -3356,7 +2925,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       this.device = device;
       this.model = new Model(this.device, {
         id: props.id || "buffer-transform-model",
-        fs: props.fs || (0, import_shadertools4.getPassthroughFS)(),
+        fs: props.fs || (0, import_shadertools3.getPassthroughFS)(),
         topology: props.topology || "point-list",
         varyings: props.outputs || props.varyings,
         ...props
@@ -3402,7 +2971,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       if (!result) {
         throw new Error("BufferTransform#getBuffer");
       }
-      if (result instanceof import_core13.Buffer) {
+      if (result instanceof import_core11.Buffer) {
         return result.readAsync();
       }
       const { buffer, byteOffset = 0, byteLength = buffer.byteLength } = result;
@@ -3417,7 +2986,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
   });
 
   // src/compute/texture-transform.ts
-  var import_shadertools5 = __toESM(require_shadertools(), 1);
+  var import_shadertools4 = __toESM(require_shadertools(), 1);
   var FS_OUTPUT_VARIABLE = "transform_output";
   var TextureTransform = class {
     device;
@@ -3440,7 +3009,7 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
       });
       this.model = new Model(this.device, {
         id: props.id || uid("texture-transform-model"),
-        fs: props.fs || (0, import_shadertools5.getPassthroughFS)({
+        fs: props.fs || (0, import_shadertools4.getPassthroughFS)({
           input: props.targetTextureVarying,
           inputChannels: props.targetTextureChannels,
           output: FS_OUTPUT_VARIABLE
@@ -3611,9 +3180,9 @@ fn main(@builtin(global_invocation_id) id: vec3<u32>) {
   var CLIPSPACE_VERTEX_SHADER_WGSL = (
     /* wgsl */
     `struct VertexInputs {
-  @location(0) clipSpacePosition: vec2<f32>,
-  @location(1) texCoord: vec2<f32>,
-  @location(2) coordinate: vec2<f32>  
+  @location(0) clipSpacePositions: vec2<f32>,
+  @location(1) texCoords: vec2<f32>,
+  @location(2) coordinates: vec2<f32>
 }
 
 struct FragmentInputs {
@@ -3626,10 +3195,10 @@ struct FragmentInputs {
 @vertex
 fn vertexMain(inputs: VertexInputs) -> FragmentInputs {
   var outputs: FragmentInputs;
-  outputs.Position = vec4(inputs.clipSpacePosition, 0., 1.);
-  outputs.position = inputs.clipSpacePosition;
-  outputs.coordinate = inputs.coordinate;
-  outputs.uv = inputs.texCoord;
+  outputs.Position = vec4(inputs.clipSpacePositions, 0., 1.);
+  outputs.position = inputs.clipSpacePositions;
+  outputs.coordinate = inputs.coordinates;
+  outputs.uv = inputs.texCoords;
   return outputs;
 }
 `
@@ -3695,15 +3264,15 @@ struct backgroundUniforms {
 };
 @group(0) @binding(2) var<uniform> background: backgroundUniforms;
 
-fn billboardTexture_getTextureUV(coordinates: vec2<f32>) -> vec2<f32> {
+fn billboardTexture_getTextureUV(uv: vec2<f32>) -> vec2<f32> {
         let scale: vec2<f32> = background.scale;
-        var position: vec2<f32> = (coordinates - vec2<f32>(0.5, 0.5)) / scale + vec2<f32>(0.5, 0.5);
+        var position: vec2<f32> = (uv - vec2<f32>(0.5, 0.5)) / scale + vec2<f32>(0.5, 0.5);
         return position;
 }
 
 @fragment
 fn fragmentMain(inputs: FragmentInputs) -> @location(0) vec4<f32> {
-        let position: vec2<f32> = billboardTexture_getTextureUV(inputs.coordinate);
+        let position: vec2<f32> = billboardTexture_getTextureUV(inputs.uv);
         return textureSample(backgroundTexture, backgroundTextureSampler, position);
 }
 `
@@ -3737,20 +3306,22 @@ void main(void) {
     backgroundTexture = null;
     constructor(device, props) {
       super(device, {
+        ...props,
         id: props.id || "background-texture-model",
         source: BACKGROUND_FS_WGSL,
         fs: BACKGROUND_FS,
-        modules: [backgroundModule],
+        modules: [...props.modules || [], backgroundModule],
         parameters: {
           depthWriteEnabled: false,
+          ...props.parameters || {},
           ...props.blend ? {
             blend: true,
             blendColorOperation: "add",
             blendAlphaOperation: "add",
-            blendColorSrcFactor: "one",
-            blendColorDstFactor: "one-minus-src",
-            blendAlphaSrcFactor: "one",
-            blendAlphaDstFactor: "one-minus-src-alpha"
+            blendColorSrcFactor: "one-minus-dst-alpha",
+            blendColorDstFactor: "one",
+            blendAlphaSrcFactor: "one-minus-dst-alpha",
+            blendAlphaDstFactor: "one"
           } : {}
         }
       });
@@ -5836,6 +5407,11 @@ void main(void) {
   }
 
   // src/scenegraph/scenegraph-node.ts
+  function assert2(condition, message) {
+    if (!condition) {
+      throw new Error(message);
+    }
+  }
   var ScenegraphNode = class {
     id;
     matrix = new Matrix4();
@@ -5867,14 +5443,17 @@ void main(void) {
       return `{type: ScenegraphNode, id: ${this.id})}`;
     }
     setPosition(position) {
+      assert2(position.length === 3, "setPosition requires vector argument");
       this.position = position;
       return this;
     }
     setRotation(rotation) {
+      assert2(rotation.length === 3 || rotation.length === 4, "setRotation requires vector argument");
       this.rotation = rotation;
       return this;
     }
     setScale(scale2) {
+      assert2(scale2.length === 3, "setScale requires vector argument");
       this.scale = scale2;
       return this;
     }
@@ -5902,17 +5481,18 @@ void main(void) {
       return this;
     }
     updateMatrix() {
-      const pos = this.position;
-      const rot = this.rotation;
-      const scale2 = this.scale;
       this.matrix.identity();
-      this.matrix.translate(pos);
-      this.matrix.rotateXYZ(rot);
-      this.matrix.scale(scale2);
+      this.matrix.translate(this.position);
+      if (this.rotation.length === 4) {
+        const rotationMatrix = new Matrix4().fromQuaternion(this.rotation);
+        this.matrix.multiplyRight(rotationMatrix);
+      } else {
+        this.matrix.rotateXYZ(this.rotation);
+      }
+      this.matrix.scale(this.scale);
       return this;
     }
-    update(options = {}) {
-      const { position, rotation, scale: scale2 } = options;
+    update({ position, rotation, scale: scale2 } = {}) {
       if (position) {
         this.setPosition(position);
       }
@@ -5962,16 +5542,17 @@ void main(void) {
       }
       */
     _setScenegraphNodeProps(props) {
-      if ("position" in props) {
+      if (props?.position) {
         this.setPosition(props.position);
       }
-      if ("rotation" in props) {
+      if (props?.rotation) {
         this.setRotation(props.rotation);
       }
-      if ("scale" in props) {
+      if (props?.scale) {
         this.setScale(props.scale);
       }
-      if ("matrix" in props) {
+      this.updateMatrix();
+      if (props?.matrix) {
         this.setMatrix(props.matrix);
       }
       Object.assign(this.props, props);
@@ -5979,13 +5560,13 @@ void main(void) {
   };
 
   // src/scenegraph/group-node.ts
-  var import_core16 = __toESM(require_core(), 1);
+  var import_core14 = __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_core14.log.assert(
         children.every((child) => child instanceof ScenegraphNode),
         "every child must an instance of ScenegraphNode"
       );
@@ -6058,6 +5639,17 @@ void main(void) {
         }
       }
     }
+    preorderTraversal(visitor, { worldMatrix = new Matrix4() } = {}) {
+      const modelMatrix = new Matrix4(worldMatrix).multiplyRight(this.matrix);
+      visitor(this, { worldMatrix: modelMatrix });
+      for (const child of this.children) {
+        if (child instanceof GroupNode) {
+          child.preorderTraversal(visitor, { worldMatrix: modelMatrix });
+        } else {
+          visitor(child, { worldMatrix: modelMatrix });
+        }
+      }
+    }
   };
 
   // src/scenegraph/model-node.ts
@@ -7226,10 +6818,10 @@ void main(void) {
   }
 
   // src/passes/shader-pass-renderer.ts
-  var import_shadertools6 = __toESM(require_shadertools(), 1);
+  var import_shadertools5 = __toESM(require_shadertools(), 1);
 
   // src/compute/swap.ts
-  var import_core18 = __toESM(require_core(), 1);
+  var import_core16 = __toESM(require_core(), 1);
   var Swap = class {
     id;
     /** The current resource - usually the source for renders or computations */
@@ -7261,7 +6853,7 @@ void main(void) {
         (colorAttachment) => typeof colorAttachment !== "string" ? colorAttachment : device.createTexture({
           id: `${props.id}-texture-0`,
           format: colorAttachment,
-          usage: import_core18.Texture.SAMPLE | import_core18.Texture.RENDER | import_core18.Texture.COPY_SRC | import_core18.Texture.COPY_DST,
+          usage: import_core16.Texture.SAMPLE | import_core16.Texture.RENDER | import_core16.Texture.COPY_SRC | import_core16.Texture.COPY_DST,
           width,
           height
         })
@@ -7271,7 +6863,7 @@ void main(void) {
         (colorAttachment) => typeof colorAttachment !== "string" ? colorAttachment : device.createTexture({
           id: `${props.id}-texture-1`,
           format: colorAttachment,
-          usage: import_core18.Texture.SAMPLE | import_core18.Texture.RENDER | import_core18.Texture.COPY_SRC | import_core18.Texture.COPY_DST,
+          usage: import_core16.Texture.SAMPLE | import_core16.Texture.RENDER | import_core16.Texture.COPY_SRC | import_core16.Texture.COPY_DST,
           width,
           height
         })
@@ -7335,26 +6927,16 @@ void main(void) {
   function getFilterShaderWGSL(func) {
     return (
       /* wgsl */
-      `// Binding 0:1 is reserved for shader passes
-// @group(0) @binding(0) var<uniform> brightnessContrast : brightnessContrastUniforms;
-@group(0) @binding(1) var texture: texture_2d<f32>;
-@group(0) @binding(2) var textureSampler: sampler;
-
-// This needs to be aligned with
-// struct FragmentInputs {
-//   @location(0) fragUV: vec2f,
-//   @location(1) fragPosition: vec4f,
-//   @location(2) fragCoordinate: vec4f
-// };
+      `@group(0) @binding(0) var sourceTexture: texture_2d<f32>;
+@group(0) @binding(2) var sourceTextureSampler: sampler;
 
 @fragment
 fn fragmentMain(inputs: FragmentInputs) -> @location(0) vec4f {
-  let fragUV = inputs.uv;
-  let fragCoordinate = inputs.coordinate;
-  let texSize = vec2f(textureDimensions(texture, 0));
+  let texCoord = inputs.coordinate;
+  let texSize = vec2f(textureDimensions(sourceTexture));
 
-  var fragColor = textureSample(texture, textureSampler, fragUV);
-  fragColor = ${func}(fragColor, texSize, fragCoordinate);
+  var fragColor = textureSample(sourceTexture, sourceTextureSampler, texCoord);
+  fragColor = ${func}(fragColor, texSize, texCoord);
   return fragColor;
 }
 `
@@ -7363,23 +6945,14 @@ fn fragmentMain(inputs: FragmentInputs) -> @location(0) vec4f {
   function getSamplerShaderWGSL(func) {
     return (
       /* wgsl */
-      `// Binding 0:1 is reserved for shader passes
-@group(0) @binding(0) var<uniform> brightnessContrast : brightnessContrastUniforms;
-@group(0) @binding(1) var texture: texture_2d<f32>;
-@group(0) @binding(2) var sampler: sampler;
-
-struct FragmentInputs = {
-  @location(0) fragUV: vec2f,
-  @location(1) fragPosition: vec4f,
-  @location(2) fragCoordinate: vec4f
-};
+      `@group(0) @binding(0) var sourceTexture: texture_2d<f32>;
+@group(0) @binding(2) var sourceTextureSampler: sampler;
 
 @fragment
 fn fragmentMain(inputs: FragmentInputs) -> @location(0) vec4f {
-  let texSize = vec2f(textureDimensions(texture, 0));
-  var fragColor = textureSample(texture, sampler, fragUV);
-  fragColor = ${func}(fragColor, texSize, texCoord);
-  return fragColor;
+  let texCoord = inputs.coordinate;
+  let texSize = vec2f(textureDimensions(sourceTexture));
+  return ${func}(sourceTexture, sourceTextureSampler, texSize, texCoord);
 }
 `
     );
@@ -7438,12 +7011,10 @@ void main() {
     shaderInputs;
     passRenderers;
     swapFramebuffers;
-    /** For rendering to the screen */
-    clipSpace;
     textureModel;
     constructor(device, props) {
       this.device = device;
-      props.shaderPasses.map((shaderPass) => (0, import_shadertools6.initializeShaderModule)(shaderPass));
+      props.shaderPasses.map((shaderPass) => (0, import_shadertools5.initializeShaderModule)(shaderPass));
       const modules = props.shaderPasses.reduce(
         (object, shaderPass) => ({ ...object, [shaderPass.name]: shaderPass }),
         {}
@@ -7458,33 +7029,6 @@ void main() {
       this.textureModel = new BackgroundTextureModel(device, {
         backgroundTexture: this.swapFramebuffers.current.colorAttachments[0].texture
       });
-      this.clipSpace = new ClipSpace(device, {
-        source: (
-          /* wgsl */
-          `  @group(0) @binding(0) var sourceTexture: texture_2d<f32>;
-  @group(0) @binding(1) var sourceTextureSampler: sampler;
-
-@fragment
-fn fragmentMain(inputs: FragmentInputs) -> @location(0) vec4<f32> {
-	let texCoord: vec2<f32> = inputs.coordinate;
-	return textureSample(sourceTexture, sourceTextureSampler, texCoord);
-}
-`
-        ),
-        fs: (
-          /* glsl */
-          `#version 300 es
-
-uniform sampler2D sourceTexture;
-in vec2 uv;
-out vec4 fragColor;
-
-void main() {
-  fragColor = texture(sourceTexture, uv);
-}
-`
-        )
-      });
       this.passRenderers = props.shaderPasses.map((shaderPass) => new PassRenderer(device, shaderPass));
     }
     /** Destroys resources created by this ShaderPassRenderer */
@@ -7493,7 +7037,6 @@ void main() {
         subPassRenderer.destroy();
       }
       this.swapFramebuffers.destroy();
-      this.clipSpace.destroy();
       this.textureModel.destroy();
     }
     resize(size) {
@@ -7505,15 +7048,15 @@ void main() {
       if (!outputTexture) {
         return false;
       }
-      const framebuffer = this.device.getDefaultCanvasContext().getCurrentFramebuffer({ depthStencilAttachment: false });
+      const framebuffer = this.device.getDefaultCanvasContext().getCurrentFramebuffer({ depthStencilFormat: false });
       const renderPass = this.device.beginRenderPass({
         id: "shader-pass-renderer-to-screen",
         framebuffer,
         // clearColor: [1, 1, 0, 1],
-        clearDepth: 1
+        clearDepth: false
       });
-      this.clipSpace.setBindings({ sourceTexture: outputTexture });
-      this.clipSpace.draw(renderPass);
+      this.textureModel.setProps({ backgroundTexture: outputTexture });
+      this.textureModel.draw(renderPass);
       renderPass.end();
       return true;
     }
@@ -7618,6 +7161,221 @@ void main() {
     }
   };
 
+  // src/compute/computation.ts
+  var import_core17 = __toESM(require_core(), 1);
+  var import_shadertools6 = __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 pipeline. */
+    pipeline;
+    /** Assembled compute shader source */
+    source;
+    /** the underlying compiled compute shader */
+    // @ts-ignore Set in function called from constructor
+    shader;
+    /** ShaderInputs instance */
+    shaderInputs;
+    // @ts-ignore Set in function called from constructor
+    _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 || uid("model");
+      this.device = device;
+      Object.assign(this.userData, props.userData);
+      const moduleMap = Object.fromEntries(
+        this.props.modules?.map((module) => [module.name, module]) || []
+      );
+      this.shaderInputs = props.shaderInputs || new ShaderInputs(moduleMap);
+      this.setShaderInputs(this.shaderInputs);
+      this.props.shaderLayout ||= device.getShaderLayout(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: source3, getUniforms: getUniforms2 } = this.props.shaderAssembler.assembleWGSLShader({
+        platformInfo,
+        ...this.props,
+        modules
+      });
+      this.source = source3;
+      this._getModuleUniforms = getUniforms2;
+      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_core17.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 !isNumericArray(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_core17.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,
+          debugShaders: 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_core17.log.level > 3 ? 0 : LOG_DRAW_TIMEOUT2;
+      if (import_core17.log.level < 2 || Date.now() - this._lastLogTime < logDrawTimeout) {
+        return;
+      }
+      this._lastLogTime = Date.now();
+      this._logOpen = true;
+      import_core17.log.group(LOG_DRAW_PRIORITY2, `>>> DRAWING MODEL ${this.id}`, { collapsed: import_core17.log.level <= 2 })();
+    }
+    _logDrawCallEnd() {
+      if (this._logOpen) {
+        const uniformTable = this.shaderInputs.getDebugTable();
+        import_core17.log.table(LOG_DRAW_PRIORITY2, uniformTable)();
+        import_core17.log.groupEnd(LOG_DRAW_PRIORITY2)();
+        this._logOpen = false;
+      }
+    }
+    _drawCount = 0;
+    // TODO - fix typing of luma data types
+    _getBufferOrConstantValues(attribute, dataType) {
+      const TypedArrayConstructor = (0, import_core17.getTypedArrayConstructor)(dataType);
+      const typedArray = attribute instanceof import_core17.Buffer ? new TypedArrayConstructor(attribute.debugData) : attribute;
+      return typedArray.toString();
+    }
+  };
+  var Computation = _Computation;
+  __publicField(Computation, "defaultProps", {
+    ...import_core17.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_shadertools6.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
+    };
+  }
+
   // src/modules/picking/picking-uniforms.ts
   var DEFAULT_HIGHLIGHT_COLOR = [0, 1, 1, 1];
   var INVALID_INDEX = -1;
@@ -7810,12 +7568,6 @@ const INDEX_PICKING_MODE_INSTANCE = 0;
 const INDEX_PICKING_MODE_CUSTOM = 1;
 const INDEX_PICKING_INVALID_INDEX = ${INVALID_INDEX}; // 2^32 - 1
 
-struct indexPickingFragmentInputs = {
-  objectIndex: int32;
-};
-
-let indexPickingFragmentInputs: indexPickingFragmentInputs;
-
 /**
  * Vertex shaders should call this function to set the object index.
  * If using instance or vertex mode, argument will be ignored, 0 can be supplied.