@adatechnology/game-vfx-three 0.3.5 → 0.3.6

package/dist/index.d.ts

@@ -49,6 +49,12 @@ interface VfxRendererOptions {
     pointScale?: number;
     /** Multiplies the blast and fire lights. Default `Math.PI`: three.js r155+ lights are physical, the Lab's were not (r128). */
     lightScale?: number;
+    /** Caps on the marks kept on the ground; once one is full the oldest is reused for the next, so nothing grows and nothing is allocated. Defaults: 64 scorch and dirt, 512 rocks, 256 blood. */
+    markLimits?: {
+        readonly maxGroundMarks?: number;
+        readonly maxRocks?: number;
+        readonly maxBlood?: number;
+    };
 }
 /** The world's counters flattened (`lastBlast` becomes `last_puffs`, `last_sparks`, `last_chunks`, `last_lights`), plus `drawCalls`. */
 type VfxRendererStats = Readonly<Record<string, number>>;
@@ -146,7 +152,9 @@ interface MarkLayer {
     /** The shared rock and plate shapes, so the debris and the rim rocks use the same geometry. */
     handle(event: MarkEvent): void;
     update(dt: number): void;
-    /** The meshes in the group right now. */
+    /** Puts the instanced meshes in the scene now, so their shader programs link while loading instead of at the first mark. */
+    prepare(): void;
+    /** The draw calls the marks cost right now. */
     count(): number;
     dispose(): void;
 }
