最有效做法是避免在全局作用域缓存大量数据，因全局变量长期持有大对象、DOM引用或闭包数据会导致老生代内存持续堆积，最终触发heap out of memory错误；须严格限制全局变量、启用"use strict"、用模块封装、WeakMap关联数据、控制缓存生命周期并借助DevTools验证释放。
直接避免在全局作用域缓存大量数据，是防止老生代内存溢出最有效、最根本的做法。老生代（Old Generation）主要存放生命周期长、体积大的对象，一旦全局变量长期持有大数组、大对象、DOM 引用或闭包捕获的数据，它们就无法被垃圾回收器清理，持续堆积最终触发 JavaScript heap out of memory 错误。
严格限制全局变量的使用范围
全局变量（如挂在 window 或 globalThis 上的属性）在整个页面生命周期内都存在，GC 不会回收——哪怕你只存一个 10MB 的 ArrayBuffer，它也会一直占着老生代空间。
- 禁用隐式全局：始终开启
"use strict"，让未声明赋值（如data = [...]）直接报错，而不是悄悄挂到全局 - 用模块封装代替全局挂载：把缓存逻辑封装进 ES 模块或类实例中，利用作用域边界控制生命周期
- 避免
var声明在函数外：顶层var cache = {...}仍会提升为全局属性，改用const cache = {...}（在模块顶层是模块级，非全局）
用 WeakMap / WeakRef 管理关联数据
当确实需要“缓存”某些数据（比如为 DOM 元素附加元信息），不要直接往元素上挂大对象（el.__cache = hugeData），这会让元素即使被移除也无法释放。
- 改用
WeakMap：键是 DOM 节点或对象实例，值可以是任意数据；节点被 GC 时，对应条目自动失效 - 对需延迟清理的资源，配合
FinalizationRegistry注册回调，在对象真正被回收后执行清理（如关闭 WebSocket、释放 Canvas 纹理） - 避免用普通对象做映射表（
{[el]: data}），字符串键无法建立弱引用，且 key 不会随元素销毁而自动清理
主动控制缓存生命周期与容量
即使缓存放在局部作用域或模块内，若无节制增长，依然会撑爆老生代。关键不是“不缓存”，而是“可预测、可退化、可淘汰”。
立即学习“Java免费学习笔记（深入）”；
- 设置最大条目数或内存上限，超出时按 LRU 或 FIFO 清理最旧项（例如用
Map+ 时间戳维护） - 对大体积数据（如图片 Base64、JSON 解析结果），优先考虑流式处理或分片加载，而非全量缓存
- 监听关键生命周期事件（如 Vue 的
beforeUnmount、React 的useEffect cleanup、或自定义的dispose()方法），显式清空相关缓存引用
监控与验证是否真被释放
光写清理逻辑不够，得确认它生效。很多“已清理”只是断开了引用，但因闭包、定时器或事件监听器残留，实际对象仍在内存中。
- Chrome DevTools → Memory 面板 → 拍摄堆快照（Heap Snapshot），筛选
(system)或搜索你的缓存变量名，看是否仍有强引用链 - 重点关注 Retainer 树：找到谁还在引用该对象（常见有
closure、event listener、timer、global） - 在 Node.js 中启动时加
--inspect，用 Chrome 连接调试，同样分析 Heap Snapshot，尤其检查老生代中重复出现的大对象
