WeakMap 不导致内存泄漏，问题在于值被强引用；应只存轻量状态，大对象用 ID 映射+外部缓存管理，并校验节点有效性。
WeakMap 本身不缓存“大对象”，它只弱引用键（如 DOM 节点），而值仍是强引用——所以真正导致内存泄漏的，不是 WeakMap，而是你往里面塞了不该塞的大对象。避免泄漏的关键是：**用 WeakMap 管理生命周期，但值必须轻量；大对象不该存在 WeakMap 里，而应由 WeakMap 做“触发器”或“查找索引”来按需加载/释放。**
只存轻量状态，别存大对象
WeakMap 的 value 是强引用，一旦你 set(node, { data: hugeArray, config: massiveObj })，哪怕 node 已从 DOM 移除，只要 WeakMap 这条记录还在，hugeArray 和 massiveObj 就不会被回收——因为它们被 value 强持有。
- ✅ 推荐：存布尔、数字、短字符串、小对象（如 { loaded: true, retryCount: 2, timestamp: 1727237820 }）
- ❌ 避免：直接存 大型数组、JSON 解析结果、Canvas 图像数据、React/Vue 组件实例
- ? 替代思路：用 WeakMap 存一个唯一 ID 或哈希值，大对象走独立缓存（如 Map + LRU 策略），并在节点销毁时主动清理对应缓存项
配合 ID 映射 + 外部缓存管理
把 WeakMap 当作“生命周期挂钩”，而不是“数据仓库”。它只负责告诉你是哪个节点、是否还存活，真正的数据存在受控缓存中。
- 用 WeakMap 记录节点与缓存 key 的关系：cacheKeyMap.set(node, 'img-12345')
- 大图数据存在独立 Map：imageCache.set('img-12345', blobOrCanvas)
- 节点移除后，在事件或 cleanup 阶段检查 node.isConnected === false，再调用 imageCache.delete(cacheKeyMap.get(node))
- 这样既利用 WeakMap 感知节点消亡，又避免 value 强持大对象
动态加载 + 即时释放模式
对确实需要临时持有大对象的场景（如图片预处理、文本高亮缓存），采用“按需加载 + 使用后立即释放”策略，WeakMap 只做状态协调。
立即学习“Java免费学习笔记（深入）”；
- set(node, { status: 'pending' }) → 触发异步加载
- 加载完成，存入局部变量或临时 Map，不塞进 WeakMap
- 渲染/使用完毕，立刻手动释放：URL.revokeObjectURL()、canvas.getContext('2d').clearRect()、delete tempStore[key]
- WeakMap 中仅保留轻量标记（如 { processed: true, expiresAt: Date.now() + 30000 }），用于防重复或过期判断
校验节点有效性，避免无效引用堆积
动态插入的节点可能未挂载，或已被移除但 WeakMap 里还有残留键值对（虽然键已不可达，但 value 若含大对象仍占内存）。务必在读取前校验：
- 读取前加判断：if (node && node.isConnected && cacheMap.has(node)) { ... }
- 定期清理失效项（非必须，但对长期运行页有帮助）：Array.from(cacheMap.keys()).filter(n => !n.isConnected).forEach(n => cacheMap.delete(n))
- 注意：WeakMap.keys() 不可枚举，所以只能靠外部维护活跃节点 Set 或用 MutationObserver 辅助追踪
