@ludicon/spark.js 0.1.0 → 0.1.2

package/dist/spark.esm.js

@@ -1,33 +1,43 @@
-const ge = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.wgsl": () => import("./spark_astc_rgb-DaSIMKXW.js"), "./spark_astc_rgba.wgsl": () => import("./spark_astc_rgba-BToA2Rcq.js"), "./spark_bc1_rgb.wgsl": () => import("./spark_bc1_rgb-DZwuM1tO.js"), "./spark_bc4_r.wgsl": () => import("./spark_bc4_r-DjThizCH.js"), "./spark_bc5_rg.wgsl": () => import("./spark_bc5_rg-6bO0Gvo9.js"), "./spark_bc7_rgb.wgsl": () => import("./spark_bc7_rgb-FXpBw9fE.js"), "./spark_bc7_rgba.wgsl": () => import("./spark_bc7_rgba-C8Hi2pUY.js"), "./spark_eac_r.wgsl": () => import("./spark_eac_r-D8HGiglc.js"), "./spark_eac_rg.wgsl": () => import("./spark_eac_rg-DvsrLP9h.js"), "./spark_etc2_rgb.wgsl": () => import("./spark_etc2_rgb-C-j5FZpn.js"), "./utils.wgsl": () => import("./utils-D_dYVlAC.js") }), Z = Object.fromEntries(
-  Object.entries(ge).map(([i, t]) => [i.replace("./", ""), async () => (await t()).default])
-);
-function O(i, t) {
-  if (!i)
+const Z = {
+  "spark_astc_rgb.wgsl": () => import("./spark_astc_rgb-DaSIMKXW.js").then((s) => s.default),
+  "spark_astc_rgba.wgsl": () => import("./spark_astc_rgba-BToA2Rcq.js").then((s) => s.default),
+  "spark_bc1_rgb.wgsl": () => import("./spark_bc1_rgb-DZwuM1tO.js").then((s) => s.default),
+  "spark_bc4_r.wgsl": () => import("./spark_bc4_r-DjThizCH.js").then((s) => s.default),
+  "spark_bc5_rg.wgsl": () => import("./spark_bc5_rg-6bO0Gvo9.js").then((s) => s.default),
+  "spark_bc7_rgb.wgsl": () => import("./spark_bc7_rgb-FXpBw9fE.js").then((s) => s.default),
+  "spark_bc7_rgba.wgsl": () => import("./spark_bc7_rgba-C8Hi2pUY.js").then((s) => s.default),
+  "spark_eac_r.wgsl": () => import("./spark_eac_r-D8HGiglc.js").then((s) => s.default),
+  "spark_eac_rg.wgsl": () => import("./spark_eac_rg-DvsrLP9h.js").then((s) => s.default),
+  "spark_etc2_rgb.wgsl": () => import("./spark_etc2_rgb-C-j5FZpn.js").then((s) => s.default),
+  "utils.wgsl": () => import("./utils-D_dYVlAC.js").then((s) => s.default)
+};
+function O(s, t) {
+  if (!s)
     throw new Error(t);
 }
 function he() {
-  const i = navigator.userAgent;
-  if (i.includes("Chrome") || i.includes("Chromium"))
+  const s = navigator.userAgent;
+  if (s.includes("Chrome") || s.includes("Chromium"))
     return null;
-  const t = i.match(/Safari\/(\d+(\.\d+)?)/);
+  const t = s.match(/Safari\/(\d+(\.\d+)?)/);
   return t && parseFloat(t[1]);
 }
 function J() {
-  const i = navigator.userAgent.match(/Firefox\/(\d+(\.\d+)?)/);
-  return i && parseFloat(i[1]);
+  const s = navigator.userAgent.match(/Firefox\/(\d+(\.\d+)?)/);
+  return s && parseFloat(s[1]);
 }
-function pe(i) {
-  return /\.svg(?:$|\?)/i.test(i) || /^data:image\/svg\+xml[,;]/i.test(i);
+function ge(s) {
+  return /\.svg(?:$|\?)/i.test(s) || /^data:image\/svg\+xml[,;]/i.test(s);
 }
-function ee(i) {
+function ee(s) {
   return new Promise((t, r) => {
     const e = new Image();
-    e.crossOrigin = "anonymous", e.decoding = "async", e.onload = () => t(e), e.onerror = r, e.src = i;
+    e.crossOrigin = "anonymous", e.decoding = "async", e.onload = () => t(e), e.onerror = r, e.src = s;
   });
 }
-async function _e(i, t = {}) {
-  const r = await fetch(i, { mode: "cors" });
-  if (!r.ok) throw new Error(`HTTP ${r.status} for ${i}`);
+async function pe(s, t = {}) {
+  const r = await fetch(s, { mode: "cors" });
+  if (!r.ok) throw new Error(`HTTP ${r.status} for ${s}`);
   const e = await r.blob();
   return createImageBitmap(e, {
     imageOrientation: t.flipY ? "flipY" : "none",
@@ -35,17 +45,17 @@ async function _e(i, t = {}) {
     premultiplyAlpha: "none"
   });
 }
-const j = he(), Te = 619.1, Ee = j && j < Te;
-async function be(i) {
+const K = he(), _e = 619.1, Te = K && K < _e;
+async function Ee(s) {
   const t = document.createElement("canvas");
-  return t.width = i.naturalWidth || i.width, t.height = i.naturalHeight || i.height, t.getContext("2d").drawImage(i, 0, 0), createImageBitmap(t);
+  return t.width = s.naturalWidth || s.width, t.height = s.naturalHeight || s.height, t.getContext("2d").drawImage(s, 0, 0), createImageBitmap(t);
 }
-async function K(i, t = {}) {
-  const r = pe(i);
-  if (r && Ee) {
-    const e = await ee(i);
-    return be(e);
-  } else return r || j ? ee(i) : _e(i, t);
+async function Q(s, t = {}) {
+  const r = ge(s);
+  if (r && Te) {
+    const e = await ee(s);
+    return Ee(e);
+  } else return r || K ? ee(s) : pe(s, t);
 }
 const a = {
   ASTC_4x4_RGB: 0,
@@ -113,7 +123,7 @@ const a = {
   /* 17 */
   "bc7-rgba"
   // BC7_RGBA
-], Re = [
+], be = [
   /* 0  */
   "spark_astc_rgb.wgsl",
   // ASTC_4x4_RGB
@@ -160,7 +170,7 @@ const a = {
   /* 17 */
   "spark_bc7_rgba.wgsl"
   // BC7_RGBA
-], Be = [
+], Re = [
   /* 0  */
   16,
   // ASTC_4x4_RGB
@@ -239,7 +249,7 @@ const a = {
   "eac-rg11unorm": a.EAC_RG,
   "astc-4x4-unorm": a.ASTC_4x4_RGBA,
   "astc-4x4-unorm-srgb": a.ASTC_4x4_RGBA
-}), xe = [
+}), Be = [
   /* 0  */
   "astc-4x4-unorm",
   // ASTC_4x4_RGB
@@ -286,7 +296,7 @@ const a = {
   /* 17 */
   "bc7-rgba-unorm"
   // BC7_RGB
-], Ge = [
+], xe = [
   /* 0  */
   !0,
   // ASTC_4x4_RGB
@@ -334,48 +344,48 @@ const a = {
   !0
   // BC7_RGB
 ];
-function Ce(i) {
-  return Ge[i];
+function Ge(s) {
+  return xe[s];
 }
-function Se(i) {
-  return i == a.ASTC_4x4_RGBA || i == a.BC7_RGBA;
+function Se(s) {
+  return s == a.ASTC_4x4_RGBA || s == a.BC7_RGBA;
 }
-function Pe(i) {
-  return typeof GPUDevice < "u" && i instanceof GPUDevice;
+function Ce(s) {
+  return typeof GPUDevice < "u" && s instanceof GPUDevice;
 }
-function Ae() {
+function Pe() {
   return ["iPad Simulator", "iPhone Simulator", "iPod Simulator", "iPad", "iPhone", "iPod"].includes(navigator.platform) || // iPad on iOS 13 detection
   navigator.userAgent.includes("Mac") && "ontouchend" in document;
 }
-function Ue(i) {
+function Ae(s) {
   const t = /* @__PURE__ */ new Set(), r = {
     "texture-compression-bc": [a.BC1_RG, a.BC4_R, a.BC5_RG, a.BC7_RGB, a.BC7_RGBA],
     "texture-compression-etc2": [a.ETC2_RGB, a.EAC_R, a.EAC_RG],
     "texture-compression-astc": [a.ASTC_4x4_RGB, a.ASTC_4x4_RGBA]
   };
-  for (const [e, s] of Object.entries(r))
-    if (i.features.has(e))
-      for (const o of s)
+  for (const [e, i] of Object.entries(r))
+    if (s.features.has(e))
+      for (const o of i)
         t.add(o);
   return t;
 }
-function we(i) {
+function Ue(s) {
   const t = document.createElement("canvas");
-  t.width = i.width, t.height = i.height;
+  t.width = s.width, t.height = s.height;
   const r = t.getContext("2d");
-  r.drawImage(i, 0, 0);
-  const e = r.getImageData(0, 0, i.width, i.height);
+  r.drawImage(s, 0, 0);
+  const e = r.getImageData(0, 0, s.width, s.height);
   return new Uint8Array(e.data.buffer);
 }
 const te = 256, re = 4;
-function ye(i, t, r, e) {
-  let s = 0, o = 0;
+function we(s, t, r, e) {
+  let i = 0, o = 0;
   const c = [];
   do {
-    const n = Math.ceil(i / 4), f = Math.ceil(t / 4), u = Math.ceil(n * r / te) * te, l = f * u;
-    s++, c.push({ offset: o, alignedSize: l, w: i, h: t, bw: n, bh: f, bytesPerRow: u }), o += l, i = Math.max(1, Math.floor(i / 2)), t = Math.max(1, Math.floor(t / 2));
-  } while (e && (i >= re || t >= re));
-  return { mipmapCount: s, outputSize: o, bufferRanges: c };
+    const n = Math.ceil(s / 4), f = Math.ceil(t / 4), u = Math.ceil(n * r / te) * te, l = f * u;
+    i++, c.push({ offset: o, alignedSize: l, w: s, h: t, bw: n, bh: f, bytesPerRow: u }), o += l, s = Math.max(1, Math.floor(s / 2)), t = Math.max(1, Math.floor(t / 2));
+  } while (e && (s >= re || t >= re));
+  return { mipmapCount: i, outputSize: o, bufferRanges: c };
 }
 class me {
   #e;
@@ -432,7 +442,7 @@ class me {
   #G(t) {
     this.#b && console.time(t);
   }
-  #C(t) {
+  #S(t) {
     this.#b && console.timeEnd(t);
   }
   /**
@@ -489,7 +499,7 @@ class me {
    */
   static getRequiredFeatures(t) {
     const r = [];
-    return !Ae() && t.features.has("texture-compression-bc") && r.push("texture-compression-bc"), t.features.has("texture-compression-etc2") && r.push("texture-compression-etc2"), t.features.has("texture-compression-astc") && r.push("texture-compression-astc"), t.features.has("shader-f16") && r.push("shader-f16"), t.features.has("timestamp-query") && r.push("timestamp-query"), r;
+    return !Pe() && t.features.has("texture-compression-bc") && r.push("texture-compression-bc"), t.features.has("texture-compression-etc2") && r.push("texture-compression-etc2"), t.features.has("texture-compression-astc") && r.push("texture-compression-astc"), t.features.has("shader-f16") && r.push("shader-f16"), t.features.has("timestamp-query") && r.push("timestamp-query"), r;
   }
   /**
    * Try to determine the best compression options automatically. Do not use this in production, this is
@@ -501,10 +511,10 @@ class me {
    */
   async selectPreferredOptions(t, r = {}) {
     if (r.format == null || r.format == "auto") {
-      const e = t instanceof Image || t instanceof ImageBitmap || t instanceof GPUTexture ? t : await K(t);
+      const e = t instanceof Image || t instanceof ImageBitmap || t instanceof GPUTexture ? t : await Q(t);
       r.format = "auto";
-      const s = await this.#A(r, e);
-      r.format = N[s], e instanceof GPUTexture && e.format.endsWith("-srgb") && (r.srgb = !0), (s == a.EAC_RG || s == a.BC5_RG) && (r.normal = !0);
+      const i = await this.#A(r, e);
+      r.format = N[i], e instanceof GPUTexture && e.format.endsWith("-srgb") && (r.srgb = !0), (i == a.EAC_RG || i == a.BC5_RG) && (r.normal = !0);
     }
     return r;
   }
@@ -554,21 +564,21 @@ class me {
    */
   async encodeTexture(t, r = {}) {
     O(this.#e, "Spark is not initialized");
-    const e = t instanceof Image || t instanceof ImageBitmap || t instanceof GPUTexture ? t : await K(t);
+    const e = t instanceof Image || t instanceof ImageBitmap || t instanceof GPUTexture ? t : await Q(t);
     this.#x("Loaded image", e);
-    const s = await this.#A(r, e), o = this.#S(s), c = Math.ceil(e.width / 4) * 4, n = Math.ceil(e.height / 4) * 4, f = Be[s], u = r.generateMipmaps || r.mips, { mipmapCount: l, outputSize: h, bufferRanges: m } = ye(c, n, f, u), R = (r.srgb || r.format?.endsWith("srgb")) && Ce(s);
+    const i = await this.#A(r, e), o = this.#C(i), c = Math.ceil(e.width / 4) * 4, n = Math.ceil(e.height / 4) * 4, f = Re[i], u = r.generateMipmaps || r.mips, { mipmapCount: l, outputSize: h, bufferRanges: m } = we(c, n, f, u), R = (r.srgb || r.format?.endsWith("srgb")) && Ge(i);
     let T = R ? A.sRGB : A.Linear;
-    Se(s) && (T |= A.Alpha), r.normal && (T = A.Normal);
-    const d = xe[s] + (R ? "-srgb" : ""), V = R ? ["rgba8unorm", "rgba8unorm-srgb"] : ["rgba8unorm"], x = this.#B++;
+    Se(i) && (T |= A.Alpha), r.normal && (T = A.Normal);
+    const d = Be[i] + (R ? "-srgb" : ""), V = R ? ["rgba8unorm", "rgba8unorm-srgb"] : ["rgba8unorm"], x = this.#B++;
     this.#G("create input texture #" + x);
     let y = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST;
     this.#h ? y |= GPUTextureUsage.RENDER_ATTACHMENT : y |= GPUTextureUsage.STORAGE_BINDING;
-    const S = r.flipY || c != e.width || n != e.height;
-    !S && !(e instanceof GPUTexture) && (y |= GPUTextureUsage.RENDER_ATTACHMENT);
+    const C = r.flipY || c != e.width || n != e.height;
+    !C && !(e instanceof GPUTexture) && (y |= GPUTextureUsage.RENDER_ATTACHMENT);
     const _ = this.#e.createCommandEncoder();
     _.pushDebugGroup?.("spark process texture"), this.#n && typeof _.writeTimestamp == "function" && _.writeTimestamp(this.#n, 0);
     let E;
-    if (S || !(e instanceof GPUTexture && !u)) {
+    if (C || !(e instanceof GPUTexture && !u)) {
       const g = !this.#t || !this.#o || this.#o.width < c || this.#o.height < n || this.#o.mipLevelCount < l;
       this.#t && this.#o && !g ? E = this.#o : (this.#t && this.#o && this.#o.destroy(), E = this.#e.createTexture({
         size: [c, n, 1],
@@ -579,7 +589,7 @@ class me {
       }), this.#t && (this.#o = E));
     }
     let P;
-    if (S)
+    if (C)
       if (e instanceof GPUTexture)
         this.#U(_, e, E, c, n, R, r.flipY);
       else {
@@ -595,19 +605,19 @@ class me {
       }
     else
       e instanceof GPUTexture ? u ? _.copyTextureToTexture({ texture: e }, { texture: E }, { width: c, height: n }) : E = e : this.#e.queue.copyExternalImageToTexture({ source: e }, { texture: E }, { width: c, height: n });
-    u && this.#L(_, E, l, c, n, T, r.mipsAlphaScale, r.mipmapFilter), _.popDebugGroup?.(), this.#C("create input texture #" + x);
+    u && this.#L(_, E, l, c, n, T, r.mipsAlphaScale, r.mipmapFilter), _.popDebugGroup?.(), this.#S("create input texture #" + x);
     const W = r.outputTexture && r.outputTexture.width == c && r.outputTexture.height == n && r.outputTexture.mipLevelCount == l && r.outputTexture.format == d ? r.outputTexture : this.#e.createTexture({
       size: [c, n, 1],
       mipLevelCount: l,
       format: d,
       usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST
     });
-    let C;
-    this.#t && this.#m && this.#m.size >= h ? C = this.#m : (this.#t && this.#m && this.#m.destroy(), C = this.#e.createBuffer({
+    let S;
+    this.#t && this.#m && this.#m.size >= h ? S = this.#m : (this.#t && this.#m && this.#m.destroy(), S = this.#e.createBuffer({
       size: h,
       usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC
-    }), this.#t && (this.#m = C));
-    const k = `dispatch compute shader '${N[s]}' #${x}`;
+    }), this.#t && (this.#m = S));
+    const k = `dispatch compute shader '${N[i]}' #${x}`;
     this.#G(k), _.pushDebugGroup?.("spark encode texture");
     let b = {};
     this.#n && typeof _.writeTimestamp != "function" && (b = {
@@ -637,7 +647,7 @@ class me {
           {
             binding: 2,
             resource: {
-              buffer: C,
+              buffer: S,
               offset: m[g].offset,
               size: m[g].size
             }
@@ -650,7 +660,7 @@ class me {
     for (let g = 0; g < l; g++)
       _.copyBufferToTexture(
         {
-          buffer: C,
+          buffer: S,
           offset: m[g].offset,
           bytesPerRow: m[g].bytesPerRow,
           rowsPerImage: m[g].bh
@@ -665,7 +675,7 @@ class me {
           depthOrArrayLayers: 1
         }
       );
-    return this.#n && typeof _.writeTimestamp == "function" && _.writeTimestamp(this.#n, 1), _.popDebugGroup?.(), this.#e.queue.submit([_.finish()]), this.#C(k), this.#t || (P?.destroy(), E != e && E?.destroy(), C?.destroy()), W;
+    return this.#n && typeof _.writeTimestamp == "function" && _.writeTimestamp(this.#n, 1), _.popDebugGroup?.(), this.#e.queue.submit([_.finish()]), this.#S(k), this.#t || (P?.destroy(), E != e && E?.destroy(), S?.destroy()), W;
   }
   /**
    * Returns the time (in milliseconds) it took to perform the most recent `encodeTexture()` call.
@@ -691,11 +701,11 @@ class me {
       return 0;
     const t = this.#e.createCommandEncoder();
     t.resolveQuerySet(this.#n, 0, 2, this.#_, 0), t.copyBufferToBuffer(this.#_, 0, this.#u, 0, 16), this.#e.queue.submit([t.finish()]), await this.#e.queue.onSubmittedWorkDone(), await this.#u.mapAsync(GPUMapMode.READ);
-    const r = this.#u.getMappedRange(), e = new BigUint64Array(r), s = e[0], o = e[1];
-    return this.#u.unmap(), Number(o - s) / 1e6;
+    const r = this.#u.getMappedRange(), e = new BigUint64Array(r), i = e[0], o = e[1];
+    return this.#u.unmap(), Number(o - i) / 1e6;
   }
-  async #w(t, r, e, s, o) {
-    if (O(t, "device is required"), O(Pe(t), "device is not a WebGPU device"), this.#e = t, this.#b = s, this.#t = o, this.#l = Ue(this.#e), this.#s = this.#e.createSampler({
+  async #w(t, r, e, i, o) {
+    if (O(t, "device is required"), O(Ce(t), "device is not a WebGPU device"), this.#e = t, this.#b = i, this.#t = o, this.#l = Ae(this.#e), this.#s = this.#e.createSampler({
       magFilter: "linear",
       minFilter: "linear"
     }), this.#i = this.#e.createBuffer({
@@ -720,7 +730,7 @@ class me {
       let c;
       Array.isArray(r) ? c = r.map((n) => this.#P(n, !1)) : c = this.#l;
       for (const n of c)
-        n !== void 0 && !this.#f[n] && this.#S(n).catch((f) => {
+        n !== void 0 && !this.#f[n] && this.#C(n).catch((f) => {
           console.error(`Failed to preload pipeline for format ${n}:`, f);
         });
     }
@@ -732,19 +742,19 @@ class me {
     });
     if (typeof t.compilationInfo == "function") {
       const e = await t.compilationInfo();
-      if (e.messages.some((s) => s.type == "error")) {
+      if (e.messages.some((i) => i.type == "error")) {
         console.error("WGSL compilation errors:");
-        for (const s of e.messages)
-          console.error(s);
+        for (const i of e.messages)
+          console.error(i);
         throw new Error("Shader compilation failed");
       }
     }
     if (J() && (this.#h = !0), this.#h) {
       this.#g = {}, this.#p = {}, this.#a = {};
       const e = ["rgba8unorm-srgb", "rgba8unorm"];
-      for (const s of e)
-        this.#g[s] = this.#e.createRenderPipeline({
-          label: `mipmap-pipeline-${s}`,
+      for (const i of e)
+        this.#g[i] = this.#e.createRenderPipeline({
+          label: `mipmap-pipeline-${i}`,
           layout: "auto",
           vertex: {
             module: t,
@@ -753,14 +763,14 @@ class me {
           fragment: {
             module: t,
             entryPoint: "mipmap_fs",
-            targets: [{ format: s }]
+            targets: [{ format: i }]
           },
           primitive: {
             topology: "triangle-strip",
             stripIndexFormat: "uint32"
           }
-        }), this.#p[s] = this.#e.createRenderPipeline({
-          label: `resize-pipeline-${s}`,
+        }), this.#p[i] = this.#e.createRenderPipeline({
+          label: `resize-pipeline-${i}`,
           layout: "auto",
           vertex: {
             module: t,
@@ -769,14 +779,14 @@ class me {
           fragment: {
             module: t,
             entryPoint: "resize_fs",
-            targets: [{ format: s }]
+            targets: [{ format: i }]
           },
           primitive: {
             topology: "triangle-strip",
             stripIndexFormat: "uint32"
           }
-        }), this.#a[s] = this.#e.createRenderPipeline({
-          label: `flip-y-pipeline-${s}`,
+        }), this.#a[i] = this.#e.createRenderPipeline({
+          label: `flip-y-pipeline-${i}`,
           layout: "auto",
           vertex: {
             module: t,
@@ -785,7 +795,7 @@ class me {
           fragment: {
             module: t,
             entryPoint: "flipy_fs",
-            targets: [{ format: s }]
+            targets: [{ format: i }]
           },
           primitive: {
             topology: "triangle-strip",
@@ -826,17 +836,17 @@ class me {
       }
     });
   }
-  #S(t) {
+  #C(t) {
     if (this.#f[t])
       return this.#f[t];
     const r = (async () => {
       this.#G("loadPipeline " + N[t]);
-      const e = Re[t];
+      const e = be[t];
       O(e, `No shader available for format ${N[t]}`);
-      let s = await Z[e]();
-      this.#T || (s = s.replace(/^enable f16;\s*/m, "").replace(/\bf16\b/g, "f32").replace(/\bvec([234])h\b/g, "vec$1f").replace(/\bmat([234]x[234])h/g, "mat$1f").replace(/\b(\d*\.\d+|\d+\.)h\b/g, "$1"));
+      let i = await Z[e]();
+      this.#T || (i = i.replace(/^enable f16;\s*/m, "").replace(/\bf16\b/g, "f32").replace(/\bvec([234])h\b/g, "vec$1f").replace(/\bmat([234]x[234])h/g, "mat$1f").replace(/\b(\d*\.\d+|\d+\.)h\b/g, "$1"));
       const o = this.#e.createShaderModule({
-        code: s,
+        code: i,
         label: N[t]
       });
       if (typeof o.getCompilationInfo == "function") {
@@ -855,7 +865,7 @@ class me {
           entryPoint: "main"
         }
       });
-      return this.#C("loadPipeline " + N[t]), c;
+      return this.#S("loadPipeline " + N[t]), c;
     })();
     return this.#f[t] = r, r;
   }
@@ -866,8 +876,8 @@ class me {
     const e = z[t];
     if (e != null && this.#r(e))
       return e;
-    const s = r ? ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc1-rgb", "etc2-rgb", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"] : ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc1-rgb", "etc2-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"];
-    for (const o of s)
+    const i = r ? ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc1-rgb", "etc2-rgb", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"] : ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc1-rgb", "etc2-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"];
+    for (const o of i)
       if (o.includes(t) && this.#r(z[o]))
         return z[o];
   }
@@ -884,25 +894,25 @@ class me {
         if (this.#r(a.BC5_RG)) return a.BC5_RG;
         if (this.#r(a.EAC_RG)) return a.EAC_RG;
       } else {
-        let s;
+        let i;
         if (r instanceof GPUTexture)
-          r.format == "r8unorm" || r.format == "r16unorm" ? s = 1 : r.format == "rg8unorm" || r.format == "rg16unorm" ? s = 2 : s = await this.#F(r);
+          r.format == "r8unorm" || r.format == "r16unorm" ? i = 1 : r.format == "rg8unorm" || r.format == "rg16unorm" ? i = 2 : i = await this.#F(r);
         else {
-          const o = we(r);
-          s = this.#I(o);
+          const o = Ue(r);
+          i = this.#I(o);
         }
-        if (s == 4) {
+        if (i == 4) {
           if (this.#r(a.BC7_RGBA)) return a.BC7_RGBA;
           if (this.#r(a.ASTC_4x4_RGBA)) return a.ASTC_4x4_RGBA;
-        } else if (s == 3) {
+        } else if (i == 3) {
           if (this.#r(a.BC7_RGB)) return a.BC7_RGB;
           if (this.#r(a.ASTC_4x4_RGB)) return a.ASTC_4x4_RGB;
           if (this.#r(a.BC1_RGB)) return a.BC1_RGB;
           if (this.#r(a.ETC2_RGB)) return a.ETC2_RGB;
-        } else if (s == 2) {
+        } else if (i == 2) {
           if (this.#r(a.BC5_RG)) return a.BC5_RG;
           if (this.#r(a.EAC_RG)) return a.EAC_RG;
-        } else if (s == 1) {
+        } else if (i == 1) {
           if (this.#r(a.BC4_R)) return a.BC4_R;
           if (this.#r(a.EAC_R)) return a.EAC_R;
         }
@@ -915,21 +925,21 @@ class me {
     return e;
   }
   #I(t) {
-    let r = !0, e = !0, s = 0;
+    let r = !0, e = !0, i = 0;
     const o = Math.min(1024 * 128, t.length);
     for (let c = 0; c < o; c += 4) {
       const n = t[c] / 255, f = t[c + 1] / 255, u = t[c + 2] / 255;
       t[c + 3] < 255 && (r = !1), (n != f || f != u) && (e = !1);
       const h = 2 * n - 1, m = 2 * f - 1, R = 2 * u - 1, T = h * h + m * m + R * R, d = Math.sqrt(T);
-      (Math.abs(d - 1) > 0.2 || R < -0.1) && (s += 1);
+      (Math.abs(d - 1) > 0.2 || R < -0.1) && (i += 1);
     }
-    return r ? e ? 1 : 16 * s < o ? 2 : 3 : 4;
+    return r ? e ? 1 : 16 * i < o ? 2 : 3 : 4;
   }
   async #F(t) {
     const e = this.#e.createBuffer({
       size: 12,
       usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC
-    }), s = this.#e.createBuffer({
+    }), i = this.#e.createBuffer({
       size: 12,
       usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ
     }), o = this.#e.createBindGroup({
@@ -941,18 +951,18 @@ class me {
     }), c = this.#e.createCommandEncoder(), n = c.beginComputePass();
     n.setPipeline(this.#E), n.setBindGroup(0, o);
     const { width: f, height: u } = t, l = Math.ceil(f / 8), h = Math.ceil(u / 8);
-    n.dispatchWorkgroups(l, h), n.end(), c.copyBufferToBuffer(e, 0, s, 0, 12), this.#e.queue.submit([c.finish()]), await this.#e.queue.onSubmittedWorkDone(), await s.mapAsync(GPUMapMode.READ);
-    const m = new Uint32Array(s.getMappedRange()), R = m[0] == 0, T = m[1] == 0, d = m[2];
-    return s.unmap(), s.destroy(), e.destroy(), R ? T ? 1 : 4 * d < f * u ? 2 : 3 : 4;
+    n.dispatchWorkgroups(l, h), n.end(), c.copyBufferToBuffer(e, 0, i, 0, 12), this.#e.queue.submit([c.finish()]), await this.#e.queue.onSubmittedWorkDone(), await i.mapAsync(GPUMapMode.READ);
+    const m = new Uint32Array(i.getMappedRange()), R = m[0] == 0, T = m[1] == 0, d = m[2];
+    return i.unmap(), i.destroy(), e.destroy(), R ? T ? 1 : 4 * d < f * u ? 2 : 3 : 4;
   }
   #R(t, r, e) {
-    const s = r && r.length > 0 ? e < r.length ? r[e] : r[r.length - 1] : 1, o = new ArrayBuffer(8), c = new DataView(o);
-    c.setUint32(0, t, !0), c.setFloat32(4, s, !0), this.#e.queue.writeBuffer(this.#i, 0, o);
+    const i = r && r.length > 0 ? e < r.length ? r[e] : r[r.length - 1] : 1, o = new ArrayBuffer(8), c = new DataView(o);
+    c.setUint32(0, t, !0), c.setFloat32(4, i, !0), this.#e.queue.writeBuffer(this.#i, 0, o);
   }
   // Apply scaling and flipY transform.
-  #U(t, r, e, s, o, c, n) {
+  #U(t, r, e, i, o, c, n) {
     if (this.#h) {
-      this.#M(t, r, e, s, o, c, n);
+      this.#M(t, r, e, i, o, c, n);
       return;
     }
     this.#R(c);
@@ -990,10 +1000,10 @@ class me {
         }
       ]
     });
-    f.setBindGroup(0, l), f.dispatchWorkgroups(Math.ceil(s / 8), Math.ceil(o / 8)), f.end();
+    f.setBindGroup(0, l), f.dispatchWorkgroups(Math.ceil(i / 8), Math.ceil(o / 8)), f.end();
   }
   // Apply scaling and flipY transform.
-  #M(t, r, e, s, o, c, n) {
+  #M(t, r, e, i, o, c, n) {
     const f = (c & A.sRGB) != 0 ? "rgba8unorm-srgb" : "rgba8unorm", u = e.createView({
       baseMipLevel: 0,
       mipLevelCount: 1,
@@ -1037,9 +1047,9 @@ class me {
     });
     l.setBindGroup(0, m), l.draw(4, 1, 0, 0), l.end();
   }
-  async #L(t, r, e, s, o, c, n, f) {
+  async #L(t, r, e, i, o, c, n, f) {
     n == null && this.#R(c);
-    let u = s, l = o;
+    let u = i, l = o;
     if (this.#h)
       for (let h = 0; h < e - 1; h++)
         n != null && this.#R(c, n, h), u = Math.max(1, Math.floor(u / 2)), l = Math.max(1, Math.floor(l / 2)), this.#N(t, r, h, h + 1, u, l, c);
@@ -1051,14 +1061,14 @@ class me {
       h.end();
     }
   }
-  #D(t, r, e, s, o, c, n, f) {
+  #D(t, r, e, i, o, c, n, f) {
     const u = this.#e.createBindGroup({
       layout: r,
       entries: [
         {
           binding: 0,
           resource: e.createView({
-            baseMipLevel: s,
+            baseMipLevel: i,
             mipLevelCount: 1,
             format: (f & A.sRGB) != 0 ? "rgba8unorm-srgb" : "rgba8unorm",
             usage: GPUTextureUsage.TEXTURE_BINDING
@@ -1086,9 +1096,9 @@ class me {
     });
     t.setBindGroup(0, u), t.dispatchWorkgroups(Math.ceil(c / 8), Math.ceil(n / 8));
   }
-  #N(t, r, e, s, o, c, n) {
+  #N(t, r, e, i, o, c, n) {
     const f = (n & A.sRGB) != 0 ? "rgba8unorm-srgb" : "rgba8unorm", u = r.createView({
-      baseMipLevel: s,
+      baseMipLevel: i,
       mipLevelCount: 1,
       dimension: "2d",
       format: f,
@@ -1127,9 +1137,18 @@ class me {
     l.setPipeline(this.#g[f]), l.setBindGroup(0, h), l.draw(4, 1, 0, 0), l.end();
   }
 }
-const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import("./spark_astc_rgb-CTmg8wnA.js").then((i) => i.default), "./spark_astc_rgba.glsl": () => import("./spark_astc_rgba-CDMNWH6H.js").then((i) => i.default), "./spark_bc1_rgb.glsl": () => import("./spark_bc1_rgb-C0pbbQPO.js").then((i) => i.default), "./spark_bc4_r.glsl": () => import("./spark_bc4_r-YQ6i79H9.js").then((i) => i.default), "./spark_bc5_rg.glsl": () => import("./spark_bc5_rg-BqzKgeMU.js").then((i) => i.default), "./spark_bc7_rgb.glsl": () => import("./spark_bc7_rgb-DBkDHCzE.js").then((i) => i.default), "./spark_bc7_rgba.glsl": () => import("./spark_bc7_rgba-DQUk89UX.js").then((i) => i.default), "./spark_eac_r.glsl": () => import("./spark_eac_r-Dvy2qUxf.js").then((i) => i.default), "./spark_eac_rg.glsl": () => import("./spark_eac_rg-DKLVL9co.js").then((i) => i.default), "./spark_etc2_rgb.glsl": () => import("./spark_etc2_rgb-BpnNweVx.js").then((i) => i.default) }), Fe = Object.fromEntries(
-  Object.entries(Ie).map(([i, t]) => [i.replace("./", ""), async () => await t()])
-), p = {
+const ye = {
+  "spark_astc_rgb.glsl": () => import("./spark_astc_rgb-CTmg8wnA.js").then((s) => s.default),
+  "spark_astc_rgba.glsl": () => import("./spark_astc_rgba-CDMNWH6H.js").then((s) => s.default),
+  "spark_bc1_rgb.glsl": () => import("./spark_bc1_rgb-C0pbbQPO.js").then((s) => s.default),
+  "spark_bc4_r.glsl": () => import("./spark_bc4_r-YQ6i79H9.js").then((s) => s.default),
+  "spark_bc5_rg.glsl": () => import("./spark_bc5_rg-BqzKgeMU.js").then((s) => s.default),
+  "spark_bc7_rgb.glsl": () => import("./spark_bc7_rgb-DBkDHCzE.js").then((s) => s.default),
+  "spark_bc7_rgba.glsl": () => import("./spark_bc7_rgba-DQUk89UX.js").then((s) => s.default),
+  "spark_eac_r.glsl": () => import("./spark_eac_r-Dvy2qUxf.js").then((s) => s.default),
+  "spark_eac_rg.glsl": () => import("./spark_eac_rg-DKLVL9co.js").then((s) => s.default),
+  "spark_etc2_rgb.glsl": () => import("./spark_etc2_rgb-BpnNweVx.js").then((s) => s.default)
+}, p = {
   ASTC_4x4_RGB: 0,
   ASTC_4x4_RGBA: 1,
   EAC_R: 4,
@@ -1177,7 +1196,7 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   "bc7-rgb",
   /* 17 */
   "bc7-rgba"
-], Me = [
+], Ie = [
   /* 0  */
   "spark_astc_rgb.glsl",
   /* 1  */
@@ -1214,7 +1233,7 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   "spark_bc7_rgb.glsl",
   /* 17 */
   "spark_bc7_rgba.glsl"
-], Le = [
+], Fe = [
   /* 0  */
   16,
   /* 1  */
@@ -1251,7 +1270,7 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   16,
   /* 17 */
   16
-], De = [
+], Me = [
   /* 0  */
   !0,
   // ASTC_4x4_RGB
@@ -1298,7 +1317,7 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   /* 17 */
   !0
   // BC7_RGBA
-], se = 37808, ie = 37840, ae = 36492, ne = 36493, Ne = 33776, ve = 35916, oe = 36283, ce = 36285, Xe = 37492, ke = 37493, ue = 37488, le = 37490, X = 36208, $ = 36214, Oe = [
+], se = 37808, ie = 37840, ae = 36492, ne = 36493, Le = 33776, De = 35916, oe = 36283, ce = 36285, Ne = 37492, ve = 37493, ue = 37488, le = 37490, X = 36208, $ = 36214, Xe = [
   /* 0  */
   [se, ie],
   /* 1  */
@@ -1312,13 +1331,13 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   /* 5  */
   [le, le],
   /* 6  */
-  [Xe, ke],
+  [Ne, ve],
   /* 7  */
   null,
   /* 8  */
   null,
   /* 9  */
-  [Ne, ve],
+  [Le, De],
   /* 10 */
   null,
   /* 11 */
@@ -1335,7 +1354,7 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   [ae, ne],
   /* 17 */
   [ae, ne]
-], Ve = [
+], ke = [
   /* 0  */
   X,
   /* 1  */
@@ -1386,17 +1405,17 @@ const Ie = /* @__PURE__ */ Object.assign({ "./spark_astc_rgb.glsl": () => import
   "astc-rgb": p.ASTC_4x4_RGB,
   "astc-rgba": p.ASTC_4x4_RGBA
 });
-function We(i, t = !1) {
+function Oe(s, t = !1) {
   const r = /* @__PURE__ */ new Set();
   if (t) {
-    const u = i.getSupportedExtensions();
+    const u = s.getSupportedExtensions();
     console.log("Available WebGL extensions:"), u && u.sort().forEach((l) => {
       console.log(`  ${l}`);
     }), console.log(`Total: ${u ? u.length : 0} extensions`), console.log("");
   }
-  (i.getExtension("EXT_texture_compression_bptc") || i.getExtension("WEBGL_texture_compression_bptc")) && (r.add(p.BC7_RGB), r.add(p.BC7_RGBA));
-  const s = i.getExtension("WEBGL_compressed_texture_s3tc"), o = i.getExtension("WEBGL_compressed_texture_s3tc_srgb");
-  if ((s || o) && r.add(p.BC1_RGB), i.getExtension("EXT_texture_compression_rgtc") && (r.add(p.BC4_R), r.add(p.BC5_RG)), i.getExtension("WEBGL_compressed_texture_etc") && (r.add(p.ETC2_RGB), r.add(p.EAC_R), r.add(p.EAC_RG)), i.getExtension("WEBGL_compressed_texture_astc") && (r.add(p.ASTC_4x4_RGB), r.add(p.ASTC_4x4_RGBA)), t) {
+  (s.getExtension("EXT_texture_compression_bptc") || s.getExtension("WEBGL_texture_compression_bptc")) && (r.add(p.BC7_RGB), r.add(p.BC7_RGBA));
+  const i = s.getExtension("WEBGL_compressed_texture_s3tc"), o = s.getExtension("WEBGL_compressed_texture_s3tc_srgb");
+  if ((i || o) && r.add(p.BC1_RGB), s.getExtension("EXT_texture_compression_rgtc") && (r.add(p.BC4_R), r.add(p.BC5_RG)), s.getExtension("WEBGL_compressed_texture_etc") && (r.add(p.ETC2_RGB), r.add(p.EAC_R), r.add(p.EAC_RG)), s.getExtension("WEBGL_compressed_texture_astc") && (r.add(p.ASTC_4x4_RGB), r.add(p.ASTC_4x4_RGBA)), t) {
     console.log("Supported compression formats:");
     const u = Array.from(r).map((l) => v[l]).filter(Boolean);
     u.forEach((l) => {
@@ -1405,10 +1424,10 @@ function We(i, t = !1) {
   }
   return r;
 }
-async function ze(i) {
-  const t = Fe[i];
+async function Ve(s) {
+  const t = ye[s];
   if (!t)
-    throw new Error(`Shader not found: ${i}`);
+    throw new Error(`Shader not found: ${s}`);
   let r = await t();
   return r = `#version 300 es
 precision highp float;
@@ -1421,21 +1440,21 @@ void main() {
     gl_Position = vec4(uv * 2.0 - 1.0, 0.0, 1.0);
 }
 `;
-function q(i, t, r, e) {
-  const s = i.createShader(t);
-  if (i.shaderSource(s, r), i.compileShader(s), e && !i.getShaderParameter(s, i.COMPILE_STATUS)) {
-    const o = i.getShaderInfoLog(s);
-    throw i.deleteShader(s), new Error(`Shader compilation failed: ${o}`);
+function q(s, t, r, e) {
+  const i = s.createShader(t);
+  if (s.shaderSource(i, r), s.compileShader(i), e && !s.getShaderParameter(i, s.COMPILE_STATUS)) {
+    const o = s.getShaderInfoLog(i);
+    throw s.deleteShader(i), new Error(`Shader compilation failed: ${o}`);
   }
-  return s;
+  return i;
 }
-function fe(i, t, r, e) {
-  const s = i.createProgram();
-  if (i.attachShader(s, t), i.attachShader(s, r), i.linkProgram(s), e && !i.getProgramParameter(s, i.LINK_STATUS)) {
-    const o = i.getProgramInfoLog(s);
-    throw i.deleteProgram(s), new Error(`Program linking failed: ${o}`);
+function fe(s, t, r, e) {
+  const i = s.createProgram();
+  if (s.attachShader(i, t), s.attachShader(i, r), s.linkProgram(i), e && !s.getProgramParameter(i, s.LINK_STATUS)) {
+    const o = s.getProgramInfoLog(i);
+    throw s.deleteProgram(i), new Error(`Program linking failed: ${o}`);
   }
-  return s;
+  return i;
 }
 class de {
   #e;
@@ -1459,7 +1478,7 @@ class de {
   constructor(t, r = {}) {
     if (!t)
       throw new Error("WebGL2 context is required");
-    this.#e = t, this.#h = r.verbose ?? !1, this.#f = r.validateShaders ?? !1, this.#p = r.cacheTempResources ?? !1, this.#l = We(t, this.#h), r.preload && this.#m(r.preload);
+    this.#e = t, this.#h = r.verbose ?? !1, this.#f = r.validateShaders ?? !1, this.#p = r.cacheTempResources ?? !1, this.#l = Oe(t, this.#h), r.preload && this.#m(r.preload);
   }
   dispose() {
     const t = this.#e;
@@ -1493,8 +1512,8 @@ class de {
     let r;
     Array.isArray(t) ? r = t.map((e) => this.#b(e, !1)) : r = this.#l;
     for (const e of r)
-      e !== void 0 && !this.#T[e] && this.#x(e).catch((s) => {
-        console.error(`Failed to preload program for format ${v[e]}:`, s);
+      e !== void 0 && !this.#T[e] && this.#x(e).catch((i) => {
+        console.error(`Failed to preload program for format ${v[e]}:`, i);
       });
   }
   getSupportedFormats() {
@@ -1519,8 +1538,8 @@ class de {
     const e = H[t];
     if (e != null && this.#B(e))
       return e;
-    const s = r ? ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc1-rgb", "etc2-rgb", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"] : ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc1-rgb", "etc2-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"];
-    for (const o of s)
+    const i = r ? ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc1-rgb", "etc2-rgb", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"] : ["bc4-r", "eac-r", "bc5-rg", "eac-rg", "bc7-rgb", "astc-rgb", "astc-4x4-rgb", "bc1-rgb", "etc2-rgb", "bc7-rgba", "astc-rgba", "astc-4x4-rgba"];
+    for (const o of i)
       if (o.includes(t) && this.#B(H[o]))
         return H[o];
   }
@@ -1530,18 +1549,18 @@ class de {
     const r = (async () => {
       const e = "Loading program for format: " + v[t];
       this.#o(e);
-      const s = this.#e, o = Me[t];
-      this.#d || (this.#d = q(s, s.VERTEX_SHADER, Y, this.#f));
-      const c = await ze(o), n = q(s, s.FRAGMENT_SHADER, c, this.#f), f = fe(s, this.#d, n, this.#f);
-      return s.deleteShader(n), this.#c(e), f;
+      const i = this.#e, o = Ie[t];
+      this.#d || (this.#d = q(i, i.VERTEX_SHADER, Y, this.#f));
+      const c = await Ve(o), n = q(i, i.FRAGMENT_SHADER, c, this.#f), f = fe(i, this.#d, n, this.#f);
+      return i.deleteShader(n), this.#c(e), f;
     })();
     return this.#T[t] = r, r;
   }
   async encodeTexture(t, r = {}) {
     const e = this.#e;
-    typeof t == "string" && (t = await K(t)), this.#t(`Image type: ${t.constructor.name}`);
-    const s = t.width || t.videoWidth, o = t.height || t.videoHeight;
-    O(s && o);
+    typeof t == "string" && (t = await Q(t)), this.#t(`Image type: ${t.constructor.name}`);
+    const i = t.width || t.videoWidth, o = t.height || t.videoHeight;
+    O(i && o);
     const c = r.format ?? "rgb";
     let n;
     if (typeof c == "string") {
@@ -1551,7 +1570,7 @@ class de {
       throw new Error(`Format not supported: ${v[n]}`);
     const f = await this.#x(n);
     this.#t(`Selected format: ${v[n]}`);
-    const u = Le[n], l = (r.srgb || r.format?.endsWith("srgb")) && De[n], h = Oe[n], m = h ? l ? h[1] : h[0] : null, R = Ve[n];
+    const u = Fe[n], l = (r.srgb || r.format?.endsWith("srgb")) && Me[n], h = Xe[n], m = h ? l ? h[1] : h[0] : null, R = ke[n];
     this.#t(`Using ${l ? "sRGB" : "linear"} color space`);
     const T = `encodeTexture #${++this.#g}`;
     this.#o(T);
@@ -1588,19 +1607,19 @@ class de {
         break;
     }
     const y = r.generateMipmaps || r.mips;
-    let S = 1;
+    let C = 1;
     if (y) {
-      let w = s, I = o;
+      let w = i, I = o;
       for (; w > 4 || I > 4; )
-        S++, w = Math.max(1, Math.floor(w / 2)), I = Math.max(1, Math.floor(I / 2));
+        C++, w = Math.max(1, Math.floor(w / 2)), I = Math.max(1, Math.floor(I / 2));
     }
     const _ = e.createTexture();
-    e.bindTexture(e.TEXTURE_2D, _), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAX_LEVEL, 0), e.texImage2D(e.TEXTURE_2D, 0, e.RGBA8, s, o, 0, e.RGBA, e.UNSIGNED_BYTE, t);
+    e.bindTexture(e.TEXTURE_2D, _), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAX_LEVEL, 0), e.texImage2D(e.TEXTURE_2D, 0, e.RGBA8, i, o, 0, e.RGBA, e.UNSIGNED_BYTE, t);
     let E = _;
     if (r.flipY) {
       this.#t("Flipping texture vertically");
       const G = e.createTexture();
-      e.bindTexture(e.TEXTURE_2D, G), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x), e.texStorage2D(e.TEXTURE_2D, 1, e.RGBA8, s, o);
+      e.bindTexture(e.TEXTURE_2D, G), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.NEAREST), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x), e.texStorage2D(e.TEXTURE_2D, 1, e.RGBA8, i, o);
       const w = e.createFramebuffer();
       e.bindFramebuffer(e.FRAMEBUFFER, w), e.framebufferTexture2D(e.FRAMEBUFFER, e.COLOR_ATTACHMENT0, e.TEXTURE_2D, G, 0), this.#d || (this.#d = q(e, e.VERTEX_SHADER, Y, this.#f));
       const I = `#version 300 es
@@ -1618,34 +1637,34 @@ class de {
       const M = e.createShader(e.FRAGMENT_SHADER);
       e.shaderSource(M, I), e.compileShader(M);
       const D = fe(e, F, M, this.#f);
-      e.useProgram(D), e.viewport(0, 0, s, o), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, _), e.uniform1i(e.getUniformLocation(D, "uTexture"), 0), e.uniform2i(e.getUniformLocation(D, "uTextureSize"), s, o), e.drawArrays(e.TRIANGLES, 0, 3), e.deleteShader(F), e.deleteShader(M), e.deleteProgram(D), e.deleteFramebuffer(w), e.deleteTexture(_), E = G;
+      e.useProgram(D), e.viewport(0, 0, i, o), e.activeTexture(e.TEXTURE0), e.bindTexture(e.TEXTURE_2D, _), e.uniform1i(e.getUniformLocation(D, "uTexture"), 0), e.uniform2i(e.getUniformLocation(D, "uTextureSize"), i, o), e.drawArrays(e.TRIANGLES, 0, 3), e.deleteShader(F), e.deleteShader(M), e.deleteProgram(D), e.deleteFramebuffer(w), e.deleteTexture(_), E = G;
     }
-    y && (e.bindTexture(e.TEXTURE_2D, E), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAX_LEVEL, S - 1), e.generateMipmap(e.TEXTURE_2D), this.#t(`Generated ${S} mipmap levels`));
+    y && (e.bindTexture(e.TEXTURE_2D, E), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAX_LEVEL, C - 1), e.generateMipmap(e.TEXTURE_2D), this.#t(`Generated ${C} mipmap levels`));
     const P = e.createTexture();
-    e.bindTexture(e.TEXTURE_2D, P), e.texStorage2D(e.TEXTURE_2D, S, m, s, o), y ? (e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR)) : (e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR)), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x);
-    const Q = Math.ceil(s / 4), W = Math.ceil(o / 4), C = u * Q * W;
-    let k = C;
+    e.bindTexture(e.TEXTURE_2D, P), e.texStorage2D(e.TEXTURE_2D, C, m, i, o), y ? (e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR)) : (e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR)), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, x), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, x);
+    const j = Math.ceil(i / 4), W = Math.ceil(o / 4), S = u * j * W;
+    let k = S;
     const b = this.#p;
     let U;
-    b && this.#a && this.#E >= C ? U = this.#a : (b && this.#a && e.deleteBuffer(this.#a), U = e.createBuffer(), b && (this.#a = U, this.#E = C)), e.bindBuffer(e.PIXEL_PACK_BUFFER, U), e.bindBuffer(e.PIXEL_UNPACK_BUFFER, U), e.bufferData(e.PIXEL_PACK_BUFFER, C, e.STREAM_COPY);
+    b && this.#a && this.#E >= S ? U = this.#a : (b && this.#a && e.deleteBuffer(this.#a), U = e.createBuffer(), b && (this.#a = U, this.#E = S)), e.bindBuffer(e.PIXEL_PACK_BUFFER, U), e.bindBuffer(e.PIXEL_UNPACK_BUFFER, U), e.bufferData(e.PIXEL_PACK_BUFFER, S, e.STREAM_COPY);
     let B;
-    const g = !b || this.#n < s || this.#_ < o;
-    u === 8 ? b && this.#s && !g ? B = this.#s : (b && this.#s && e.deleteTexture(this.#s), B = e.createTexture(), e.bindTexture(e.TEXTURE_2D, B), e.texStorage2D(e.TEXTURE_2D, 1, R, s, o), b && (this.#s = B, this.#n = s, this.#_ = o)) : b && this.#i && !g ? B = this.#i : (b && this.#i && e.deleteTexture(this.#i), B = e.createTexture(), e.bindTexture(e.TEXTURE_2D, B), e.texStorage2D(e.TEXTURE_2D, 1, R, s, o), b && (this.#i = B, this.#n = s, this.#_ = o));
+    const g = !b || this.#n < i || this.#_ < o;
+    u === 8 ? b && this.#s && !g ? B = this.#s : (b && this.#s && e.deleteTexture(this.#s), B = e.createTexture(), e.bindTexture(e.TEXTURE_2D, B), e.texStorage2D(e.TEXTURE_2D, 1, R, i, o), b && (this.#s = B, this.#n = i, this.#_ = o)) : b && this.#i && !g ? B = this.#i : (b && this.#i && e.deleteTexture(this.#i), B = e.createTexture(), e.bindTexture(e.TEXTURE_2D, B), e.texStorage2D(e.TEXTURE_2D, 1, R, i, o), b && (this.#i = B, this.#n = i, this.#_ = o));
     let L;
     b && this.#u ? L = this.#u : (L = e.createFramebuffer(), b && (this.#u = L)), e.bindFramebuffer(e.FRAMEBUFFER, L), e.readBuffer(e.COLOR_ATTACHMENT0), e.framebufferTexture2D(e.FRAMEBUFFER, e.COLOR_ATTACHMENT0, e.TEXTURE_2D, B, 0), e.useProgram(f);
-    for (let G = 0; G < S; G++) {
-      const w = Math.max(1, Math.floor(s >> G)), I = Math.max(1, Math.floor(o >> G)), F = Math.ceil(w / 4), M = Math.ceil(I / 4), D = u * F * M;
+    for (let G = 0; G < C; G++) {
+      const w = Math.max(1, Math.floor(i >> G)), I = Math.max(1, Math.floor(o >> G)), F = Math.ceil(w / 4), M = Math.ceil(I / 4), D = u * F * M;
       k += D, e.bindTexture(e.TEXTURE_2D, E), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_BASE_LEVEL, G), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAX_LEVEL, G), e.viewport(0, 0, F, M), e.drawArrays(e.TRIANGLES, 0, 3), e.readPixels(0, 0, F, M, e.RGBA_INTEGER, u === 16 ? e.UNSIGNED_INT : e.UNSIGNED_SHORT, 0), e.bindTexture(e.TEXTURE_2D, P), e.compressedTexSubImage2D(e.TEXTURE_2D, G, 0, 0, w, I, m, D, 0);
     }
     return b || (e.deleteTexture(B), e.deleteBuffer(U), e.deleteFramebuffer(L)), e.deleteTexture(E), e.bindFramebuffer(e.FRAMEBUFFER, d.framebuffer), e.bindFramebuffer(e.READ_FRAMEBUFFER, d.readFramebuffer), e.bindTexture(e.TEXTURE_2D, d.textureBinding), e.useProgram(d.program), e.activeTexture(d.activeTexture), e.viewport(d.viewport[0], d.viewport[1], d.viewport[2], d.viewport[3]), e.bindBuffer(e.PIXEL_PACK_BUFFER, d.pixelPackBuffer), e.bindBuffer(e.PIXEL_UNPACK_BUFFER, d.pixelUnpackBuffer), d.blend ? e.enable(e.BLEND) : e.disable(e.BLEND), d.depthTest ? e.enable(e.DEPTH_TEST) : e.disable(e.DEPTH_TEST), d.stencilTest ? e.enable(e.STENCIL_TEST) : e.disable(e.STENCIL_TEST), d.cullFace ? e.enable(e.CULL_FACE) : e.disable(e.CULL_FACE), d.scissorTest ? e.enable(e.SCISSOR_TEST) : e.disable(e.SCISSOR_TEST), e.bindBuffer(e.ARRAY_BUFFER, d.arrayBuffer), e.bindVertexArray(d.vertexArray), this.#c(T), {
       texture: P,
-      width: s,
+      width: i,
       height: o,
       format: m,
       sparkFormat: n,
       sparkFormatName: v[n],
       srgb: l,
-      mipmapCount: S,
+      mipmapCount: C,
       byteLength: k
     };
   }

package/package.json

@@ -1,19 +1,26 @@
 {
   "name": "@ludicon/spark.js",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Real-Time GPU Texture Codecs for the Web",
   "main": "dist/spark.esm.js",
   "module": "dist/spark.esm.js",
   "type": "module",
+  "types": "src/index.d.ts",
   "exports": {
     ".": {
-      "import": "./dist/spark.esm.js"
+      "import": "./dist/spark.esm.js",
+      "types": "./src/index.d.ts"
     },
-    "./three-gltf": "./src/three-gltf.js"
+    "./three-gltf": {
+      "import": "./src/three-gltf.js",
+      "types": "./src/three-gltf.d.ts"
+    }
   },
   "files": [
     "dist",
     "src/three-gltf.js",
+    "src/three-gltf.d.ts",
+    "src/index.d.ts",
     "README.md",
     "LICENSE"
   ],
@@ -28,6 +35,7 @@
     "lint:fix": "eslint . --fix",
     "format": "prettier --write \"src/**/*.{js,jsx}\"",
     "validate-shaders": "for shader in src/shaders/*.wgsl; do echo \"Validating $shader...\"; tint \"$shader\" --validate > /dev/null || exit 1; done && echo \"All shaders validated successfully!\"",
+    "analyze-bundle": "node scripts/analyze-bundle-size.js",
     "prepublishOnly": "npm run validate-shaders && npm run build",
     "clean": "rimraf dist"
   },

package/src/index.d.ts

@@ -0,0 +1,301 @@
+// Type definitions for @ludicon/spark.js
+// Project: https://github.com/ludicon/spark.js
+// Definitions by: Ludicon LLC
+
+/**
+ * Options for initializing Spark (WebGPU) encoder
+ */
+export interface SparkCreateOptions {
+  /**
+   * Whether to preload all encoder pipelines or an array of format names to preload.
+   * Pipelines that are not preloaded are compiled on-demand when first used.
+   * @default false
+   */
+  preload?: boolean | string[]
+
+  /**
+   * Whether to cache temporary resources for reuse across encodeTexture calls.
+   * Improves performance when encoding multiple textures, but uses more GPU memory.
+   * @default false
+   */
+  cacheTempResources?: boolean
+
+  /**
+   * Enable verbose logging for debugging.
+   * @default false
+   */
+  verbose?: boolean
+
+  /**
+   * Enable GPU timestamp queries for performance profiling.
+   * Requires `timestamp-query` feature and enabling unsafe WebGPU features in the browser.
+   * @default false
+   */
+  useTimestampQueries?: boolean
+}
+
+/**
+ * Options for encoding textures with Spark
+ */
+export interface SparkEncodeOptions {
+  /**
+   * Desired block compression format. Can be specified in several ways:
+   * - Channel mask: "r", "rg", "rgb", "rgba" - Auto-selects the best format based on device capabilities
+   * - Explicit format: "bc1-rgb", "bc7-rgba", "astc-4x4-rgb", "etc2-rgb", "eac-r", etc.
+   * - Substring: "bc1", "bc7", "astc", "etc2" - Chooses the first matching format
+   * - Auto-detect: "auto" - Analyzes image to determine channel count (WebGPU only, has overhead)
+   * @default "rgb"
+   */
+  format?: string
+
+  /**
+   * Hint for the automatic format selector. When the input format is "rgb" it chooses
+   * 8 bit per block formats like "bc1" or "etc2" instead of "bc7" or "astc".
+   * @default false
+   */
+  preferLowQuality?: boolean
+
+  /**
+   * Whether to generate mipmaps.
+   * @default false
+   */
+  mips?: boolean
+
+  /**
+   * Alias for mips. Whether to generate mipmaps.
+   * @default false
+   */
+  generateMipmaps?: boolean
+
+  /**
+   * The filter to use for mipmap generation:
+   * - "box" - Simple 2x2 box filter
+   * - "magic" - Higher quality 4x4 filter with sharpening properties
+   * @default "magic"
+   */
+  mipmapFilter?: "box" | "magic"
+
+  /**
+   * Optional array of alpha scale values to apply to each generated mipmap level.
+   * The array should contain one value per mipmap level (starting with mip level 1).
+   * Each value multiplies the alpha channel of the corresponding mipmap level.
+   * Values greater than 1.0 increase opacity, while values less than 1.0 increase transparency.
+   * If the array is shorter than the number of mipmap levels, the last value is used for remaining levels.
+   * Only applies when mips is true.
+   */
+  mipsAlphaScale?: number[]
+
+  /**
+   * Whether to encode the image using an sRGB format.
+   * This also affects mipmap generation. The srgb mode can also be inferred from the format.
+   * @default false
+   */
+  srgb?: boolean
+
+  /**
+   * Whether to interpret the image as a normal map.
+   * This affects automatic format selection favoring the use of "bc5" and "eac-rg" formats.
+   * @default false
+   */
+  normal?: boolean
+
+  /**
+   * Whether to vertically flip the image before encoding.
+   * @default false
+   */
+  flipY?: boolean
+}
+
+/**
+ * WebGPU-based texture encoder
+ */
+export class Spark {
+  /**
+   * Creates a new Spark instance for WebGPU.
+   * @param device - WebGPU device with required features enabled
+   * @param options - Configuration options
+   * @returns Initialized Spark instance
+   */
+  static create(device: GPUDevice, options?: SparkCreateOptions): Promise<Spark>
+
+  /**
+   * Determines the set of WebGPU features to request when initializing the device.
+   * This function inspects the given adapter to see which texture compression and shader
+   * features are available, and returns a list of those that are both supported and safe to enable.
+   * @param adapter - The WebGPU adapter returned from navigator.gpu.requestAdapter()
+   * @returns Array of WebGPU feature names to request during adapter.requestDevice()
+   */
+  static getRequiredFeatures(adapter: GPUAdapter): GPUFeatureName[]
+
+  /**
+   * Destroys the Spark instance and all associated GPU resources.
+   */
+  dispose(): void
+
+  /**
+   * Load an image and encode it to a compressed GPU texture.
+   * @param source - The image to encode. Can be a URL string, DOM image element, ImageBitmap, or GPUTexture
+   * @param options - Optional configuration for encoding
+   * @returns Promise resolving to the encoded GPU texture
+   */
+  encodeTexture(source: string | HTMLImageElement | ImageBitmap | GPUTexture, options?: SparkEncodeOptions): Promise<GPUTexture>
+
+  /**
+   * Returns list of compression formats supported on the current device.
+   * @returns Array of format name strings (e.g., "bc7-rgba", "bc1-rgb", "etc2-rgb")
+   */
+  getSupportedFormats(): string[]
+
+  /**
+   * Checks if a specific format is supported.
+   * @param format - Format name or format constant
+   * @returns True if format is supported
+   */
+  isFormatSupported(format: string | number): boolean
+
+  /**
+   * Frees cached temporary GPU resources when cacheTempResources option is enabled.
+   * Call this when you're done encoding textures to free up GPU memory.
+   */
+  freeTempResources(): void
+
+  /**
+   * Try to determine the best compression options automatically.
+   * Do not use this in production, this is for convenience only.
+   * @param source - Image input
+   * @param options - Encoding options
+   * @returns Recommended encoding options with an explicit encoding format
+   */
+  selectPreferredOptions(source: string | HTMLImageElement | ImageBitmap | GPUTexture, options?: SparkEncodeOptions): Promise<SparkEncodeOptions>
+
+  /**
+   * Get elapsed time for the last encoding operation (requires useTimestampQueries option).
+   * @returns Promise resolving to elapsed time in milliseconds
+   */
+  getTimeElapsed(): Promise<number>
+}
+
+/**
+ * Options for initializing SparkGL (WebGL2) encoder
+ */
+export interface SparkGLCreateOptions {
+  /**
+   * Whether to preload shader programs. Can be:
+   * - false: Load shaders on-demand
+   * - true: Preload all supported formats
+   * - string[]: Array of format names to preload (e.g., ["bc7", "astc"])
+   * @default false
+   */
+  preload?: boolean | string[]
+
+  /**
+   * Whether to cache temporary resources for reuse across encodeTexture calls.
+   * @default false
+   */
+  cacheTempResources?: boolean
+
+  /**
+   * Enable verbose logging for debugging.
+   * @default false
+   */
+  verbose?: boolean
+
+  /**
+   * Enable WebGL shader validation. Only enable this for debugging,
+   * as it disables async shader compilation.
+   * @default false
+   */
+  validateShaders?: boolean
+}
+
+/**
+ * Result object returned by SparkGL.encodeTexture()
+ */
+export interface SparkGLTextureResult {
+  /**
+   * The compressed WebGL texture
+   */
+  texture: WebGLTexture
+
+  /**
+   * WebGL internal format constant
+   */
+  format: number
+
+  /**
+   * Spark format name
+   */
+  sparkFormat: number
+
+  /**
+   * Human-readable Spark format name
+   */
+  sparkFormatName: string
+
+  /**
+   * Texture width in pixels
+   */
+  width: number
+
+  /**
+   * Texture height in pixels
+   */
+  height: number
+
+  /**
+   * Number of mipmap levels
+   */
+  mipLevels: number
+
+  /**
+   * Size of the texture data in bytes
+   */
+  byteLength: number
+}
+
+/**
+ * WebGL2-based texture encoder
+ */
+export class SparkGL {
+  /**
+   * Creates a new SparkGL instance for WebGL2.
+   * @param gl - WebGL2 context. Required extensions are automatically enabled.
+   * @param options - Configuration options
+   * @returns Initialized SparkGL instance
+   */
+  static create(gl: WebGLRenderingContext | WebGL2RenderingContext, options?: SparkGLCreateOptions): SparkGL
+
+  /**
+   * Destroys the SparkGL instance and all associated GPU resources.
+   */
+  dispose(): void
+
+  /**
+   * Load an image and encode it to a compressed WebGL texture.
+   * @param source - The image to encode. Can be a URL string, DOM image element, ImageBitmap, or WebGLTexture
+   * @param options - Optional configuration for encoding
+   * @returns Promise resolving to an object containing the encoded texture and metadata
+   */
+  encodeTexture(source: string | HTMLImageElement | ImageBitmap | WebGLTexture, options?: SparkEncodeOptions): Promise<SparkGLTextureResult>
+
+  /**
+   * Returns list of compression formats supported on the current device.
+   * @returns Array of format name strings (e.g., "bc7-rgba", "bc1-rgb", "etc2-rgb")
+   */
+  getSupportedFormats(): string[]
+
+  /**
+   * Checks if a specific format is supported.
+   * @param format - Format name or format constant
+   * @returns True if format is supported
+   */
+  isFormatSupported(format: string | number): boolean
+
+  /**
+   * Frees cached temporary GPU resources when cacheTempResources option is enabled.
+   * Call this when you're done encoding textures to free up GPU memory.
+   */
+  freeTempResources(): void
+}
+
+export default Spark

package/src/three-gltf.d.ts

@@ -0,0 +1,62 @@
+// Type definitions for @ludicon/spark.js/three-gltf
+// Project: https://github.com/ludicon/spark.js
+
+import type { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
+import type { Spark, SparkGL, SparkEncodeOptions } from '@ludicon/spark.js'
+
+/**
+ * Options for the Spark GLTF loader plugin
+ */
+export interface SparkGLTFOptions extends Omit<SparkEncodeOptions, 'format'> {
+  /**
+   * Whether to generate mipmaps for textures.
+   * @default true
+   */
+  mips?: boolean
+
+  /**
+   * Alias for mips. Whether to generate mipmaps.
+   * @default true
+   */
+  generateMipmaps?: boolean
+
+  /**
+   * Hint for the automatic format selector. When true, chooses lower quality
+   * formats like "bc1" or "etc2" instead of "bc7" or "astc".
+   * @default false
+   */
+  preferLowQuality?: boolean
+}
+
+/**
+ * Registers the Spark texture compression plugin with a Three.js GLTFLoader.
+ * This plugin automatically compresses textures during GLTF loading using Spark.
+ *
+ * The plugin analyzes material usage to determine optimal compression formats for each texture:
+ * - Base color textures use RGB or RGBA formats with sRGB encoding
+ * - Normal maps use RG formats
+ * - Metallic/roughness and other PBR textures use appropriate channel formats
+ *
+ * @param loader - The Three.js GLTFLoader instance to register the plugin with
+ * @param spark - A Spark or SparkGL instance to use for texture compression
+ * @param options - Optional encoding options to apply to all textures
+ *
+ * @example
+ * ```typescript
+ * import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
+ * import { SparkGL } from '@ludicon/spark.js';
+ * import { registerSparkLoader } from '@ludicon/spark.js/three-gltf';
+ *
+ * const canvas = document.createElement('canvas');
+ * const gl = canvas.getContext('webgl2');
+ * const spark = SparkGL.create(gl, { cacheTempResources: true });
+ *
+ * const loader = new GLTFLoader();
+ * registerSparkLoader(loader, spark, { mips: true });
+ *
+ * loader.load('model.gltf', (gltf) => {
+ *   scene.add(gltf.scene);
+ * });
+ * ```
+ */
+export function registerSparkLoader(loader: GLTFLoader, spark: Spark | SparkGL, options?: SparkGLTFOptions): void

package/src/three-gltf.js

@@ -185,7 +185,7 @@ class SparkLoader extends THREE.TextureLoader {
         const texture = new THREE.ExternalTexture(gpuTexture)
         if (textureObject.texture !== undefined) {
           texture.format = textureObject.format
-          texture.byteLength = textureObject.byteLength
+          texture.userData.byteLength = textureObject.byteLength
         }
         if (this.format == "rg" && "NormalRGPacking" in THREE) {
           // This is not understood by stock three.js