浏览器的垃圾回收机制

深入解析现代浏览器的垃圾回收机制：分代回收与标记清除算法

本文详细探讨了Chrome、Firefox等现代浏览器中JavaScript引擎的垃圾回收（GC）原理，重点讲解分代回收策略和标记清除/整理算法的工作流程，并通过示例帮助理解内存自动管理背后的机制。

为什么需要垃圾回收？

JavaScript是一种自动内存管理的语言。开发者通常不需要手动分配或释放内存（如C/C++中的malloc/free）。这带来了便利，但也引入了挑战：引擎如何知道何时释放不再使用的内存？答案就是垃圾回收机制（Garbage Collection, GC）。

核心策略：分代回收（Generational Collection）

垃圾回收的核心观察被称为分代假说（Generational Hypothesis）：

绝大多数对象的生命周期非常短暂，只有少数对象会存活较长时间。

基于此，现代浏览器（以V8引擎为例）将内存堆分为两个主要区域：

1. 新生代（New Space/Young Generation）

   • 空间较小（通常1~8MB）
   • 存放新创建的对象
   • 回收频率高（Minor GC）
   • 使用Scavenge算法（复制算法）

2. 老生代（Old Space/Old Generation）

   • 空间较大（约占堆的大部分）
   • 存放存活时间长的对象（从新生代晋升而来）
   • 回收频率低（Major GC）
   • 使用标记-清除（Mark-Sweep）或标记-整理（Mark-Compact）算法

新生代回收：Scavenge算法详解

新生代采用Scavenge算法，其核心是空间换时间。它将新生代分为两个等大的半空间（Semi-space）：

• From-Space：当前对象分配区
• To-Space：空闲区（用于复制存活对象）

工作流程

1. 新对象分配：所有新对象首先在From-Space中分配。
2. 触发条件：当From-Space即将填满时，触发Minor GC。
3. 可达性标记：从根对象（全局变量、当前函数调用栈等）出发，扫描新生代对象。
4. 复制存活对象：
   • 将From-Space中存活的对象复制到To-Space。
   • 复制过程中对象被紧密排列（消除内存碎片）。
   • 更新对象引用地址（由写屏障Write Barrier辅助）。
5. 晋升（Promotion）：如果对象已经历过一次Minor GC仍存活，则将其移至老生代。
6. 空间交换：清空From-Space，并将From-Space和To-Space角色互换。

示例分析

function createObjects() {
  const objA = { id: 'A' }; // 对象A（新生代）
  const objB = { id: 'B' }; // 对象B（新生代）
  return objA; // 返回objA，使其在函数外可访问
}

const keptObj = createObjects(); // keptObj引用objA
// 此时触发Minor GC

• GC前：From-Space中有objA和objB。
• 标记阶段：keptObj（根引用）指向objA，故objA存活；objB无引用，标记为死亡。
• 复制阶段：仅objA被复制到To-Space。
• 晋升检查：若objA是第一次存活，保留在新生代；若已存活过一次，则晋升至老生代。
• 空间交换：清空原From-Space（回收objB内存），并交换两个半空间。

老生代回收：标记-清除与标记-整理

老生代中对象存活率高、数量多，使用Scavenge算法成本过高（需双倍空间）。因此采用以下算法：

标记-清除（Mark-Sweep）

1. 标记阶段：从根对象出发，递归标记所有可达对象（存活对象）。
2. 清除阶段：遍历整个老生代，回收所有未标记对象的内存。
   • 优点：实现简单，清除速度快。
   • 缺点：产生内存碎片。

标记-整理（Mark-Compact）

为解决碎片问题，在标记后增加整理步骤：

1. 标记阶段：同标记-清除。
2. 整理阶段：将所有存活对象向内存一端移动，消除碎片。
3. 清除阶段：回收边界外的全部内存。
   • 优点：无内存碎片。
   • 缺点：对象移动成本高。

示例分析

let rootObj = { 
  ref1: { id: 'X' }, // 对象X
  ref2: { id: 'Y' }  // 对象Y
};

// 断开对对象Y的引用
rootObj.ref2 = null; 
// 后续触发Major GC（标记-清除）

• 标记阶段：从rootObj出发，标记rootObj和ref1（对象X）为存活；对象Y无引用，不标记。
• 清除阶段：回收对象Y的内存，对象X保持原位。
• 碎片问题：若后续分配大对象，可能无法利用对象Y释放的小块内存。

若采用标记-整理：

• 整理阶段：将对象X移动到原对象Y的位置（或其他连续空间）。
• 清除阶段：回收原对象X位置的内存（整块释放）。

高级优化策略

现代GC引擎通过以下技术减少主线程阻塞：

1. 增量标记（Incremental Marking）

将标记过程拆分为多个小任务，穿插在JavaScript执行间隙，避免长时间阻塞。

2. 并发标记（Concurrent Marking）

在后台线程执行标记任务，与主线程并行（需处理并发读写问题）。

3. 三色标记法（Tri-color Marking）

• 白色：未访问（待回收）
• 灰色：已访问但子对象未遍历
• 黑色：已访问且子对象已遍历
  支持增量回收的中间状态管理。

4. 空闲调度（Idle-Time GC）

利用requestIdleCallback在浏览器空闲时段执行低优先级GC任务。

内存泄漏的常见原因

即使有强大的GC，以下情况仍会导致内存泄漏：

1. 意外全局变量

   function leak() {
     leakedVar = 'This is global!'; // 未声明，绑定到window
   }
   

2. 未清除的定时器/事件监听

   const timer = setInterval(() => {}, 1000);
   // 忘记clearInterval(timer)导致回调函数持续引用
   

3. 闭包引用

   function outer() {
     const bigData = new Array(1000000);
     return function inner() {
       console.log(bigData.length); // inner持有bigData引用
     };
   }
   const holdClosure = outer(); // bigData无法释放
   

4. 脱离DOM的引用

   const elements = {
     button: document.getElementById('myButton')
   };
   // 即使从DOM移除#myButton，elements.button仍引用它
   

开发者工具诊断内存问题

• Chrome DevTools → Memory面板：
  • 拍摄堆快照（Heap Snapshot）对比对象分配。
  • 记录内存分配时间线（Allocation Timeline）。
• Performance面板：观察GC事件耗时及频率。

总结

现代浏览器的垃圾回收机制通过分代回收和标记清除/整理算法，结合增量标记、并发回收等优化技术，实现了高效的内存自动管理。开发者仍需注意代码中的引用关系，避免常见的内存泄漏模式。

理解GC原理不仅能帮助调试内存问题，还能指导我们编写更高效的JavaScript代码（如避免在热点路径中频繁创建临时对象）。