@@ -155,6 +163,12 @@ interface MarkLayerOptions {
     readonly createCanvas: (() => CanvasLike) | undefined;
     readonly rockGeometry: THREE_NS.BufferGeometry;
     readonly plateGeometry: THREE_NS.BufferGeometry;
+    /** Scorch and dirt meshes alive at once; the oldest is reused for the next. Default 64. */
+    readonly maxGroundMarks?: number;
+    /** Rim rocks and plates alive at once (each shape has its own instanced mesh of this size); the oldest is overwritten. Default 512. */
+    readonly maxRocks?: number;
+    /** Blood pools alive at once; the oldest is overwritten. Default 256. */
+    readonly maxBlood?: number;
 }
 /**
  * The scorch, dirt, rim rocks and blood of the Lab as meshes (L443-476). A scorch or dirt mesh follows the ground as it was the moment the mark was

package/dist/index.global.js

@@ -8523,6 +8523,11 @@ void main(){
   var MAX_CONFORM_STEPS = 48;
   var MIN_CONFORM_STEPS = 16;
   var BLOOD_GROW_RATE = 1.2;
+  var BLOOD_START_GROWTH = 0.05;
+  var DEFAULT_MAX_GROUND_MARKS = 64;
+  var DEFAULT_MAX_ROCKS = 512;
+  var DEFAULT_MAX_BLOOD = 256;
+  var MAX_SPARE_GROUND_GEOMETRIES = 16;
   function createMarkLayer(THREE, options) {
     const group = new THREE.Group();
     const textures = createMarkTextures(THREE, options.createCanvas);
@@ -8546,92 +8551,146 @@ void main(){
     const bloodMaterial = new THREE.MeshStandardMaterial({ color: 6031882, roughness: 0.15, metalness: 0.1, polygonOffset: true, polygonOffsetFactor: -3, polygonOffsetUnits: -3 });
     const bloodGeometry = new THREE.CircleGeometry(0.5, 9).rotateX(-Math.PI / 2);
     owned.push(bloodMaterial, bloodGeometry);
-    const rockMaterials = /* @__PURE__ */ new Map();
-    const blood = [];
-    let meshCount = 0;
-    function rockMaterial(color) {
-      let material = rockMaterials.get(color);
-      if (!material) {
-        material = new THREE.MeshStandardMaterial({ color, roughness: 0.9, metalness: 0, flatShading: true });
-        rockMaterials.set(color, material);
-        owned.push(material);
+    const maxGroundMarks = options.maxGroundMarks ?? DEFAULT_MAX_GROUND_MARKS;
+    const instanced = {};
+    function rockMaterial() {
+      if (!instanced.rockMaterial) {
+        instanced.rockMaterial = new THREE.MeshStandardMaterial({ color: 16777215, roughness: 0.9, metalness: 0, flatShading: true });
+        owned.push(instanced.rockMaterial);
       }
-      return material;
+      return instanced.rockMaterial;
+    }
+    function bloodMesh() {
+      return instanced.blood ?? (instanced.blood = attach(createInstanced(bloodGeometry, bloodMaterial, options.maxBlood ?? DEFAULT_MAX_BLOOD)));
+    }
+    function rockMesh() {
+      return instanced.rock ?? (instanced.rock = attach(createInstanced(options.rockGeometry, rockMaterial(), options.maxRocks ?? DEFAULT_MAX_ROCKS), true));
+    }
+    function plateMesh() {
+      return instanced.plate ?? (instanced.plate = attach(createInstanced(options.plateGeometry, rockMaterial(), options.maxRocks ?? DEFAULT_MAX_ROCKS), true));
+    }
+    function attach(mesh2, castShadow = false) {
+      mesh2.castShadow = castShadow;
+      group.add(mesh2);
+      return mesh2;
+    }
+    const groundMarks = [];
+    const spareGeometries = [];
+    const blood = [];
+    const placed = { blood: 0, rock: 0, plate: 0 };
+    const matrix = new THREE.Matrix4();
+    const position = new THREE.Vector3();
+    const quaternion = new THREE.Quaternion();
+    const euler = new THREE.Euler();
+    const scale = new THREE.Vector3();
+    const color = new THREE.Color();
+    const up = new THREE.Vector3(0, 1, 0);
+    function createInstanced(geometry, material, capacity) {
+      const mesh2 = new THREE.InstancedMesh(geometry, material, capacity);
+      mesh2.count = 0;
+      mesh2.frustumCulled = false;
+      mesh2.receiveShadow = true;
+      return mesh2;
+    }
+    function takeSpare(vertexCount) {
+      const found = spareGeometries.findIndex((geometry) => geometry.getAttribute("position").count === vertexCount);
+      return found < 0 ? void 0 : spareGeometries.splice(found, 1)[0];
+    }
+    function evictOldestGroundMark() {
+      const oldest = groundMarks.shift();
+      group.remove(oldest.mesh);
+      spareGeometries.push(oldest.mesh.geometry);
+      if (spareGeometries.length > MAX_SPARE_GROUND_GEOMETRIES) spareGeometries.shift().dispose();
     }
     function conform(mark, material) {
       const radius = mark.radius;
       const steps = Math.max(MIN_CONFORM_STEPS, Math.min(MAX_CONFORM_STEPS, Math.round(radius * 8)));
-      const geometry = new THREE.PlaneGeometry(2, 2, steps, steps).rotateX(-Math.PI / 2);
-      const position = geometry.attributes.position;
+      if (groundMarks.length >= maxGroundMarks) evictOldestGroundMark();
+      const geometry = takeSpare((steps + 1) * (steps + 1)) ?? new THREE.PlaneGeometry(2, 2, steps, steps).rotateX(-Math.PI / 2);
+      const grid = geometry.attributes.position;
+      const cell = 2 / steps;
       const cos2 = Math.cos(mark.rotation);
       const sin2 = Math.sin(mark.rotation);
-      for (let index = 0; index < position.count; index++) {
-        const localX = position.getX(index) * radius;
-        const localZ = position.getZ(index) * radius;
+      for (let index = 0; index < grid.count; index++) {
+        const localX = Math.fround(index % (steps + 1) * cell - 1) * radius;
+        const localZ = Math.fround(Math.floor(index / (steps + 1)) * cell - 1) * radius;
         const worldX = mark.x + localX * cos2 - localZ * sin2;
         const worldZ = mark.z + localX * sin2 + localZ * cos2;
-        position.setXYZ(index, worldX, (options.ground?.heightAt(worldX, worldZ) ?? 0) + mark.lift, worldZ);
+        grid.setXYZ(index, worldX, (options.ground?.heightAt(worldX, worldZ) ?? 0) + mark.lift, worldZ);
       }
+      grid.needsUpdate = true;
       geometry.computeVertexNormals();
+      geometry.attributes.normal.needsUpdate = true;
+      geometry.boundingSphere = null;
+      geometry.boundingBox = null;
       const mesh2 = new THREE.Mesh(geometry, material);
       mesh2.receiveShadow = true;
-      return mesh2;
+      group.add(mesh2);
+      groundMarks.push({ mesh: mesh2, steps });
     }
     function addRock(mark) {
-      const mesh2 = new THREE.Mesh(mark.plate ? options.plateGeometry : options.rockGeometry, rockMaterial(mark.color));
-      mesh2.position.set(mark.x, mark.y, mark.z);
-      mesh2.scale.set(mark.scale[0], mark.scale[1], mark.scale[2]);
-      mesh2.rotation.set(mark.rotation[0], mark.rotation[1], mark.rotation[2]);
-      mesh2.castShadow = true;
-      mesh2.receiveShadow = true;
-      return mesh2;
+      const mesh2 = mark.plate ? plateMesh() : rockMesh();
+      const slot = mark.plate ? "plate" : "rock";
+      const index = placed[slot]++ % mesh2.instanceMatrix.count;
+      quaternion.setFromEuler(euler.set(mark.rotation[0], mark.rotation[1], mark.rotation[2]));
+      mesh2.setMatrixAt(index, matrix.compose(position.set(mark.x, mark.y, mark.z), quaternion, scale.set(mark.scale[0], mark.scale[1], mark.scale[2])));
+      mesh2.setColorAt(index, color.set(mark.color));
+      mesh2.count = Math.min(placed[slot], mesh2.instanceMatrix.count);
+      mesh2.instanceMatrix.needsUpdate = true;
+      mesh2.instanceColor.needsUpdate = true;
+    }
+    function writeBlood(index, drawn, growth) {
+      quaternion.setFromAxisAngle(up, drawn.rotation);
+      const mesh2 = bloodMesh();
+      mesh2.setMatrixAt(index, matrix.compose(position.set(drawn.position[0], drawn.position[1], drawn.position[2]), quaternion, scale.set(drawn.scaleX * growth, 1, drawn.scaleZ * growth)));
+      mesh2.instanceMatrix.needsUpdate = true;
     }
     function addBlood(mark) {
-      const mesh2 = new THREE.Mesh(bloodGeometry, bloodMaterial);
-      mesh2.position.set(mark.x, mark.y, mark.z);
-      mesh2.scale.set(mark.scaleX, 1, mark.scaleZ);
-      mesh2.rotation.y = mark.rotation;
-      mesh2.receiveShadow = true;
-      mesh2.scale.multiplyScalar(0.05);
-      blood.push({ mesh: mesh2, scaleX: mark.scaleX, scaleZ: mark.scaleZ, age: 0 });
-      return mesh2;
+      const index = placed.blood++ % bloodMesh().instanceMatrix.count;
+      const drawn = { position: [mark.x, mark.y, mark.z], rotation: mark.rotation, scaleX: mark.scaleX, scaleZ: mark.scaleZ, age: 0 };
+      blood[index] = drawn;
+      writeBlood(index, drawn, BLOOD_START_GROWTH);
+      bloodMesh().count = Math.min(placed.blood, bloodMesh().instanceMatrix.count);
     }
     function build(mark) {
-      if (mark.kind === "scorch") return conform(mark, scorchMaterials[mark.variant]);
-      if (mark.kind === "dirt") return conform(mark, dirtMaterial);
-      if (mark.kind === "rock") return addRock(mark);
-      return addBlood(mark);
-    }
-    function clearMeshes() {
-      for (const child of [...group.children]) {
-        group.remove(child);
-        const geometry = child.geometry;
-        if (geometry !== options.rockGeometry && geometry !== options.plateGeometry && geometry !== bloodGeometry) geometry.dispose();
-      }
+      if (mark.kind === "scorch") conform(mark, scorchMaterials[mark.variant]);
+      else if (mark.kind === "dirt") conform(mark, dirtMaterial);
+      else if (mark.kind === "rock") addRock(mark);
+      else addBlood(mark);
+    }
+    function clearMarks() {
+      for (const drawn of groundMarks) group.remove(drawn.mesh);
+      for (const drawn of groundMarks) drawn.mesh.geometry.dispose();
+      groundMarks.length = 0;
+      for (const geometry of spareGeometries) geometry.dispose();
+      spareGeometries.length = 0;
       blood.length = 0;
-      meshCount = 0;
+      placed.blood = placed.rock = placed.plate = 0;
+      for (const mesh2 of [instanced.blood, instanced.rock, instanced.plate]) if (mesh2) mesh2.count = 0;
     }
     return {
       group,
       handle(event) {
-        if (event.type === "clear") {
-          clearMeshes();
-          return;
-        }
-        group.add(build(event.mark));
-        meshCount++;
+        if (event.type === "clear") clearMarks();
+        else build(event.mark);
+      },
+      prepare() {
+        bloodMesh();
+        rockMesh();
+        plateMesh();
       },
       update(dt) {
-        for (const drawn of blood) {
-          if (drawn.age > 1) continue;
+        for (let index = 0; index < blood.length; index++) {
+          const drawn = blood[index];
+          if (!drawn || drawn.age > 1) continue;
           drawn.age += dt * BLOOD_GROW_RATE;
-          const ease3 = 1 - Math.pow(1 - Math.min(1, drawn.age), 2.5);
-          drawn.mesh.scale.set(drawn.scaleX * Math.max(0.05, ease3), 1, drawn.scaleZ * Math.max(0.05, ease3));
+          writeBlood(index, drawn, Math.max(BLOOD_START_GROWTH, 1 - Math.pow(1 - Math.min(1, drawn.age), 2.5)));
         }
       },
-      count: () => meshCount,
+      count: () => groundMarks.length + [instanced.blood, instanced.rock, instanced.plate].filter((mesh2) => mesh2 && mesh2.count > 0).length,
       dispose() {
-        clearMeshes();
+        clearMarks();
+        for (const mesh2 of [instanced.blood, instanced.rock, instanced.plate]) mesh2?.dispose();
         for (const item of owned) item.dispose();
       }
     };
@@ -8640,18 +8699,22 @@ void main(){
   // src/mesh-layer.ts
   var SPHERE_DEFAULT_WIDTH = 8;
   var SPHERE_DEFAULT_HEIGHT = 6;
+  var MAX_PARKED_MESHES_PER_KIND = 256;
   function geometryOf(THREE, particle) {
     switch (particle.shape) {
       case "cone":
-        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, false);
+        return new THREE.ConeGeometry(1, 1, particle.segments || void 0, particle.segments2 || 1, false);
       case "cone_open":
-        return new THREE.ConeGeometry(particle.radius, particle.height, particle.segments || void 0, particle.segments2 || 1, true);
+        return new THREE.ConeGeometry(1, 1, particle.segments || void 0, particle.segments2 || 1, true);
       case "sphere":
-        return new THREE.SphereGeometry(particle.radius, particle.segments || SPHERE_DEFAULT_WIDTH, particle.segments2 || SPHERE_DEFAULT_HEIGHT);
+        return new THREE.SphereGeometry(1, particle.segments || SPHERE_DEFAULT_WIDTH, particle.segments2 || SPHERE_DEFAULT_HEIGHT);
       case "icosahedron":
-        return new THREE.IcosahedronGeometry(particle.radius, particle.segments);
+        return new THREE.IcosahedronGeometry(1, particle.segments);
     }
   }
+  function isCone(particle) {
+    return particle.shape === "cone" || particle.shape === "cone_open";
+  }
   function materialOf(THREE, particle) {
     if (particle.lit) return new THREE.MeshStandardMaterial({ color: particle.color, roughness: 1, metalness: 0, transparent: true, opacity: particle.opacity, depthWrite: false });
     return new THREE.MeshBasicMaterial({ color: particle.color, transparent: true, opacity: particle.opacity, depthWrite: false, ...particle.additive ? { blending: THREE.AdditiveBlending } : {} });
@@ -8662,51 +8725,82 @@ void main(){
       (kind) => new THREE.Mesh(geometry, materialOf(THREE, { ...kind, color: 8421504, opacity: 0.5 }))
     );
   }
+  function geometryKeyOf(particle) {
+    return `${particle.shape}:${particle.segments}:${particle.segments2}`;
+  }
   function createMeshLayer(THREE, pool) {
     const group = new THREE.Group();
     group.name = "workshop-meshes";
     const drawn = /* @__PURE__ */ new Map();
+    const geometries = /* @__PURE__ */ new Map();
+    const parked = /* @__PURE__ */ new Map();
     const frame = new THREE.Quaternion();
     const euler = new THREE.Euler();
     const turn = new THREE.Quaternion();
     const offset = new THREE.Vector3();
-    function release(mesh2) {
-      mesh2.removeFromParent();
-      mesh2.geometry.dispose();
-      mesh2.material.dispose();
+    let stamp = 0;
+    function geometryFor(particle) {
+      const key = geometryKeyOf(particle);
+      let geometry = geometries.get(key);
+      if (!geometry) {
+        geometry = geometryOf(THREE, particle);
+        geometries.set(key, geometry);
+      }
+      return geometry;
+    }
+    function acquire(particle) {
+      const parkingKey = `${geometryKeyOf(particle)}|${particle.lit}|${particle.additive}`;
+      const mesh2 = parked.get(parkingKey)?.pop() ?? new THREE.Mesh(geometryFor(particle), materialOf(THREE, particle));
+      mesh2.material.color.set(particle.color);
+      mesh2.frustumCulled = false;
+      mesh2.renderOrder = particle.additive ? 5 : 3;
+      group.add(mesh2);
+      return { mesh: mesh2, parkingKey, stamp };
+    }
+    function park(entry) {
+      entry.mesh.removeFromParent();
+      let free = parked.get(entry.parkingKey);
+      if (!free) {
+        free = [];
+        parked.set(entry.parkingKey, free);
+      }
+      if (free.length < MAX_PARKED_MESHES_PER_KIND) free.push(entry.mesh);
+      else entry.mesh.material.dispose();
     }
     return {
       group,
       sync() {
-        const live = /* @__PURE__ */ new Set();
+        stamp++;
         for (const particle of pool.particles) {
-          live.add(particle.id);
-          let mesh2 = drawn.get(particle.id);
-          if (!mesh2) {
-            mesh2 = new THREE.Mesh(geometryOf(THREE, particle), materialOf(THREE, particle));
-            mesh2.frustumCulled = false;
-            mesh2.renderOrder = particle.additive ? 5 : 3;
-            drawn.set(particle.id, mesh2);
-            group.add(mesh2);
+          let entry = drawn.get(particle.id);
+          if (!entry) {
+            entry = acquire(particle);
+            drawn.set(particle.id, entry);
           }
+          entry.stamp = stamp;
+          const mesh2 = entry.mesh;
           frame.set(particle.frame[0], particle.frame[1], particle.frame[2], particle.frame[3]);
           offset.set(particle.at[0], particle.at[1], particle.at[2]).multiplyScalar(particle.scale).applyQuaternion(frame);
           mesh2.position.set(particle.x + offset.x, particle.y + offset.y, particle.z + offset.z);
           turn.setFromEuler(euler.set(particle.rx, particle.ry, particle.rz));
           mesh2.quaternion.copy(frame).multiply(turn);
-          mesh2.scale.setScalar(particle.scale);
+          mesh2.scale.set(particle.radius * particle.scale, (isCone(particle) ? particle.height : particle.radius) * particle.scale, particle.radius * particle.scale);
           mesh2.material.opacity = particle.opacity;
         }
-        for (const [id, mesh2] of drawn) {
-          if (live.has(id)) continue;
-          release(mesh2);
+        for (const [id, entry] of drawn) {
+          if (entry.stamp === stamp) continue;
+          park(entry);
           drawn.delete(id);
         }
         return pool.count;
       },
       dispose() {
-        for (const mesh2 of drawn.values()) release(mesh2);
+        for (const entry of drawn.values()) park(entry);
         drawn.clear();
+        for (const free of parked.values()) for (const mesh2 of free) mesh2.material.dispose();
+        parked.clear();
+        for (const geometry of geometries.values()) geometry.dispose();
+        geometries.clear();
         group.removeFromParent();
       }
     };
@@ -9291,7 +9385,7 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
     const shocks = createShockLayer(THREE, pools.shocks);
     const sprites = createSpriteLayer(THREE, world.sprites(), options.pointScale ?? 700);
     const lights = createLightLayer(THREE, pools.lights, options.lightScale ?? Math.PI);
-    const marks = createMarkLayer(THREE, { ground: pools.ground, createCanvas: options.createCanvas, rockGeometry, plateGeometry });
+    const marks = createMarkLayer(THREE, { ground: pools.ground, createCanvas: options.createCanvas, rockGeometry, plateGeometry, ...options.markLimits });
     root.add(puffs.mesh, sparks.mesh, glows.mesh, chunks.rocks, chunks.plates, shocks.group, lights.group, sprites.additive, sprites.normal, marks.group);
     const stopMarks = world.onMarks((event) => marks.handle(event));
     const overlay = options.overlay ? createScreenOverlay(options.overlay) : void 0;
@@ -9317,6 +9411,16 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
       const position = options.camera.position;
       world.setCamera([position.x, position.y, position.z]);
     }
+    function attachWorkshopLayers() {
+      const engine = world.peekWorkshop();
+      if (!engine || engine === workshopEngine) return;
+      workshopLayers?.dispose();
+      if (workshopLayers) root.remove(workshopLayers.group);
+      workshopEngine = engine;
+      workshopLayers = createWorkshopLayers(THREE, engine, options.pointScale ?? 700, 1);
+      root.add(workshopLayers.group);
+      applyLayers();
+    }
     function syncAll() {
       lastDrawn.puffs = puffs.sync();
       lastDrawn.sparks = sparks.sync();
@@ -9325,15 +9429,7 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
       lastDrawn.shocks = shocks.sync();
       lastDrawn.sprites = sprites.sync();
       lights.sync();
-      const engine = world.peekWorkshop();
-      if (engine && engine !== workshopEngine) {
-        workshopLayers?.dispose();
-        if (workshopLayers) root.remove(workshopLayers.group);
-        workshopEngine = engine;
-        workshopLayers = createWorkshopLayers(THREE, engine, options.pointScale ?? 700, 1);
-        root.add(workshopLayers.group);
-        applyLayers();
-      }
+      attachWorkshopLayers();
       const workshopCalls = workshopLayers?.sync() ?? 0;
       const glow = pools.lights.glow;
       uniforms.uGlowPos.value.set(glow.x, glow.y, glow.z);
@@ -9386,6 +9482,9 @@ void main(){vec2 d=gl_PointCoord-.5;float r=length(d)*2.;if(r>1.)discard;float a
       },
       warmUpProbes() {
         releaseAnchors();
+        marks.prepare();
+        world.workshop();
+        attachWorkshopLayers();
         const meshes = createMeshLayerProbes(THREE);
         for (const mesh2 of meshes) mesh2.frustumCulled = false;
         const group = new THREE.Group();