距离 0~15m     高模（几万面）    —— 近看要精细
距离 15~40m    中模（几千面）    —— 中景够用
距离 40m+      低模（几百面）    —— 远景只是个"影子"

车间俯瞰（远景）：50 台设备全用低模——俯瞰谁看得清螺丝？
设备特写（近景）：选中/聚焦的设备用高模

50 台高模（每台 5 万面）= 250 万面/帧
  ↓ LOD：近处 5 台高模 + 中景 20 台中模 + 远景 25 台低模
50 台混合 ≈ 50 万面/帧（省 80%）

import * as THREE from "three";

// 1. 创建 LOD 对象（它本身是个 Object3D，可加进场景、可拾取）
const lod = new THREE.LOD();

// 2. 按距离添加各级模型：addLevel(模型, 切换距离)
//    距离是"从 LOD 对象到相机的距离"
lod.addLevel(highModel, 0);      // 0m 起用高模
lod.addLevel(midModel, 15);      // 15m 起用中模
lod.addLevel(lowModel, 40);      // 40m 起用低模

// 3. 加进场景
lod.position.set(3, 0, 2);       // LOD 本身可定位/旋转
scene.add(lod);

// 4. 循环里：更新 LOD 的距离判断（关键！）
const tick = () => {
  // LOD 需要知道相机位置来自动切换——每帧更新
  lod.update(camera);            // ← 忘了这行，LOD 永远停在第一级
  renderer.render(scene, camera);
};

// 扩展 AssetManager：一次加载三档模型（Day 108 的缓存逻辑复用）
async function loadLodModels(urls: { high: string; mid: string; low: string }): Promise<THREE.Object3D[]> {
  const [high, mid, low] = await Promise.all([
    asset.getModel(urls.high),
    asset.getModel(urls.mid),
    asset.getModel(urls.low),
  ]);
  return [high, mid, low];
}

① 各级比例一致：三档模型缩放相同，切换时大小不变
② 切换距离重叠：addLevel 的距离错开/重叠，让切换发生在"看不太清"处
③ 材质一致：三档尽量用同色系材质，切换时颜色不突变

// 示例：距离重叠（15 与 18 之间有一段"过渡带"）
lod.addLevel(highModel, 0);
lod.addLevel(midModel, 15);
lod.addLevel(lowModel, 38);   // 与前一级留一点重叠余量

Frustum Culling（视锥剔除）：相机看不见的物体，根本不画
  → Three 默认开启（每个 Object3D 有 frustumCulled = true）
  → 你站在车间一角，背后的设备已经被跳过了

① 粒子/后处理等"全屏"效果不受视锥剔除保护（它们总是全屏算）
② 大型模型如果包围盒不准，会"该剔不剔"
③ 面试高频点：说出"Three 默认视锥剔除 + LOD + 实例化"是性能三件套

// 让某个复杂模型"不被误剔除"（包围盒不准时）：
model.geometry.computeBoundingSphere();   // 确保包围球正确

// src/core/three/workshop-with-lod.ts（LOD 装配）
import * as THREE from "three";
import { AssetManager } from "./asset-manager";

/**
 * 带 LOD 的车间装配：
 *   - 每台设备 = 一个 LOD（高/中/低三档）
 *   - 循环里统一 lod.update(camera)
 * 返回：lods（可拾取清单）+ mixers（动画）
 */
export async function buildLodWorkshop(
  layout: { id: string; position: [number, number, number]; lodUrls: { high: string; mid: string; low: string } }[],
  asset: AssetManager
) {
  const lods: THREE.LOD[] = [];

  for (const cfg of layout) {
    // 1. 加载三档模型（缓存复用）
    const [high, mid, low] = await Promise.all([
      asset.getModel(cfg.lodUrls.high),
      asset.getModel(cfg.lodUrls.mid),
      asset.getModel(cfg.lodUrls.low),
    ]);

    // 2. 组装 LOD（比例一致：三档同样缩放）
    const lod = new THREE.LOD();
    [high, mid, low].forEach((m) => m.scale.setScalar(0.01));
    lod.addLevel(high, 0);
    lod.addLevel(mid, 15);
    lod.addLevel(low, 38);

    // 3. 就位 + 上户口（拾取契约不变）
    lod.position.set(...cfg.position);
    lod.userData.deviceId = cfg.id;
    lods.push(lod);
  }
  return lods;
}

// —— 引擎循环里：每帧更新所有 LOD（必做！）——
// lods.forEach((lod) => lod.update(camera));