@operato/scene-storage 10.0.0-beta.42 → 10.0.0-beta.44

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [10.0.0-beta.44](https://github.com/things-scene/operato-scene/compare/v10.0.0-beta.43...v10.0.0-beta.44) (2026-05-21)
+
+**Note:** Version bump only for package @operato/scene-storage
+
+
+
+
+
+## [10.0.0-beta.43](https://github.com/things-scene/operato-scene/compare/v10.0.0-beta.42...v10.0.0-beta.43) (2026-05-21)
+
+**Note:** Version bump only for package @operato/scene-storage
+
+
+
+
+
 ## [10.0.0-beta.42](https://github.com/things-scene/operato-scene/compare/v10.0.0-beta.41...v10.0.0-beta.42) (2026-05-21)
 
 

package/dist/box-3d.d.ts

@@ -3,8 +3,10 @@ export declare class Box3D extends RealObjectGroup {
     build(): void;
     /** Wood crate — visible slats, 4 corner posts, open top. */
     private buildWoodCrate;
+    private getWoodGeometries;
     /** Plastic tote — solid molded walls + top stackable lip. */
     private buildPlasticTote;
+    private getPlasticGeometries;
     updateDimension(): void;
     onchange(after: Record<string, unknown>, before: Record<string, unknown>): void;
     updateAlpha(): void;

package/dist/box-3d.js

@@ -14,6 +14,49 @@
 import * as THREE from 'three';
 import * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js';
 import { RealObjectGroup } from '@hatiolab/things-scene';
+// ── Material cache by bodyColor (shared across all Box3D instances) ──
+const woodBodyMaterials = new Map();
+const woodPostMaterials = new Map();
+const plasticToteMaterials = new Map();
+const plasticLipMaterials = new Map();
+function getWoodBodyMaterial(bodyColor) {
+    let m = woodBodyMaterials.get(bodyColor);
+    if (!m) {
+        m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0, roughness: 0.85 });
+        woodBodyMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getWoodPostMaterial(bodyColor) {
+    let m = woodPostMaterials.get(bodyColor);
+    if (!m) {
+        const tint = new THREE.Color(bodyColor).multiplyScalar(0.8);
+        m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0, roughness: 0.9 });
+        woodPostMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getPlasticToteMaterial(bodyColor) {
+    let m = plasticToteMaterials.get(bodyColor);
+    if (!m) {
+        m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0.05, roughness: 0.55 });
+        plasticToteMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getPlasticLipMaterial(bodyColor) {
+    let m = plasticLipMaterials.get(bodyColor);
+    if (!m) {
+        const tint = new THREE.Color(bodyColor).multiplyScalar(0.85);
+        m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0.05, roughness: 0.55 });
+        plasticLipMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+// ── Geometry cache by size (shared across all Box3D instances) ──
+// Floor geo는 local 좌표 + mesh position 으로 두어 mesh 별 position 만 다름.
+const woodGeoCache = new Map();
+const plasticGeoCache = new Map();
 export class Box3D extends RealObjectGroup {
     build() {
         super.build();
@@ -29,24 +72,32 @@ export class Box3D extends RealObjectGroup {
     }
     /** Wood crate — visible slats, 4 corner posts, open top. */
     buildWoodCrate(width, height, depth, bodyColor) {
+        const { posts, slats, floor, floorY } = this.getWoodGeometries(width, height, depth);
+        const woodMaterial = getWoodBodyMaterial(bodyColor);
+        const postMaterial = getWoodPostMaterial(bodyColor);
+        const postMesh = new THREE.Mesh(posts, postMaterial);
+        postMesh.castShadow = true;
+        this.object3d.add(postMesh);
+        const slatMesh = new THREE.Mesh(slats, woodMaterial);
+        slatMesh.castShadow = true;
+        slatMesh.receiveShadow = true;
+        this.object3d.add(slatMesh);
+        const floorMesh = new THREE.Mesh(floor, woodMaterial);
+        floorMesh.position.set(0, floorY, 0);
+        floorMesh.receiveShadow = true;
+        this.object3d.add(floorMesh);
+    }
+    getWoodGeometries(width, height, depth) {
+        const key = `${width}|${height}|${depth}`;
+        let cached = woodGeoCache.get(key);
+        if (cached)
+            return cached;
         const baseY = -depth / 2;
         const wallThickness = Math.min(width, height) * 0.04;
         const postW = wallThickness * 1.6;
         const slatH = depth * 0.10;
         const slatGap = slatH * 0.6;
         const floorH = depth * 0.05;
-        const woodMaterial = new THREE.MeshStandardMaterial({
-            color: bodyColor,
-            metalness: 0,
-            roughness: 0.85
-        });
-        const postColor = new THREE.Color(bodyColor).multiplyScalar(0.8);
-        const postMaterial = new THREE.MeshStandardMaterial({
-            color: postColor,
-            metalness: 0,
-            roughness: 0.9
-        });
-        // ── 4 corner posts ───────────────────────────────────────────────
         const postGeos = [];
         for (const xSign of [-1, 1]) {
             for (const zSign of [-1, 1]) {
@@ -55,99 +106,87 @@ export class Box3D extends RealObjectGroup {
                 postGeos.push(post);
             }
         }
-        const postMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(postGeos), postMaterial);
-        postMesh.castShadow = true;
-        this.object3d.add(postMesh);
-        // ── Slatted walls (horizontal slats with gaps) ───────────────────
+        const posts = BufferGeometryUtils.mergeGeometries(postGeos);
         const slatRowCount = Math.max(2, Math.floor((depth - floorH) / (slatH + slatGap)));
         const slatGeos = [];
         for (let row = 0; row < slatRowCount; row++) {
             const y = baseY + floorH + slatGap + row * (slatH + slatGap) + slatH / 2;
-            // Long walls (front / back)
             for (const zSign of [-1, 1]) {
                 const slat = new THREE.BoxGeometry(width - postW * 2, slatH, wallThickness);
                 slat.translate(0, y, zSign * (height / 2 - wallThickness / 2));
                 slatGeos.push(slat);
             }
-            // Short walls (left / right)
             for (const xSign of [-1, 1]) {
                 const slat = new THREE.BoxGeometry(wallThickness, slatH, height - postW * 2);
                 slat.translate(xSign * (width / 2 - wallThickness / 2), y, 0);
                 slatGeos.push(slat);
             }
         }
-        const slatMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(slatGeos), woodMaterial);
-        slatMesh.castShadow = true;
-        slatMesh.receiveShadow = true;
-        this.object3d.add(slatMesh);
-        // ── Floor (bottom panel) ─────────────────────────────────────────
-        const floorGeo = new THREE.BoxGeometry(width - postW * 2, floorH, height - postW * 2);
-        const floorMesh = new THREE.Mesh(floorGeo, woodMaterial);
-        floorMesh.position.set(0, baseY + floorH / 2, 0);
-        floorMesh.receiveShadow = true;
-        this.object3d.add(floorMesh);
+        const slats = BufferGeometryUtils.mergeGeometries(slatGeos);
+        const floor = new THREE.BoxGeometry(width - postW * 2, floorH, height - postW * 2);
+        const floorY = baseY + floorH / 2;
+        cached = { posts, slats, floor, floorY };
+        woodGeoCache.set(key, cached);
+        return cached;
     }
     /** Plastic tote — solid molded walls + top stackable lip. */
     buildPlasticTote(width, height, depth, bodyColor) {
+        const { walls, lip, floor, floorY } = this.getPlasticGeometries(width, height, depth);
+        const totMaterial = getPlasticToteMaterial(bodyColor);
+        const lipMaterial = getPlasticLipMaterial(bodyColor);
+        const wallMesh = new THREE.Mesh(walls, totMaterial);
+        wallMesh.castShadow = true;
+        wallMesh.receiveShadow = true;
+        this.object3d.add(wallMesh);
+        const lipMesh = new THREE.Mesh(lip, lipMaterial);
+        lipMesh.castShadow = true;
+        this.object3d.add(lipMesh);
+        const floorMesh = new THREE.Mesh(floor, totMaterial);
+        floorMesh.position.set(0, floorY, 0);
+        floorMesh.receiveShadow = true;
+        this.object3d.add(floorMesh);
+    }
+    getPlasticGeometries(width, height, depth) {
+        const key = `${width}|${height}|${depth}`;
+        let cached = plasticGeoCache.get(key);
+        if (cached)
+            return cached;
         const baseY = -depth / 2;
         const wallThickness = Math.min(width, height) * 0.05;
         const lipH = depth * 0.06;
         const floorH = depth * 0.06;
-        const totMaterial = new THREE.MeshStandardMaterial({
-            color: bodyColor,
-            metalness: 0.05,
-            roughness: 0.55
-        });
-        const lipColor = new THREE.Color(bodyColor).multiplyScalar(0.85);
-        const lipMaterial = new THREE.MeshStandardMaterial({
-            color: lipColor,
-            metalness: 0.05,
-            roughness: 0.55
-        });
-        // ── 4 solid walls ────────────────────────────────────────────────
         const wallGeos = [];
         const wallH = depth - lipH - floorH;
         const wallY = baseY + floorH + wallH / 2;
-        // Long walls
         for (const zSign of [-1, 1]) {
             const wall = new THREE.BoxGeometry(width, wallH, wallThickness);
             wall.translate(0, wallY, zSign * (height / 2 - wallThickness / 2));
             wallGeos.push(wall);
         }
-        // Short walls
         for (const xSign of [-1, 1]) {
             const wall = new THREE.BoxGeometry(wallThickness, wallH, height - 2 * wallThickness);
             wall.translate(xSign * (width / 2 - wallThickness / 2), wallY, 0);
             wallGeos.push(wall);
         }
-        const wallMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(wallGeos), totMaterial);
-        wallMesh.castShadow = true;
-        wallMesh.receiveShadow = true;
-        this.object3d.add(wallMesh);
-        // ── Top lip (stackable rim — slightly wider than walls) ──────────
+        const walls = BufferGeometryUtils.mergeGeometries(wallGeos);
         const lipGeos = [];
         const lipY = baseY + depth - lipH / 2;
-        // Long sides
         for (const zSign of [-1, 1]) {
-            const lip = new THREE.BoxGeometry(width * 1.02, lipH, wallThickness * 1.5);
-            lip.translate(0, lipY, zSign * (height / 2 - wallThickness * 0.75));
-            lipGeos.push(lip);
+            const lipG = new THREE.BoxGeometry(width * 1.02, lipH, wallThickness * 1.5);
+            lipG.translate(0, lipY, zSign * (height / 2 - wallThickness * 0.75));
+            lipGeos.push(lipG);
         }
-        // Short sides
         for (const xSign of [-1, 1]) {
-            const lip = new THREE.BoxGeometry(wallThickness * 1.5, lipH, height * 1.02 - 2 * wallThickness * 1.5);
-            lip.translate(xSign * (width / 2 - wallThickness * 0.75), lipY, 0);
-            lipGeos.push(lip);
+            const lipG = new THREE.BoxGeometry(wallThickness * 1.5, lipH, height * 1.02 - 2 * wallThickness * 1.5);
+            lipG.translate(xSign * (width / 2 - wallThickness * 0.75), lipY, 0);
+            lipGeos.push(lipG);
         }
-        const lipMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(lipGeos), lipMaterial);
-        lipMesh.castShadow = true;
-        this.object3d.add(lipMesh);
-        // ── Floor (solid bottom) ─────────────────────────────────────────
-        const floorGeo = new THREE.BoxGeometry(width, floorH, height);
-        const floorMesh = new THREE.Mesh(floorGeo, totMaterial);
-        floorMesh.position.set(0, baseY + floorH / 2, 0);
-        floorMesh.receiveShadow = true;
-        this.object3d.add(floorMesh);
+        const lip = BufferGeometryUtils.mergeGeometries(lipGeos);
+        const floor = new THREE.BoxGeometry(width, floorH, height);
+        const floorY = baseY + floorH / 2;
+        cached = { walls, lip, floor, floorY };
+        plasticGeoCache.set(key, cached);
+        return cached;
     }
     updateDimension() { }
     onchange(after, before) {

package/dist/box-3d.js.map

@@ -1 +1 @@
-{"version":3,"file":"box-3d.js","sourceRoot":"","sources":["../src/box-3d.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Box 3D — wood crate and plastic tote variants.\n *\n * Wood crate: 4 vertical corner posts + horizontal slats with gaps → the\n *             typical industrial wooden crate look. Forklift-friendly.\n * Plastic tote: solid 4 walls + visible top lip / handle cutouts. Stackable.\n *\n * Both have a defined floor (so they look like containers, not just walls)\n * and an opening at top — as you'd expect from a real crate / tote that's\n * open or has a removable lid.\n */\n\nimport * as THREE from 'three'\nimport * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'\nimport { RealObjectGroup } from '@hatiolab/things-scene'\n\nexport class Box3D extends RealObjectGroup {\n  build() {\n    super.build()\n\n    const { width, height, depth = 300 } = this.component.state\n    const material = (this.component.state.material as string) || 'wood'\n    const bodyColor = (this.component.state.bodyColor as string) || '#a87644'\n\n    if (material === 'plastic') {\n      this.buildPlasticTote(width, height, depth, bodyColor)\n    } else {\n      this.buildWoodCrate(width, height, depth, bodyColor)\n    }\n  }\n\n  /** Wood crate — visible slats, 4 corner posts, open top. */\n  private buildWoodCrate(width: number, height: number, depth: number, bodyColor: string) {\n    const baseY = -depth / 2\n    const wallThickness = Math.min(width, height) * 0.04\n    const postW = wallThickness * 1.6\n    const slatH = depth * 0.10\n    const slatGap = slatH * 0.6\n    const floorH = depth * 0.05\n\n    const woodMaterial = new THREE.MeshStandardMaterial({\n      color: bodyColor,\n      metalness: 0,\n      roughness: 0.85\n    })\n    const postColor = new THREE.Color(bodyColor).multiplyScalar(0.8)\n    const postMaterial = new THREE.MeshStandardMaterial({\n      color: postColor,\n      metalness: 0,\n      roughness: 0.9\n    })\n\n    // ── 4 corner posts ───────────────────────────────────────────────\n    const postGeos: THREE.BufferGeometry[] = []\n    for (const xSign of [-1, 1]) {\n      for (const zSign of [-1, 1]) {\n        const post = new THREE.BoxGeometry(postW, depth, postW)\n        post.translate(\n          xSign * (width / 2 - postW / 2),\n          baseY + depth / 2,\n          zSign * (height / 2 - postW / 2)\n        )\n        postGeos.push(post)\n      }\n    }\n    const postMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(postGeos), postMaterial)\n    postMesh.castShadow = true\n    this.object3d.add(postMesh)\n\n    // ── Slatted walls (horizontal slats with gaps) ───────────────────\n    const slatRowCount = Math.max(2, Math.floor((depth - floorH) / (slatH + slatGap)))\n    const slatGeos: THREE.BufferGeometry[] = []\n\n    for (let row = 0; row < slatRowCount; row++) {\n      const y = baseY + floorH + slatGap + row * (slatH + slatGap) + slatH / 2\n      // Long walls (front / back)\n      for (const zSign of [-1, 1]) {\n        const slat = new THREE.BoxGeometry(width - postW * 2, slatH, wallThickness)\n        slat.translate(0, y, zSign * (height / 2 - wallThickness / 2))\n        slatGeos.push(slat)\n      }\n      // Short walls (left / right)\n      for (const xSign of [-1, 1]) {\n        const slat = new THREE.BoxGeometry(wallThickness, slatH, height - postW * 2)\n        slat.translate(xSign * (width / 2 - wallThickness / 2), y, 0)\n        slatGeos.push(slat)\n      }\n    }\n    const slatMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(slatGeos), woodMaterial)\n    slatMesh.castShadow = true\n    slatMesh.receiveShadow = true\n    this.object3d.add(slatMesh)\n\n    // ── Floor (bottom panel) ─────────────────────────────────────────\n    const floorGeo = new THREE.BoxGeometry(width - postW * 2, floorH, height - postW * 2)\n    const floorMesh = new THREE.Mesh(floorGeo, woodMaterial)\n    floorMesh.position.set(0, baseY + floorH / 2, 0)\n    floorMesh.receiveShadow = true\n    this.object3d.add(floorMesh)\n  }\n\n  /** Plastic tote — solid molded walls + top stackable lip. */\n  private buildPlasticTote(width: number, height: number, depth: number, bodyColor: string) {\n    const baseY = -depth / 2\n    const wallThickness = Math.min(width, height) * 0.05\n    const lipH = depth * 0.06\n    const floorH = depth * 0.06\n\n    const totMaterial = new THREE.MeshStandardMaterial({\n      color: bodyColor,\n      metalness: 0.05,\n      roughness: 0.55\n    })\n    const lipColor = new THREE.Color(bodyColor).multiplyScalar(0.85)\n    const lipMaterial = new THREE.MeshStandardMaterial({\n      color: lipColor,\n      metalness: 0.05,\n      roughness: 0.55\n    })\n\n    // ── 4 solid walls ────────────────────────────────────────────────\n    const wallGeos: THREE.BufferGeometry[] = []\n    const wallH = depth - lipH - floorH\n    const wallY = baseY + floorH + wallH / 2\n\n    // Long walls\n    for (const zSign of [-1, 1]) {\n      const wall = new THREE.BoxGeometry(width, wallH, wallThickness)\n      wall.translate(0, wallY, zSign * (height / 2 - wallThickness / 2))\n      wallGeos.push(wall)\n    }\n    // Short walls\n    for (const xSign of [-1, 1]) {\n      const wall = new THREE.BoxGeometry(wallThickness, wallH, height - 2 * wallThickness)\n      wall.translate(xSign * (width / 2 - wallThickness / 2), wallY, 0)\n      wallGeos.push(wall)\n    }\n    const wallMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(wallGeos), totMaterial)\n    wallMesh.castShadow = true\n    wallMesh.receiveShadow = true\n    this.object3d.add(wallMesh)\n\n    // ── Top lip (stackable rim — slightly wider than walls) ──────────\n    const lipGeos: THREE.BufferGeometry[] = []\n    const lipY = baseY + depth - lipH / 2\n    // Long sides\n    for (const zSign of [-1, 1]) {\n      const lip = new THREE.BoxGeometry(width * 1.02, lipH, wallThickness * 1.5)\n      lip.translate(0, lipY, zSign * (height / 2 - wallThickness * 0.75))\n      lipGeos.push(lip)\n    }\n    // Short sides\n    for (const xSign of [-1, 1]) {\n      const lip = new THREE.BoxGeometry(wallThickness * 1.5, lipH, height * 1.02 - 2 * wallThickness * 1.5)\n      lip.translate(xSign * (width / 2 - wallThickness * 0.75), lipY, 0)\n      lipGeos.push(lip)\n    }\n    const lipMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(lipGeos), lipMaterial)\n    lipMesh.castShadow = true\n    this.object3d.add(lipMesh)\n\n    // ── Floor (solid bottom) ─────────────────────────────────────────\n    const floorGeo = new THREE.BoxGeometry(width, floorH, height)\n    const floorMesh = new THREE.Mesh(floorGeo, totMaterial)\n    floorMesh.position.set(0, baseY + floorH / 2, 0)\n    floorMesh.receiveShadow = true\n    this.object3d.add(floorMesh)\n  }\n\n  updateDimension() {}\n\n  onchange(after: Record<string, unknown>, before: Record<string, unknown>) {\n    if (\n      'material' in after ||\n      'bodyColor' in after ||\n      'width' in after ||\n      'height' in after ||\n      'depth' in after\n    ) {\n      this.update()\n      return\n    }\n    super.onchange(after, before)\n  }\n\n  updateAlpha() {}\n}\n"]}
+{"version":3,"file":"box-3d.js","sourceRoot":"","sources":["../src/box-3d.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Box 3D — wood crate and plastic tote variants.\n *\n * Wood crate: 4 vertical corner posts + horizontal slats with gaps → the\n *             typical industrial wooden crate look. Forklift-friendly.\n * Plastic tote: solid 4 walls + visible top lip / handle cutouts. Stackable.\n *\n * Both have a defined floor (so they look like containers, not just walls)\n * and an opening at top — as you'd expect from a real crate / tote that's\n * open or has a removable lid.\n */\n\nimport * as THREE from 'three'\nimport * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'\nimport { RealObjectGroup } from '@hatiolab/things-scene'\n\n// ── Material cache by bodyColor (shared across all Box3D instances) ──\nconst woodBodyMaterials = new Map<string, THREE.MeshStandardMaterial>()\nconst woodPostMaterials = new Map<string, THREE.MeshStandardMaterial>()\nconst plasticToteMaterials = new Map<string, THREE.MeshStandardMaterial>()\nconst plasticLipMaterials = new Map<string, THREE.MeshStandardMaterial>()\n\nfunction getWoodBodyMaterial(bodyColor: string): THREE.MeshStandardMaterial {\n  let m = woodBodyMaterials.get(bodyColor)\n  if (!m) {\n    m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0, roughness: 0.85 })\n    woodBodyMaterials.set(bodyColor, m)\n  }\n  return m\n}\n\nfunction getWoodPostMaterial(bodyColor: string): THREE.MeshStandardMaterial {\n  let m = woodPostMaterials.get(bodyColor)\n  if (!m) {\n    const tint = new THREE.Color(bodyColor).multiplyScalar(0.8)\n    m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0, roughness: 0.9 })\n    woodPostMaterials.set(bodyColor, m)\n  }\n  return m\n}\n\nfunction getPlasticToteMaterial(bodyColor: string): THREE.MeshStandardMaterial {\n  let m = plasticToteMaterials.get(bodyColor)\n  if (!m) {\n    m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0.05, roughness: 0.55 })\n    plasticToteMaterials.set(bodyColor, m)\n  }\n  return m\n}\n\nfunction getPlasticLipMaterial(bodyColor: string): THREE.MeshStandardMaterial {\n  let m = plasticLipMaterials.get(bodyColor)\n  if (!m) {\n    const tint = new THREE.Color(bodyColor).multiplyScalar(0.85)\n    m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0.05, roughness: 0.55 })\n    plasticLipMaterials.set(bodyColor, m)\n  }\n  return m\n}\n\n// ── Geometry cache by size (shared across all Box3D instances) ──\n// Floor geo는 local 좌표 + mesh position 으로 두어 mesh 별 position 만 다름.\nconst woodGeoCache = new Map<string, { posts: THREE.BufferGeometry; slats: THREE.BufferGeometry; floor: THREE.BufferGeometry; floorY: number }>()\nconst plasticGeoCache = new Map<string, { walls: THREE.BufferGeometry; lip: THREE.BufferGeometry; floor: THREE.BufferGeometry; floorY: number }>()\n\nexport class Box3D extends RealObjectGroup {\n  build() {\n    super.build()\n\n    const { width, height, depth = 300 } = this.component.state\n    const material = (this.component.state.material as string) || 'wood'\n    const bodyColor = (this.component.state.bodyColor as string) || '#a87644'\n\n    if (material === 'plastic') {\n      this.buildPlasticTote(width, height, depth, bodyColor)\n    } else {\n      this.buildWoodCrate(width, height, depth, bodyColor)\n    }\n  }\n\n  /** Wood crate — visible slats, 4 corner posts, open top. */\n  private buildWoodCrate(width: number, height: number, depth: number, bodyColor: string) {\n    const { posts, slats, floor, floorY } = this.getWoodGeometries(width, height, depth)\n\n    const woodMaterial = getWoodBodyMaterial(bodyColor)\n    const postMaterial = getWoodPostMaterial(bodyColor)\n\n    const postMesh = new THREE.Mesh(posts, postMaterial)\n    postMesh.castShadow = true\n    this.object3d.add(postMesh)\n\n    const slatMesh = new THREE.Mesh(slats, woodMaterial)\n    slatMesh.castShadow = true\n    slatMesh.receiveShadow = true\n    this.object3d.add(slatMesh)\n\n    const floorMesh = new THREE.Mesh(floor, woodMaterial)\n    floorMesh.position.set(0, floorY, 0)\n    floorMesh.receiveShadow = true\n    this.object3d.add(floorMesh)\n  }\n\n  private getWoodGeometries(width: number, height: number, depth: number) {\n    const key = `${width}|${height}|${depth}`\n    let cached = woodGeoCache.get(key)\n    if (cached) return cached\n\n    const baseY = -depth / 2\n    const wallThickness = Math.min(width, height) * 0.04\n    const postW = wallThickness * 1.6\n    const slatH = depth * 0.10\n    const slatGap = slatH * 0.6\n    const floorH = depth * 0.05\n\n    const postGeos: THREE.BufferGeometry[] = []\n    for (const xSign of [-1, 1]) {\n      for (const zSign of [-1, 1]) {\n        const post = new THREE.BoxGeometry(postW, depth, postW)\n        post.translate(\n          xSign * (width / 2 - postW / 2),\n          baseY + depth / 2,\n          zSign * (height / 2 - postW / 2)\n        )\n        postGeos.push(post)\n      }\n    }\n    const posts = BufferGeometryUtils.mergeGeometries(postGeos)\n\n    const slatRowCount = Math.max(2, Math.floor((depth - floorH) / (slatH + slatGap)))\n    const slatGeos: THREE.BufferGeometry[] = []\n    for (let row = 0; row < slatRowCount; row++) {\n      const y = baseY + floorH + slatGap + row * (slatH + slatGap) + slatH / 2\n      for (const zSign of [-1, 1]) {\n        const slat = new THREE.BoxGeometry(width - postW * 2, slatH, wallThickness)\n        slat.translate(0, y, zSign * (height / 2 - wallThickness / 2))\n        slatGeos.push(slat)\n      }\n      for (const xSign of [-1, 1]) {\n        const slat = new THREE.BoxGeometry(wallThickness, slatH, height - postW * 2)\n        slat.translate(xSign * (width / 2 - wallThickness / 2), y, 0)\n        slatGeos.push(slat)\n      }\n    }\n    const slats = BufferGeometryUtils.mergeGeometries(slatGeos)\n\n    const floor = new THREE.BoxGeometry(width - postW * 2, floorH, height - postW * 2)\n    const floorY = baseY + floorH / 2\n\n    cached = { posts, slats, floor, floorY }\n    woodGeoCache.set(key, cached)\n    return cached\n  }\n\n  /** Plastic tote — solid molded walls + top stackable lip. */\n  private buildPlasticTote(width: number, height: number, depth: number, bodyColor: string) {\n    const { walls, lip, floor, floorY } = this.getPlasticGeometries(width, height, depth)\n\n    const totMaterial = getPlasticToteMaterial(bodyColor)\n    const lipMaterial = getPlasticLipMaterial(bodyColor)\n\n    const wallMesh = new THREE.Mesh(walls, totMaterial)\n    wallMesh.castShadow = true\n    wallMesh.receiveShadow = true\n    this.object3d.add(wallMesh)\n\n    const lipMesh = new THREE.Mesh(lip, lipMaterial)\n    lipMesh.castShadow = true\n    this.object3d.add(lipMesh)\n\n    const floorMesh = new THREE.Mesh(floor, totMaterial)\n    floorMesh.position.set(0, floorY, 0)\n    floorMesh.receiveShadow = true\n    this.object3d.add(floorMesh)\n  }\n\n  private getPlasticGeometries(width: number, height: number, depth: number) {\n    const key = `${width}|${height}|${depth}`\n    let cached = plasticGeoCache.get(key)\n    if (cached) return cached\n\n    const baseY = -depth / 2\n    const wallThickness = Math.min(width, height) * 0.05\n    const lipH = depth * 0.06\n    const floorH = depth * 0.06\n\n    const wallGeos: THREE.BufferGeometry[] = []\n    const wallH = depth - lipH - floorH\n    const wallY = baseY + floorH + wallH / 2\n    for (const zSign of [-1, 1]) {\n      const wall = new THREE.BoxGeometry(width, wallH, wallThickness)\n      wall.translate(0, wallY, zSign * (height / 2 - wallThickness / 2))\n      wallGeos.push(wall)\n    }\n    for (const xSign of [-1, 1]) {\n      const wall = new THREE.BoxGeometry(wallThickness, wallH, height - 2 * wallThickness)\n      wall.translate(xSign * (width / 2 - wallThickness / 2), wallY, 0)\n      wallGeos.push(wall)\n    }\n    const walls = BufferGeometryUtils.mergeGeometries(wallGeos)\n\n    const lipGeos: THREE.BufferGeometry[] = []\n    const lipY = baseY + depth - lipH / 2\n    for (const zSign of [-1, 1]) {\n      const lipG = new THREE.BoxGeometry(width * 1.02, lipH, wallThickness * 1.5)\n      lipG.translate(0, lipY, zSign * (height / 2 - wallThickness * 0.75))\n      lipGeos.push(lipG)\n    }\n    for (const xSign of [-1, 1]) {\n      const lipG = new THREE.BoxGeometry(wallThickness * 1.5, lipH, height * 1.02 - 2 * wallThickness * 1.5)\n      lipG.translate(xSign * (width / 2 - wallThickness * 0.75), lipY, 0)\n      lipGeos.push(lipG)\n    }\n    const lip = BufferGeometryUtils.mergeGeometries(lipGeos)\n\n    const floor = new THREE.BoxGeometry(width, floorH, height)\n    const floorY = baseY + floorH / 2\n\n    cached = { walls, lip, floor, floorY }\n    plasticGeoCache.set(key, cached)\n    return cached\n  }\n\n  updateDimension() {}\n\n  onchange(after: Record<string, unknown>, before: Record<string, unknown>) {\n    if (\n      'material' in after ||\n      'bodyColor' in after ||\n      'width' in after ||\n      'height' in after ||\n      'depth' in after\n    ) {\n      this.update()\n      return\n    }\n    super.onchange(after, before)\n  }\n\n  updateAlpha() {}\n}\n"]}

package/dist/pallet-3d.d.ts

@@ -3,8 +3,10 @@ export declare class Pallet3D extends RealObjectGroup {
     build(): void;
     /** Wood EUR-style: 7 top slats + 3 stringers + 5 bottom slats. */
     private buildWood;
+    private getWoodGeometries;
     /** Plastic molded: solid top deck + ribbed underside / feet. */
     private buildPlastic;
+    private getPlasticGeometries;
     updateDimension(): void;
     onchange(after: Record<string, unknown>, before: Record<string, unknown>): void;
     updateAlpha(): void;

package/dist/pallet-3d.js

@@ -19,6 +19,51 @@
 import * as THREE from 'three';
 import * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js';
 import { RealObjectGroup } from '@hatiolab/things-scene';
+// ── Material cache by bodyColor (shared across all Pallet3D instances) ──
+// 동일 bodyColor 의 pallet 수십~수백 개 → GPU material 인스턴스 *1개로 통합*.
+const woodBodyMaterials = new Map();
+const woodStringerMaterials = new Map();
+const plasticDeckMaterials = new Map();
+const plasticFootMaterials = new Map();
+function getWoodBodyMaterial(bodyColor) {
+    let m = woodBodyMaterials.get(bodyColor);
+    if (!m) {
+        m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0.0, roughness: 0.85 });
+        woodBodyMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getWoodStringerMaterial(bodyColor) {
+    let m = woodStringerMaterials.get(bodyColor);
+    if (!m) {
+        const tint = new THREE.Color(bodyColor).multiplyScalar(0.85);
+        m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0.0, roughness: 0.9 });
+        woodStringerMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getPlasticDeckMaterial(bodyColor) {
+    let m = plasticDeckMaterials.get(bodyColor);
+    if (!m) {
+        m = new THREE.MeshStandardMaterial({ color: bodyColor, metalness: 0.1, roughness: 0.55 });
+        plasticDeckMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+function getPlasticFootMaterial(bodyColor) {
+    let m = plasticFootMaterials.get(bodyColor);
+    if (!m) {
+        const tint = new THREE.Color(bodyColor).multiplyScalar(0.85);
+        m = new THREE.MeshStandardMaterial({ color: tint, metalness: 0.1, roughness: 0.65 });
+        plasticFootMaterials.set(bodyColor, m);
+    }
+    return m;
+}
+// ── Geometry cache by size (shared across all Pallet3D instances) ──
+// 동일 width × height × depth 의 pallet → merged geometry *1세트*만 GPU 에 업로드.
+// Translation / merge 비용도 동일 size pallet 끼리 *1회*만 발생.
+const woodGeoCache = new Map();
+const plasticGeoCache = new Map();
 export class Pallet3D extends RealObjectGroup {
     build() {
         super.build();
@@ -34,26 +79,30 @@ export class Pallet3D extends RealObjectGroup {
     }
     /** Wood EUR-style: 7 top slats + 3 stringers + 5 bottom slats. */
     buildWood(width, height, depth, bodyColor) {
+        const { top, stringer, bottom } = this.getWoodGeometries(width, height, depth);
+        const woodMaterial = getWoodBodyMaterial(bodyColor);
+        const stringerMaterial = getWoodStringerMaterial(bodyColor);
+        const topSlatMesh = new THREE.Mesh(top, woodMaterial);
+        topSlatMesh.castShadow = true;
+        topSlatMesh.receiveShadow = true;
+        this.object3d.add(topSlatMesh);
+        const stringerMesh = new THREE.Mesh(stringer, stringerMaterial);
+        stringerMesh.castShadow = true;
+        this.object3d.add(stringerMesh);
+        const botSlatMesh = new THREE.Mesh(bottom, woodMaterial);
+        botSlatMesh.receiveShadow = true;
+        this.object3d.add(botSlatMesh);
+    }
+    getWoodGeometries(width, height, depth) {
+        const key = `${width}|${height}|${depth}`;
+        let cached = woodGeoCache.get(key);
+        if (cached)
+            return cached;
         const baseY = -depth / 2;
         const slatThickness = depth * 0.15;
         const stringerThickness = depth * 0.45;
         const bottomSlatThickness = depth * 0.13;
-        const woodMaterial = new THREE.MeshStandardMaterial({
-            color: bodyColor,
-            metalness: 0.0,
-            roughness: 0.85
-        });
-        const stringerColor = new THREE.Color(bodyColor).multiplyScalar(0.85);
-        const stringerMaterial = new THREE.MeshStandardMaterial({
-            color: stringerColor,
-            metalness: 0.0,
-            roughness: 0.9
-        });
-        // ── Top + bottom slats — same count, same z-positions, paired vertically ─
-        // EUR-pallet style: 5 boards on top, 5 below (under the same z ranges so
-        // they read as a single skeleton rather than two unrelated grids).
         const slatCount = 5;
-        const slatW = width;
         const slatD = (height * 0.92) / (slatCount + (slatCount - 1) * 0.4);
         const gapD = slatD * 0.4;
         const totalSpan = slatCount * slatD + (slatCount - 1) * gapD;
@@ -64,15 +113,11 @@ export class Pallet3D extends RealObjectGroup {
         }
         const topSlatGeos = [];
         for (const z of slatPositions) {
-            const slat = new THREE.BoxGeometry(slatW, slatThickness, slatD);
+            const slat = new THREE.BoxGeometry(width, slatThickness, slatD);
             slat.translate(0, baseY + depth - slatThickness / 2, z);
             topSlatGeos.push(slat);
         }
-        const topSlatMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(topSlatGeos), woodMaterial);
-        topSlatMesh.castShadow = true;
-        topSlatMesh.receiveShadow = true;
-        this.object3d.add(topSlatMesh);
-        // ── Stringers (3 perpendicular blocks between top and bottom decks) ─
+        const top = BufferGeometryUtils.mergeGeometries(topSlatGeos);
         const stringerCount = 3;
         const stringerW = width * 0.07;
         const stringerY = baseY + bottomSlatThickness + stringerThickness / 2;
@@ -84,45 +129,48 @@ export class Pallet3D extends RealObjectGroup {
             stringer.translate(x, stringerY, 0);
             stringerGeos.push(stringer);
         }
-        const stringerMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(stringerGeos), stringerMaterial);
-        stringerMesh.castShadow = true;
-        this.object3d.add(stringerMesh);
-        // ── Bottom slats — same z-positions as top so the deck reads as paired ─
+        const stringer = BufferGeometryUtils.mergeGeometries(stringerGeos);
         const botSlatGeos = [];
         for (const z of slatPositions) {
             const slat = new THREE.BoxGeometry(width, bottomSlatThickness, slatD);
             slat.translate(0, baseY + bottomSlatThickness / 2, z);
             botSlatGeos.push(slat);
         }
-        const botSlatMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(botSlatGeos), woodMaterial);
-        botSlatMesh.receiveShadow = true;
-        this.object3d.add(botSlatMesh);
+        const bottom = BufferGeometryUtils.mergeGeometries(botSlatGeos);
+        cached = { top, stringer, bottom };
+        woodGeoCache.set(key, cached);
+        return cached;
     }
     /** Plastic molded: solid top deck + ribbed underside / feet. */
     buildPlastic(width, height, depth, bodyColor) {
+        const { deck, feet, brace } = this.getPlasticGeometries(width, height, depth);
+        const deckMaterial = getPlasticDeckMaterial(bodyColor);
+        const footMaterial = getPlasticFootMaterial(bodyColor);
         const baseY = -depth / 2;
         const deckThickness = depth * 0.30;
-        const footH = depth * 0.55;
-        const footW = width * 0.12;
-        const deckMaterial = new THREE.MeshStandardMaterial({
-            color: bodyColor,
-            metalness: 0.1,
-            roughness: 0.55
-        });
-        const footColor = new THREE.Color(bodyColor).multiplyScalar(0.85);
-        const footMaterial = new THREE.MeshStandardMaterial({
-            color: footColor,
-            metalness: 0.1,
-            roughness: 0.65
-        });
-        // ── Solid top deck ───────────────────────────────────────────────
-        const deckGeo = new THREE.BoxGeometry(width * 0.98, deckThickness, height * 0.98);
-        const deckMesh = new THREE.Mesh(deckGeo, deckMaterial);
+        const deckMesh = new THREE.Mesh(deck, deckMaterial);
         deckMesh.position.set(0, baseY + depth - deckThickness / 2, 0);
         deckMesh.castShadow = true;
         deckMesh.receiveShadow = true;
         this.object3d.add(deckMesh);
-        // ── 9 feet (3×3 grid — typical plastic pallet underside) ─────────
+        const footMesh = new THREE.Mesh(feet, footMaterial);
+        footMesh.castShadow = true;
+        this.object3d.add(footMesh);
+        const braceMesh = new THREE.Mesh(brace, footMaterial);
+        this.object3d.add(braceMesh);
+    }
+    getPlasticGeometries(width, height, depth) {
+        const key = `${width}|${height}|${depth}`;
+        let cached = plasticGeoCache.get(key);
+        if (cached)
+            return cached;
+        const baseY = -depth / 2;
+        const deckThickness = depth * 0.30;
+        const footH = depth * 0.55;
+        const footW = width * 0.12;
+        // Deck geo — local space; mesh position applied at instantiation.
+        const deck = new THREE.BoxGeometry(width * 0.98, deckThickness, height * 0.98);
+        // 9 feet (3×3 grid) → merged geometry with translations baked in.
         const footGeos = [];
         for (let i = -1; i <= 1; i++) {
             for (let j = -1; j <= 1; j++) {
@@ -133,17 +181,19 @@ export class Pallet3D extends RealObjectGroup {
                 footGeos.push(foot);
             }
         }
-        const footMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(footGeos), footMaterial);
-        footMesh.castShadow = true;
-        this.object3d.add(footMesh);
-        // ── Cross-bracing along underside (suggests molded reinforcement) ─
+        const feet = BufferGeometryUtils.mergeGeometries(footGeos);
+        // 3 braces → merged into single mesh (이전에 mesh 3개 분리 = drawcall 3개).
         const braceH = depth * 0.10;
-        const braceGeo = new THREE.BoxGeometry(width * 0.95, braceH, height * 0.04);
+        const braceGeos = [];
         for (const zSign of [-1, 0, 1]) {
-            const brace = new THREE.Mesh(braceGeo.clone(), footMaterial);
-            brace.position.set(0, baseY + footH - braceH / 2, zSign * height * 0.4);
-            this.object3d.add(brace);
+            const b = new THREE.BoxGeometry(width * 0.95, braceH, height * 0.04);
+            b.translate(0, baseY + footH - braceH / 2, zSign * height * 0.4);
+            braceGeos.push(b);
         }
+        const brace = BufferGeometryUtils.mergeGeometries(braceGeos);
+        cached = { deck, feet, brace };
+        plasticGeoCache.set(key, cached);
+        return cached;
     }
     updateDimension() { }
     onchange(after, before) {