面试题库 词条目录
前端Wiki/词条/内存泄漏排查

内存泄漏排查

定义程序中不再使用的内存仍被引用而无法释放的现象,是性能排查时的重要环节

前端常见的内存泄漏场景有四类:一是全局变量意外挂载(未声明就赋值);二是被遗忘的定时器或事件监听器,组件销毁后仍在运行;三是闭包长期持有大对象不释放;四是已删除的 DOM 节点仍被 JS 变量引用。单页应用反复切换页面但不清理时最容易暴露。

排查用 Chrome DevTools 的 Memory 面板:先拍堆快照做一次操作再拍一次,对比增量找出持续增长的对象;也可用分配时间线录制每次分配。回答时强调用弱引用(WeakMap、WeakSet)保存不必要持有的引用,并在组件卸载钩子里清理监听器与定时器。

JavaScript
// 泄漏:定时器与闭包持有大对象,销毁后未清理
class Timer {
  constructor() { this.data = new Array(1e6).fill('x'); }
  start() {
    this.timer = setInterval(() => {
      console.log(this.data.length);      // 闭包一直持有 this.data
    }, 1000);
  }
  destroy() { clearInterval(this.timer); this.data = null; }   // 修复
}

const t = new Timer();
t.start();
setTimeout(() => { t.destroy(); console.log('已清理,不再持有大对象'); }, 4000);
⚠ 常见误区
🔗 相关词条重绘回流与性能优化浏览器存储:Cookie / localStorage / indexDB
← 返回来源章节重绘回流与性能优化