wuepgg3-track 3.0.3 → 4.0.0

package/dist/{WebGPURenderer-CVU5sf4P.mjs → WebGPURenderer-OAybUJeH.mjs}

@@ -1,14 +1,14 @@
-import { g as E, E as p, f as ae, D as S, c as C, B as T, d as ue, h as A, i as M, w as v, j as y, k as ce, l as de, m as L, n as w, M as k, o as D, p as he, q as pe, s as H, S as z, t as R, A as le, R as fe, e as B } from "./index-lRQCOP9E.mjs";
-import { S as F, l as ge, a as me } from "./colorToUniform-BwrjBKZW.mjs";
-import { c as _e, u as be, U as ye, B as xe, G as Ge, e as Se, R as Be, t as Pe, S as Te, a as Ce } from "./SharedSystems-Czb8QUFv.mjs";
-const x = F.for2d();
-class O {
+import { g as E, E as f, c as L, u as ue, f as ce, D as P, d as v, B as T, h as de, i as A, j as M, w as C, k as x, l as he, m as pe, n as D, o as w, M as k, p as z, q as le, s as fe, t as F, S as I, v as R, A as ge, R as me, e as B } from "./index-BRD1ij9p.mjs";
+import { S as O, l as _e, a as be } from "./colorToUniform-COOzkdM9.mjs";
+import { c as xe, u as ye, U as Ge, B as Pe, G as Be, e as Se, R as Te, t as ve, S as Ce, a as Ue } from "./SharedSystems-CQUTbUIx.mjs";
+const y = O.for2d();
+class W {
   start(e, t, r) {
     const s = e.renderer, i = s.encoder, n = r.gpuProgram;
-    this._shader = r, this._geometry = t, i.setGeometry(t, n), x.blendMode = "normal", s.pipeline.getPipeline(
+    this._shader = r, this._geometry = t, i.setGeometry(t, n), y.blendMode = "normal", s.pipeline.getPipeline(
       t,
       n,
-      x
+      y
     );
     const o = s.globalUniforms.bindGroup;
     i.resetBindGroup(1), i.setBindGroup(0, o, n);
@@ -23,7 +23,7 @@ class O {
         s.limits.maxBatchableTextures
       );
     }
-    x.blendMode = t.blendMode;
+    y.blendMode = t.blendMode;
     const n = s.bindGroup.getBindGroup(
       t.bindGroup,
       r,
@@ -31,21 +31,21 @@ class O {
     ), o = s.pipeline.getPipeline(
       this._geometry,
       r,
-      x,
+      y,
       t.topology
     );
-    t.bindGroup._touch(s.textureGC.count), i.setPipeline(o), i.renderPassEncoder.setBindGroup(1, n), i.renderPassEncoder.drawIndexed(t.size, 1, t.start);
+    t.bindGroup._touch(s.gc.now, s.tick), i.setPipeline(o), i.renderPassEncoder.setBindGroup(1, n), i.renderPassEncoder.drawIndexed(t.size, 1, t.start);
   }
 }
-O.extension = {
+W.extension = {
   type: [
-    p.WebGPUPipesAdaptor
+    f.WebGPUPipesAdaptor
   ],
   name: "batch"
 };
-class I {
+class H {
   constructor(e) {
-    this._hash = /* @__PURE__ */ Object.create(null), this._renderer = e, this._renderer.renderableGC.addManagedHash(this, "_hash");
+    this._hash = /* @__PURE__ */ Object.create(null), this._renderer = e;
   }
   contextChange(e) {
     this._gpu = e;
@@ -56,41 +56,41 @@ class I {
   _createBindGroup(e, t, r) {
     const s = this._gpu.device, i = t.layout[r], n = [], o = this._renderer;
     for (const l in i) {
-      const h = e.resources[l] ?? e.resources[i[l]];
-      let f;
-      if (h._resourceType === "uniformGroup") {
-        const d = h;
+      const p = e.resources[l] ?? e.resources[i[l]];
+      let h;
+      if (p._resourceType === "uniformGroup") {
+        const d = p;
         o.ubo.updateUniformGroup(d);
         const _ = d.buffer;
-        f = {
+        h = {
           buffer: o.buffer.getGPUBuffer(_),
           offset: 0,
           size: _.descriptor.size
         };
-      } else if (h._resourceType === "buffer") {
-        const d = h;
-        f = {
+      } else if (p._resourceType === "buffer") {
+        const d = p;
+        h = {
           buffer: o.buffer.getGPUBuffer(d),
           offset: 0,
           size: d.descriptor.size
         };
-      } else if (h._resourceType === "bufferResource") {
-        const d = h;
-        f = {
+      } else if (p._resourceType === "bufferResource") {
+        const d = p;
+        h = {
           buffer: o.buffer.getGPUBuffer(d.buffer),
           offset: d.offset,
           size: d.size
         };
-      } else if (h._resourceType === "textureSampler") {
-        const d = h;
-        f = o.texture.getGpuSampler(d);
-      } else if (h._resourceType === "textureSource") {
-        const d = h;
-        f = o.texture.getGpuSource(d).createView({});
+      } else if (p._resourceType === "textureSampler") {
+        const d = p;
+        h = o.texture.getGpuSampler(d);
+      } else if (p._resourceType === "textureSource") {
+        const d = p;
+        h = o.texture.getGpuSource(d).createView();
       }
       n.push({
         binding: i[l],
-        resource: f
+        resource: h
       });
     }
     const u = o.shader.getProgramData(t).bindGroups[r], c = s.createBindGroup({
@@ -100,29 +100,41 @@ class I {
     return this._hash[e._key] = c, c;
   }
   destroy() {
-    for (const e of Object.keys(this._hash))
-      this._hash[e] = null;
     this._hash = null, this._renderer = null;
   }
 }
-I.extension = {
+H.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "bindGroup"
 };
-class W {
+class Me {
   constructor(e) {
-    this._gpuBuffers = /* @__PURE__ */ Object.create(null), e.renderableGC.addManagedHash(this, "_gpuBuffers");
+    this.gpuBuffer = e;
+  }
+  destroy() {
+    this.gpuBuffer.destroy(), this.gpuBuffer = null;
+  }
+}
+class V {
+  constructor(e) {
+    this._renderer = e, this._managedBuffers = new L({
+      renderer: e,
+      type: "resource",
+      onUnload: this.onBufferUnload.bind(this),
+      name: "gpuBuffer"
+    });
   }
   contextChange(e) {
     this._gpu = e;
   }
   getGPUBuffer(e) {
-    return this._gpuBuffers[e.uid] || this.createGPUBuffer(e);
+    var t;
+    return e._gcLastUsed = this._renderer.gc.now, ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuBuffer) || this.createGPUBuffer(e);
   }
   updateBuffer(e) {
-    const t = this._gpuBuffers[e.uid] || this.createGPUBuffer(e), r = e.data;
+    const t = this.getGPUBuffer(e), r = e.data;
     return e._updateID && r && (e._updateID = 0, this._gpu.device.queue.writeBuffer(
       t,
       0,
@@ -134,42 +146,29 @@ class W {
   }
   /** dispose all WebGL resources of all managed buffers */
   destroyAll() {
-    var e;
-    for (const t in this._gpuBuffers)
-      (e = this._gpuBuffers[t]) == null || e.destroy();
-    this._gpuBuffers = {};
+    this._managedBuffers.removeAll();
+  }
+  onBufferUnload(e) {
+    e.off("update", this.updateBuffer, this), e.off("change", this.onBufferChange, this);
   }
   createGPUBuffer(e) {
-    this._gpuBuffers[e.uid] || (e.on("update", this.updateBuffer, this), e.on("change", this.onBufferChange, this), e.on("destroy", this.onBufferDestroy, this));
     const t = this._gpu.device.createBuffer(e.descriptor);
-    return e._updateID = 0, e.data && (ae(e.data.buffer, t.getMappedRange()), t.unmap()), this._gpuBuffers[e.uid] = t, t;
+    return e._updateID = 0, e._resourceId = ue("resource"), e.data && (ce(e.data.buffer, t.getMappedRange()), t.unmap()), e._gpuData[this._renderer.uid] = new Me(t), this._managedBuffers.add(e) && (e.on("update", this.updateBuffer, this), e.on("change", this.onBufferChange, this)), t;
   }
   onBufferChange(e) {
-    this._gpuBuffers[e.uid].destroy(), e._updateID = 0, this._gpuBuffers[e.uid] = this.createGPUBuffer(e);
-  }
-  /**
-   * Disposes buffer
-   * @param buffer - buffer with data
-   */
-  onBufferDestroy(e) {
-    this._destroyBuffer(e);
+    this._managedBuffers.remove(e), e._updateID = 0, this.createGPUBuffer(e);
   }
   destroy() {
-    this.destroyAll(), this._gpuBuffers = {};
-  }
-  _destroyBuffer(e) {
-    if (e.off("update", this.updateBuffer, this), e.off("change", this.onBufferChange, this), e.off("destroy", this.onBufferDestroy, this), !this._gpuBuffers[e.uid])
-      return;
-    this._gpuBuffers[e.uid].destroy(), this._gpuBuffers[e.uid] = null;
+    this._managedBuffers.destroy(), this._renderer = null, this._gpu = null;
   }
 }
-W.extension = {
+V.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "buffer"
 };
-class ve {
+class we {
   constructor({ minUniformOffsetAlignment: e }) {
     this._minUniformOffsetAlignment = 256, this.byteIndex = 0, this._minUniformOffsetAlignment = e, this.data = new Float32Array(65535);
   }
@@ -195,7 +194,7 @@ class ve {
     this.data = null;
   }
 }
-class V {
+class N {
   constructor(e) {
     this._colorMaskCache = 15, this._renderer = e;
   }
@@ -206,9 +205,9 @@ class V {
     this._renderer = null, this._colorMaskCache = null;
   }
 }
-V.extension = {
+N.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "colorMask"
 };
@@ -239,7 +238,7 @@ class U {
    * @returns {WebGLRenderingContext} the WebGL context
    */
   async _createDeviceAndAdaptor(e) {
-    const t = await S.get().getNavigator().gpu.requestAdapter({
+    const t = await P.get().getNavigator().gpu.requestAdapter({
       powerPreference: e.powerPreference,
       forceFallbackAdapter: e.forceFallbackAdapter
     }), r = [
@@ -257,7 +256,7 @@ class U {
 }
 U.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "device"
 };
@@ -273,7 +272,7 @@ U.defaultOptions = {
    */
   forceFallbackAdapter: !1
 };
-class N {
+class j {
   constructor(e) {
     this._boundBindGroup = /* @__PURE__ */ Object.create(null), this._boundVertexBuffer = /* @__PURE__ */ Object.create(null), this._renderer = e;
   }
@@ -314,7 +313,7 @@ class N {
   setBindGroup(e, t, r) {
     if (this._boundBindGroup[e] === t)
       return;
-    this._boundBindGroup[e] = t, t._touch(this._renderer.textureGC.count);
+    this._boundBindGroup[e] = t, t._touch(this._renderer.gc.now, this._renderer.tick);
     const s = this._renderer.bindGroup.getBindGroup(t, r, e);
     this.renderPassEncoder.setBindGroup(e, s);
   }
@@ -382,12 +381,12 @@ class N {
     this._gpu = e;
   }
 }
-N.extension = {
-  type: [p.WebGPUSystem],
+j.extension = {
+  type: [f.WebGPUSystem],
   name: "encoder",
   priority: 1
 };
-class j {
+class K {
   constructor(e) {
     this._renderer = e;
   }
@@ -397,20 +396,20 @@ class j {
   destroy() {
   }
 }
-j.extension = {
+K.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "limits"
 };
-class K {
+class q {
   constructor(e) {
     this._renderTargetStencilState = /* @__PURE__ */ Object.create(null), this._renderer = e, e.renderTarget.onRenderTargetChange.add(this);
   }
   onRenderTargetChange(e) {
     let t = this._renderTargetStencilState[e.uid];
     t || (t = this._renderTargetStencilState[e.uid] = {
-      stencilMode: C.DISABLED,
+      stencilMode: v.DISABLED,
       stencilReference: 0
     }), this._activeRenderTarget = e, this.setStencilMode(t.stencilMode, t.stencilReference);
   }
@@ -424,9 +423,9 @@ class K {
     this._renderer.renderTarget.onRenderTargetChange.remove(this), this._renderer = null, this._activeRenderTarget = null, this._renderTargetStencilState = null;
   }
 }
-K.extension = {
+q.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "stencil"
 };
@@ -466,7 +465,7 @@ const G = {
   "mat4x4<f32>": { align: 16, size: 64 },
   "mat4x4<f16>": { align: 8, size: 32 }
 };
-function Ue(a) {
+function Re(a) {
   const e = a.map((r) => ({
     data: r,
     offset: 0,
@@ -483,7 +482,7 @@ function Ue(a) {
   }
   return t = Math.ceil(t / 16) * 16, { uboElements: e, size: t };
 }
-function Me(a, e) {
+function Ee(a, e) {
   const { size: t, align: r } = G[a.data.type], s = (r - t) / 4, i = a.data.type.indexOf("i32") >= 0 ? "dataInt32" : "data";
   return `
          v = uv.${a.data.name};
@@ -503,34 +502,34 @@ function Me(a, e) {
          }
      `;
 }
-function we(a) {
-  return _e(
+function Le(a) {
+  return xe(
     a,
     "uboWgsl",
-    Me,
-    be
+    Ee,
+    ye
   );
 }
-class q extends ye {
+class Y extends Ge {
   constructor() {
     super({
-      createUboElements: Ue,
-      generateUboSync: we
+      createUboElements: Re,
+      generateUboSync: Le
     });
   }
 }
-q.extension = {
-  type: [p.WebGPUSystem],
+Y.extension = {
+  type: [f.WebGPUSystem],
   name: "ubo"
 };
 const b = 128;
-class Y {
+class $ {
   constructor(e) {
-    this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._buffers = [], this._bindGroups = [], this._bufferResources = [], this._renderer = e, this._renderer.renderableGC.addManagedHash(this, "_bindGroupHash"), this._batchBuffer = new ve({ minUniformOffsetAlignment: b });
+    this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._buffers = [], this._bindGroups = [], this._bufferResources = [], this._renderer = e, this._batchBuffer = new we({ minUniformOffsetAlignment: b });
     const t = 256 / b;
     for (let r = 0; r < t; r++) {
       let s = T.UNIFORM | T.COPY_DST;
-      r === 0 && (s |= T.COPY_SRC), this._buffers.push(new ue({
+      r === 0 && (s |= T.COPY_SRC), this._buffers.push(new de({
         data: this._batchBuffer.data,
         usage: s
       }));
@@ -540,9 +539,7 @@ class Y {
     this._uploadBindGroups(), this._resetBindGroups();
   }
   _resetBindGroups() {
-    for (const e in this._bindGroupHash)
-      this._bindGroupHash[e] = null;
-    this._batchBuffer.clear();
+    this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._batchBuffer.clear();
   }
   // just works for single bind groups for now
   getUniformBindGroup(e, t) {
@@ -568,7 +565,7 @@ class Y {
   _getBufferResource(e) {
     if (!this._bufferResources[e]) {
       const t = this._buffers[e % 2];
-      this._bufferResources[e] = new xe({
+      this._bufferResources[e] = new Pe({
         buffer: t,
         offset: (e / 2 | 0) * 256,
         size: b
@@ -611,46 +608,46 @@ class Y {
     this._buffers = null;
     for (let t = 0; t < this._bufferResources.length; t++)
       this._bufferResources[t].destroy();
-    this._bufferResources = null, this._batchBuffer.destroy(), this._bindGroupHash = null, this._renderer = null;
+    this._bufferResources = null, this._batchBuffer.destroy(), this._renderer = null;
   }
 }
-Y.extension = {
+$.extension = {
   type: [
-    p.WebGPUPipes
+    f.WebGPUPipes
   ],
   name: "uniformBatch"
 };
-const Re = {
+const Ae = {
   "point-list": 0,
   "line-list": 1,
   "line-strip": 2,
   "triangle-list": 3,
   "triangle-strip": 4
 };
-function Ee(a, e, t, r, s) {
+function De(a, e, t, r, s) {
   return a << 24 | e << 16 | t << 10 | r << 5 | s;
 }
-function Ae(a, e, t, r) {
-  return t << 6 | a << 3 | r << 1 | e;
+function ke(a, e, t, r, s) {
+  return t << 8 | a << 5 | r << 3 | s << 1 | e;
 }
-class $ {
+class X {
   constructor(e) {
-    this._moduleCache = /* @__PURE__ */ Object.create(null), this._bufferLayoutsCache = /* @__PURE__ */ Object.create(null), this._bindingNamesCache = /* @__PURE__ */ Object.create(null), this._pipeCache = /* @__PURE__ */ Object.create(null), this._pipeStateCaches = /* @__PURE__ */ Object.create(null), this._colorMask = 15, this._multisampleCount = 1, this._renderer = e;
+    this._moduleCache = /* @__PURE__ */ Object.create(null), this._bufferLayoutsCache = /* @__PURE__ */ Object.create(null), this._bindingNamesCache = /* @__PURE__ */ Object.create(null), this._pipeCache = /* @__PURE__ */ Object.create(null), this._pipeStateCaches = /* @__PURE__ */ Object.create(null), this._colorMask = 15, this._multisampleCount = 1, this._colorTargetCount = 1, this._renderer = e;
   }
   contextChange(e) {
-    this._gpu = e, this.setStencilMode(C.DISABLED), this._updatePipeHash();
+    this._gpu = e, this.setStencilMode(v.DISABLED), this._updatePipeHash();
   }
   setMultisampleCount(e) {
     this._multisampleCount !== e && (this._multisampleCount = e, this._updatePipeHash());
   }
   setRenderTarget(e) {
-    this._multisampleCount = e.msaaSamples, this._depthStencilAttachment = e.descriptor.depthStencilAttachment ? 1 : 0, this._updatePipeHash();
+    this._multisampleCount = e.msaaSamples, this._depthStencilAttachment = e.descriptor.depthStencilAttachment ? 1 : 0, this._colorTargetCount = e.colorTargetCount, this._updatePipeHash();
   }
   setColorMask(e) {
     this._colorMask !== e && (this._colorMask = e, this._updatePipeHash());
   }
   setStencilMode(e) {
-    this._stencilMode !== e && (this._stencilMode = e, this._stencilState = Ge[e], this._updatePipeHash());
+    this._stencilMode !== e && (this._stencilMode = e, this._stencilState = Be[e], this._updatePipeHash());
   }
   setPipeline(e, t, r, s) {
     const i = this.getPipeline(e, t, r);
@@ -658,19 +655,20 @@ class $ {
   }
   getPipeline(e, t, r, s) {
     e._layoutKey || (Se(e, t.attributeData), this._generateBufferKey(e)), s || (s = e.topology);
-    const i = Ee(
+    const i = De(
       e._layoutKey,
       t._layoutKey,
       r.data,
       r._blendModeId,
-      Re[s]
+      Ae[s]
     );
     return this._pipeCache[i] ? this._pipeCache[i] : (this._pipeCache[i] = this._createPipeline(e, t, r, s), this._pipeCache[i]);
   }
   _createPipeline(e, t, r, s) {
-    const i = this._gpu.device, n = this._createVertexBufferLayouts(e, t), o = this._renderer.state.getColorTargets(r);
-    o[0].writeMask = this._stencilMode === C.RENDERING_MASK_ADD ? 0 : this._colorMask;
-    const u = this._renderer.shader.getProgramData(t).pipeline, c = {
+    const i = this._gpu.device, n = this._createVertexBufferLayouts(e, t), o = this._renderer.state.getColorTargets(r, this._colorTargetCount), u = this._stencilMode === v.RENDERING_MASK_ADD ? 0 : this._colorMask;
+    for (let h = 0; h < o.length; h++)
+      o[h].writeMask = u;
+    const c = this._renderer.shader.getProgramData(t).pipeline, l = {
       // TODO later check if its helpful to create..
       // layout,
       vertex: {
@@ -688,19 +686,19 @@ class $ {
         topology: s,
         cullMode: r.cullMode
       },
-      layout: u,
+      layout: c,
       multisample: {
         count: this._multisampleCount
       },
       // depthStencil,
       label: "PIXI Pipeline"
     };
-    return this._depthStencilAttachment && (c.depthStencil = {
+    return this._depthStencilAttachment && (l.depthStencil = {
       ...this._stencilState,
       format: "depth24plus-stencil8",
       depthWriteEnabled: r.depthTest,
       depthCompare: r.depthTest ? "less" : "always"
-    }), i.createRenderPipeline(c);
+    }), i.createRenderPipeline(l);
   }
   _getModule(e) {
     return this._moduleCache[e] || this._createModule(e);
@@ -769,7 +767,7 @@ class $ {
       }, o = n.attributes;
       for (const u in t.attributeData) {
         const c = e.attributes[u];
-        (c.divisor ?? 1) !== 1 && v(`Attribute ${u} has an invalid divisor value of '${c.divisor}'. WebGPU only supports a divisor value of 1`), c.buffer === i && (n.arrayStride = c.stride, n.stepMode = c.instance ? "instance" : "vertex", o.push({
+        (c.divisor ?? 1) !== 1 && C(`Attribute ${u} has an invalid divisor value of '${c.divisor}'. WebGPU only supports a divisor value of 1`), c.buffer === i && (n.arrayStride = c.stride, n.stepMode = c.instance ? "instance" : "vertex", o.push({
           shaderLocation: t.attributeData[u].location,
           offset: c.offset,
           format: c.format
@@ -779,11 +777,12 @@ class $ {
     }), this._bufferLayoutsCache[r] = s, s;
   }
   _updatePipeHash() {
-    const e = Ae(
+    const e = ke(
       this._stencilMode,
       this._multisampleCount,
       this._colorMask,
-      this._depthStencilAttachment
+      this._depthStencilAttachment,
+      this._colorTargetCount
     );
     this._pipeStateCaches[e] || (this._pipeStateCaches[e] = /* @__PURE__ */ Object.create(null)), this._pipeCache = this._pipeStateCaches[e];
   }
@@ -791,16 +790,16 @@ class $ {
     this._renderer = null, this._bufferLayoutsCache = null;
   }
 }
-$.extension = {
-  type: [p.WebGPUSystem],
+X.extension = {
+  type: [f.WebGPUSystem],
   name: "pipeline"
 };
-class Le {
+class ze {
   constructor() {
     this.contexts = [], this.msaaTextures = [], this.msaaSamples = 1;
   }
 }
-class ke {
+class Fe {
   init(e, t) {
     this._renderer = e, this._renderTargetSystem = t;
   }
@@ -842,19 +841,19 @@ class ke {
     );
   }
   getDescriptor(e, t, r) {
-    typeof t == "boolean" && (t = t ? y.ALL : y.NONE);
+    typeof t == "boolean" && (t = t ? x.ALL : x.NONE);
     const s = this._renderTargetSystem, i = s.getGpuRenderTarget(e), n = e.colorTextures.map(
       (c, l) => {
-        const h = i.contexts[l];
-        let f, d;
-        h ? f = h.getCurrentTexture().createView() : f = this._renderer.texture.getGpuSource(c).createView({
+        const p = i.contexts[l];
+        let h, d;
+        p ? h = p.getCurrentTexture().createView() : h = this._renderer.texture.getGpuSource(c).createView({
           mipLevelCount: 1
-        }), i.msaaTextures[l] && (d = f, f = this._renderer.texture.getTextureView(
+        }), i.msaaTextures[l] && (d = h, h = this._renderer.texture.getTextureView(
           i.msaaTextures[l]
         ));
-        const _ = t & y.COLOR ? "clear" : "load";
+        const _ = t & x.COLOR ? "clear" : "load";
         return r ?? (r = s.defaultClearColor), {
-          view: f,
+          view: h,
           resolveTarget: d,
           clearValue: r,
           storeOp: "store",
@@ -864,7 +863,7 @@ class ke {
     );
     let o;
     if ((e.stencil || e.depth) && !e.depthStencilTexture && (e.ensureDepthStencilTexture(), e.depthStencilTexture.source.sampleCount = i.msaa ? 4 : 1), e.depthStencilTexture) {
-      const c = t & y.STENCIL ? "clear" : "load", l = t & y.DEPTH ? "clear" : "load";
+      const c = t & x.STENCIL ? "clear" : "load", l = t & x.DEPTH ? "clear" : "load";
       o = {
         view: this._renderer.texture.getGpuSource(e.depthStencilTexture.source).createView(),
         stencilStoreOp: "store",
@@ -884,18 +883,18 @@ class ke {
       return;
     const { gpu: i, encoder: n } = this._renderer, o = i.device;
     if (n.commandEncoder === null) {
-      const c = o.createCommandEncoder(), l = this.getDescriptor(e, t, r), h = c.beginRenderPass(l);
-      h.setViewport(s.x, s.y, s.width, s.height, 0, 1), h.end();
-      const f = c.finish();
-      o.queue.submit([f]);
+      const c = o.createCommandEncoder(), l = this.getDescriptor(e, t, r), p = c.beginRenderPass(l);
+      p.setViewport(s.x, s.y, s.width, s.height, 0, 1), p.end();
+      const h = c.finish();
+      o.queue.submit([h]);
     } else
       this.startRenderPass(e, t, r, s);
   }
   initGpuRenderTarget(e) {
     e.isRoot = !0;
-    const t = new Le();
-    return e.colorTextures.forEach((r, s) => {
-      if (r instanceof ce) {
+    const t = new ze();
+    return t.colorTargetCount = e.colorTextures.length, e.colorTextures.forEach((r, s) => {
+      if (r instanceof he) {
         const i = r.resource.getContext(
           "webgpu"
         ), n = r.transparent ? "premultiplied" : "opaque";
@@ -912,7 +911,7 @@ class ke {
         t.contexts[s] = i;
       }
       if (t.msaa = r.source.antialias, r.source.antialias) {
-        const i = new de({
+        const i = new pe({
           width: 0,
           height: 0,
           sampleCount: 4
@@ -944,16 +943,16 @@ class ke {
     });
   }
 }
-class X extends Be {
+class Z extends Te {
   constructor(e) {
-    super(e), this.adaptor = new ke(), this.adaptor.init(e, this);
+    super(e), this.adaptor = new Fe(), this.adaptor.init(e, this);
   }
 }
-X.extension = {
-  type: [p.WebGPUSystem],
+Z.extension = {
+  type: [f.WebGPUSystem],
   name: "renderTarget"
 };
-class Z {
+class J {
   constructor() {
     this._gpuProgramData = /* @__PURE__ */ Object.create(null);
   }
@@ -974,9 +973,9 @@ class Z {
     this._gpu = null, this._gpuProgramData = null;
   }
 }
-Z.extension = {
+J.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "shader"
 };
@@ -1125,9 +1124,9 @@ g.max = {
     operation: "max"
   }
 };
-class J {
+class Q {
   constructor() {
-    this.defaultState = new F(), this.defaultState.blend = !0;
+    this.defaultState = new O(), this.defaultState.blend = !0;
   }
   contextChange(e) {
     this.gpu = e;
@@ -1135,27 +1134,29 @@ class J {
   /**
    * Gets the blend mode data for the current state
    * @param state - The state to get the blend mode from
+   * @param count - The number of color targets to create
    */
-  getColorTargets(e) {
-    return [
-      {
-        format: "bgra8unorm",
-        writeMask: 0,
-        blend: g[e.blendMode] || g.normal
-      }
-    ];
+  getColorTargets(e, t) {
+    const r = g[e.blendMode] || g.normal, s = [], i = {
+      format: "bgra8unorm",
+      writeMask: 0,
+      blend: r
+    };
+    for (let n = 0; n < t; n++)
+      s[n] = i;
+    return s;
   }
   destroy() {
     this.gpu = null;
   }
 }
-J.extension = {
+Q.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "state"
 };
-const De = {
+const Ie = {
   type: "image",
   upload(a, e, t) {
     const r = a.resource, s = (a.pixelWidth | 0) * (a.pixelHeight | 0), i = r.byteLength / s;
@@ -1174,7 +1175,7 @@ const De = {
       }
     );
   }
-}, Q = {
+}, ee = {
   "bc1-rgba-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
   "bc2-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
   "bc3-rgba-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
@@ -1182,11 +1183,11 @@ const De = {
   "etc1-rgb-unorm": { blockBytes: 8, blockWidth: 4, blockHeight: 4 },
   "etc2-rgba8unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 },
   "astc-4x4-unorm": { blockBytes: 16, blockWidth: 4, blockHeight: 4 }
-}, He = { blockBytes: 4, blockWidth: 1, blockHeight: 1 }, ze = {
+}, Oe = { blockBytes: 4, blockWidth: 1, blockHeight: 1 }, We = {
   type: "compressed",
   upload(a, e, t) {
     let r = a.pixelWidth, s = a.pixelHeight;
-    const i = Q[a.format] || He;
+    const i = ee[a.format] || Oe;
     for (let n = 0; n < a.resource.length; n++) {
       const o = a.resource[n], u = Math.ceil(r / i.blockWidth) * i.blockBytes;
       t.device.queue.writeTexture(
@@ -1207,15 +1208,15 @@ const De = {
       ), r = Math.max(r >> 1, 1), s = Math.max(s >> 1, 1);
     }
   }
-}, ee = {
+}, te = {
   type: "image",
   upload(a, e, t) {
     const r = a.resource;
     if (!r)
       return;
     if (globalThis.HTMLImageElement && r instanceof HTMLImageElement) {
-      const o = S.get().createCanvas(r.width, r.height);
-      o.getContext("2d").drawImage(r, 0, 0, r.width, r.height), a.resource = o, v("ImageSource: Image element passed, converting to canvas and replacing resource.");
+      const o = P.get().createCanvas(r.width, r.height);
+      o.getContext("2d").drawImage(r, 0, 0, r.width, r.height), a.resource = o, C("ImageSource: Image element passed, converting to canvas and replacing resource.");
     }
     const s = Math.min(e.width, a.resourceWidth || a.pixelWidth), i = Math.min(e.height, a.resourceHeight || a.pixelHeight), n = a.alphaMode === "premultiply-alpha-on-upload";
     t.device.queue.copyExternalImageToTexture(
@@ -1227,13 +1228,13 @@ const De = {
       }
     );
   }
-}, Fe = {
+}, He = {
   type: "video",
   upload(a, e, t) {
-    ee.upload(a, e, t);
+    te.upload(a, e, t);
   }
 };
-class Oe {
+class Ve {
   constructor(e) {
     this.device = e, this.sampler = e.createSampler({ minFilter: "linear" }), this.pipelines = {};
   }
@@ -1314,8 +1315,8 @@ class Oe {
         baseArrayLayer: u,
         arrayLayerCount: 1
       }), l = i ? 1 : 0;
-      for (let h = 1; h < e.mipLevelCount; ++h) {
-        const f = r.createView({
+      for (let p = 1; p < e.mipLevelCount; ++p) {
+        const h = r.createView({
           baseMipLevel: l++,
           mipLevelCount: 1,
           dimension: "2d",
@@ -1323,7 +1324,7 @@ class Oe {
           arrayLayerCount: 1
         }), d = n.beginRenderPass({
           colorAttachments: [{
-            view: f,
+            view: h,
             storeOp: "store",
             loadOp: "clear",
             clearValue: { r: 0, g: 0, b: 0, a: 0 }
@@ -1338,7 +1339,7 @@ class Oe {
             resource: c
           }]
         });
-        d.setPipeline(t), d.setBindGroup(0, _), d.draw(3, 1, 0, 0), d.end(), c = f;
+        d.setPipeline(t), d.setBindGroup(0, _), d.draw(3, 1, 0, 0), d.end(), c = h;
       }
     }
     if (!i) {
@@ -1359,14 +1360,34 @@ class Oe {
     return this.device.queue.submit([n.finish()]), i || r.destroy(), e;
   }
 }
-class te {
+class Ne {
   constructor(e) {
-    this.managedTextures = [], this._gpuSources = /* @__PURE__ */ Object.create(null), this._gpuSamplers = /* @__PURE__ */ Object.create(null), this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._textureViewHash = /* @__PURE__ */ Object.create(null), this._uploads = {
-      image: ee,
-      buffer: De,
-      video: Fe,
-      compressed: ze
-    }, this._renderer = e, e.renderableGC.addManagedHash(this, "_gpuSources"), e.renderableGC.addManagedHash(this, "_gpuSamplers"), e.renderableGC.addManagedHash(this, "_bindGroupHash"), e.renderableGC.addManagedHash(this, "_textureViewHash");
+    this.textureView = null, this.gpuTexture = e;
+  }
+  /** Destroys this GPU data instance. */
+  destroy() {
+    this.gpuTexture.destroy(), this.textureView = null, this.gpuTexture = null;
+  }
+}
+class re {
+  constructor(e) {
+    this._gpuSamplers = /* @__PURE__ */ Object.create(null), this._bindGroupHash = /* @__PURE__ */ Object.create(null), this._uploads = {
+      image: te,
+      buffer: Ie,
+      video: He,
+      compressed: We
+    }, this._renderer = e, e.renderableGC.addManagedHash(this, "_bindGroupHash"), this._managedTextures = new L({
+      renderer: e,
+      type: "resource",
+      onUnload: this.onSourceUnload.bind(this),
+      name: "gpuTextureSource"
+    });
+  }
+  /**
+   * @deprecated since 8.15.0
+   */
+  get managedTextures() {
+    return Object.values(this._managedTextures.items);
   }
   contextChange(e) {
     this._gpu = e;
@@ -1377,16 +1398,17 @@ class te {
    * @returns The initialized texture source.
    */
   initSource(e) {
-    return this._gpuSources[e.uid] ? this._gpuSources[e.uid] : this._initSource(e);
+    var t;
+    return ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuTexture) || this._initSource(e);
   }
   _initSource(e) {
     if (e.autoGenerateMipmaps) {
-      const u = Math.max(e.pixelWidth, e.pixelHeight);
-      e.mipLevelCount = Math.floor(Math.log2(u)) + 1;
+      const c = Math.max(e.pixelWidth, e.pixelHeight);
+      e.mipLevelCount = Math.floor(Math.log2(c)) + 1;
     }
     let t = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST;
     e.uploadMethodId !== "compressed" && (t |= GPUTextureUsage.RENDER_ATTACHMENT, t |= GPUTextureUsage.COPY_SRC);
-    const r = Q[e.format] || { blockWidth: 1, blockHeight: 1 }, s = Math.ceil(e.pixelWidth / r.blockWidth) * r.blockWidth, i = Math.ceil(e.pixelHeight / r.blockHeight) * r.blockHeight, n = {
+    const r = ee[e.format] || { blockWidth: 1, blockHeight: 1 }, s = Math.ceil(e.pixelWidth / r.blockWidth) * r.blockWidth, i = Math.ceil(e.pixelHeight / r.blockHeight) * r.blockHeight, n = {
       label: e.label,
       size: { width: s, height: i },
       format: e.format,
@@ -1394,28 +1416,25 @@ class te {
       mipLevelCount: e.mipLevelCount,
       dimension: e.dimension,
       usage: t
-    }, o = this._gpuSources[e.uid] = this._gpu.device.createTexture(n);
-    return this.managedTextures.includes(e) || (e.on("update", this.onSourceUpdate, this), e.on("resize", this.onSourceResize, this), e.on("destroy", this.onSourceDestroy, this), e.on("unload", this.onSourceUnload, this), e.on("updateMipmaps", this.onUpdateMipmaps, this), this.managedTextures.push(e)), this.onSourceUpdate(e), o;
+    }, o = this._gpu.device.createTexture(n);
+    return e._gpuData[this._renderer.uid] = new Ne(o), this._managedTextures.add(e) && (e.on("update", this.onSourceUpdate, this), e.on("resize", this.onSourceResize, this), e.on("updateMipmaps", this.onUpdateMipmaps, this)), this.onSourceUpdate(e), o;
   }
   onSourceUpdate(e) {
     const t = this.getGpuSource(e);
     t && (this._uploads[e.uploadMethodId] && this._uploads[e.uploadMethodId].upload(e, t, this._gpu), e.autoGenerateMipmaps && e.mipLevelCount > 1 && this.onUpdateMipmaps(e));
   }
-  onSourceUnload(e) {
-    const t = this._gpuSources[e.uid];
-    t && (this._gpuSources[e.uid] = null, t.destroy());
-  }
   onUpdateMipmaps(e) {
-    this._mipmapGenerator || (this._mipmapGenerator = new Oe(this._gpu.device));
+    this._mipmapGenerator || (this._mipmapGenerator = new Ve(this._gpu.device));
     const t = this.getGpuSource(e);
     this._mipmapGenerator.generateMipmap(t);
   }
-  onSourceDestroy(e) {
-    e.off("update", this.onSourceUpdate, this), e.off("unload", this.onSourceUnload, this), e.off("destroy", this.onSourceDestroy, this), e.off("resize", this.onSourceResize, this), e.off("updateMipmaps", this.onUpdateMipmaps, this), this.managedTextures.splice(this.managedTextures.indexOf(e), 1), this.onSourceUnload(e);
+  onSourceUnload(e) {
+    e.off("update", this.onSourceUpdate, this), e.off("resize", this.onSourceResize, this), e.off("updateMipmaps", this.onUpdateMipmaps, this);
   }
   onSourceResize(e) {
-    const t = this._gpuSources[e.uid];
-    t ? (t.width !== e.pixelWidth || t.height !== e.pixelHeight) && (this._textureViewHash[e.uid] = null, this._bindGroupHash[e.uid] = null, this.onSourceUnload(e), this.initSource(e)) : this.initSource(e);
+    e._gcLastUsed = this._renderer.gc.now;
+    const t = e._gpuData[this._renderer.uid], r = t == null ? void 0 : t.gpuTexture;
+    r ? (r.width !== e.pixelWidth || r.height !== e.pixelHeight) && (t.destroy(), this._bindGroupHash[e.uid] = null, e._gpuData[this._renderer.uid] = null, this.initSource(e)) : this.initSource(e);
   }
   _initSampler(e) {
     return this._gpuSamplers[e._resourceId] = this._gpu.device.createSampler(e), this._gpuSamplers[e._resourceId];
@@ -1424,7 +1443,8 @@ class te {
     return this._gpuSamplers[e._resourceId] || this._initSampler(e);
   }
   getGpuSource(e) {
-    return this._gpuSources[e.uid] || this.initSource(e);
+    var t;
+    return e._gcLastUsed = this._renderer.gc.now, ((t = e._gpuData[this._renderer.uid]) == null ? void 0 : t.gpuTexture) || this.initSource(e);
   }
   /**
    * this returns s bind group for a specific texture, the bind group contains
@@ -1436,33 +1456,32 @@ class te {
    * @returns the bind group for the texture
    */
   getTextureBindGroup(e) {
-    return this._bindGroupHash[e.uid] ?? this._createTextureBindGroup(e);
+    return this._bindGroupHash[e.uid] || this._createTextureBindGroup(e);
   }
   _createTextureBindGroup(e) {
     const t = e.source;
     return this._bindGroupHash[e.uid] = new A({
       0: t,
       1: t.style,
-      2: new L({
+      2: new D({
         uTextureMatrix: { type: "mat3x3<f32>", value: e.textureMatrix.mapCoord }
       })
     }), this._bindGroupHash[e.uid];
   }
   getTextureView(e) {
     const t = e.source;
-    return this._textureViewHash[t.uid] ?? this._createTextureView(t);
-  }
-  _createTextureView(e) {
-    return this._textureViewHash[e.uid] = this.getGpuSource(e).createView(), this._textureViewHash[e.uid];
+    t._gcLastUsed = this._renderer.gc.now;
+    let r = t._gpuData[this._renderer.uid], s = null;
+    return r || (this.initSource(t), r = t._gpuData[this._renderer.uid]), s = r.textureView || r.gpuTexture.createView(), s;
   }
   generateCanvas(e) {
-    const t = this._renderer, r = t.gpu.device.createCommandEncoder(), s = S.get().createCanvas();
+    const t = this._renderer, r = t.gpu.device.createCommandEncoder(), s = P.get().createCanvas();
     s.width = e.source.pixelWidth, s.height = e.source.pixelHeight;
     const i = s.getContext("webgpu");
     return i.configure({
       device: t.gpu.device,
       usage: GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC,
-      format: S.get().getNavigator().gpu.getPreferredCanvasFormat(),
+      format: P.get().getNavigator().gpu.getPreferredCanvasFormat(),
       alphaMode: "premultiplied"
     }), r.copyTextureToTexture({
       texture: t.texture.getGpuSource(e.source),
@@ -1484,41 +1503,41 @@ class te {
     return w.returnCanvasAndContext(r), { pixels: u, width: i, height: n };
   }
   destroy() {
-    this.managedTextures.slice().forEach((e) => this.onSourceDestroy(e)), this.managedTextures = null;
+    this._managedTextures.destroy();
     for (const e of Object.keys(this._bindGroupHash)) {
       const t = Number(e), r = this._bindGroupHash[t];
-      r == null || r.destroy(), this._bindGroupHash[t] = null;
+      r == null || r.destroy();
     }
-    this._renderer = null, this._gpu = null, this._mipmapGenerator = null, this._gpuSources = null, this._bindGroupHash = null, this._textureViewHash = null, this._gpuSamplers = null;
+    this._renderer = null, this._gpu = null, this._mipmapGenerator = null, this._gpuSamplers = null, this._bindGroupHash = null;
   }
 }
-te.extension = {
+re.extension = {
   type: [
-    p.WebGPUSystem
+    f.WebGPUSystem
   ],
   name: "texture"
 };
-class re {
+class se {
   constructor() {
     this._maxTextures = 0;
   }
   contextChange(e) {
-    const t = new L({
+    const t = new D({
       uTransformMatrix: { value: new k(), type: "mat3x3<f32>" },
       uColor: { value: new Float32Array([1, 1, 1, 1]), type: "vec4<f32>" },
       uRound: { value: 0, type: "f32" }
     });
     this._maxTextures = e.limits.maxBatchableTextures;
-    const r = D({
+    const r = z({
       name: "graphics",
       bits: [
-        he,
-        pe(this._maxTextures),
-        ge,
-        H
+        le,
+        fe(this._maxTextures),
+        _e,
+        F
       ]
     });
-    this.shader = new z({
+    this.shader = new I({
       gpuProgram: r,
       resources: {
         // added on the fly!
@@ -1534,22 +1553,22 @@ class re {
     c.setGeometry(o.geometry, s.gpuProgram);
     const l = i.globalUniforms.bindGroup;
     c.setBindGroup(0, l, s.gpuProgram);
-    const h = i.renderPipes.uniformBatch.getUniformBindGroup(s.resources.localUniforms, !0);
-    c.setBindGroup(2, h, s.gpuProgram);
-    const f = u.instructions;
+    const p = i.renderPipes.uniformBatch.getUniformBindGroup(s.resources.localUniforms, !0);
+    c.setBindGroup(2, p, s.gpuProgram);
+    const h = u.instructions;
     let d = null;
     for (let _ = 0; _ < u.instructionSize; _++) {
-      const m = f[_];
+      const m = h[_];
       if (m.topology !== d && (d = m.topology, c.setPipelineFromGeometryProgramAndState(
         o.geometry,
         s.gpuProgram,
         e.state,
         m.topology
       )), s.groups[1] = m.bindGroup, !m.gpuBindGroup) {
-        const P = m.textures;
+        const S = m.textures;
         m.bindGroup = E(
-          P.textures,
-          P.count,
+          S.textures,
+          S.count,
           this._maxTextures
         ), m.gpuBindGroup = i.bindGroup.getBindGroup(
           m.bindGroup,
@@ -1564,23 +1583,23 @@ class re {
     this.shader.destroy(!0), this.shader = null;
   }
 }
-re.extension = {
+se.extension = {
   type: [
-    p.WebGPUPipesAdaptor
+    f.WebGPUPipesAdaptor
   ],
   name: "graphics"
 };
-class se {
+class ie {
   init() {
-    const e = D({
+    const e = z({
       name: "mesh",
       bits: [
-        me,
-        Pe,
-        H
+        be,
+        ve,
+        F
       ]
     });
-    this._shader = new z({
+    this._shader = new I({
       gpuProgram: e,
       resources: {
         uTexture: R.EMPTY._source,
@@ -1597,7 +1616,7 @@ class se {
     if (!s)
       s = this._shader, s.groups[2] = r.texture.getTextureBindGroup(t.texture);
     else if (!s.gpuProgram) {
-      v("Mesh shader has no gpuProgram", t.shader);
+      C("Mesh shader has no gpuProgram", t.shader);
       return;
     }
     const i = s.gpuProgram;
@@ -1615,44 +1634,44 @@ class se {
     this._shader.destroy(!0), this._shader = null;
   }
 }
-se.extension = {
+ie.extension = {
   type: [
-    p.WebGPUPipesAdaptor
+    f.WebGPUPipesAdaptor
   ],
   name: "mesh"
 };
-const Ie = [
-  ...Te,
-  q,
-  N,
-  U,
+const je = [
+  ...Ce,
+  Y,
   j,
-  W,
-  te,
-  X,
+  U,
+  K,
+  V,
+  re,
   Z,
   J,
-  $,
-  V,
-  K,
-  I
-], We = [...Ce, Y], Ve = [O, se, re], ie = [], ne = [], oe = [];
-B.handleByNamedList(p.WebGPUSystem, ie);
-B.handleByNamedList(p.WebGPUPipes, ne);
-B.handleByNamedList(p.WebGPUPipesAdaptor, oe);
-B.add(...Ie, ...We, ...Ve);
-class qe extends le {
+  Q,
+  X,
+  N,
+  q,
+  H
+], Ke = [...Ue, $], qe = [W, ie, se], ne = [], oe = [], ae = [];
+B.handleByNamedList(f.WebGPUSystem, ne);
+B.handleByNamedList(f.WebGPUPipes, oe);
+B.handleByNamedList(f.WebGPUPipesAdaptor, ae);
+B.add(...je, ...Ke, ...qe);
+class Ze extends ge {
   constructor() {
     const e = {
       name: "webgpu",
-      type: fe.WEBGPU,
-      systems: ie,
-      renderPipes: ne,
-      renderPipeAdaptors: oe
+      type: me.WEBGPU,
+      systems: ne,
+      renderPipes: oe,
+      renderPipeAdaptors: ae
     };
     super(e);
   }
 }
 export {
-  qe as WebGPURenderer
+  Ze as WebGPURenderer
 };