Performance Monitor可实时监控JS Heap波动，刷新即显，适合快速排查内存异常增长；它显示可到达对象的堆内存、DOM节点数等四条曲线，但不记录历史或展示引用链。
直接在 Chrome DevTools 底部启用 Performance Monitor，就能实时看到 JS Heap 的波动曲线——它不依赖录制，刷新即显，适合快速排查内存是否异常增长。
快速开启 Performance Monitor
在任意 DevTools 面板（如 Elements 或 Console）右下角，点击三个竖点（⋯）→ 选择 More Tools > Performance monitor。浮层会固定在 DevTools 底部，持续显示四条实时曲线，其中最核心的是：
- JS heap：括号内数字是当前可到达对象占用的 JS 堆内存（单位 MB）
- DOM Nodes：当前已挂载的 DOM 元素总数
- CPU 和 Listeners 作为辅助参考项
识别 JS Heap 的健康波动模式
正常波动不是数值静止，而是有节奏地上升后回落：
- 每次用户操作（如点击、滚动、加载数据）后 JS Heap 短暂上升
- 随后触发垃圾回收（GC），曲线明显回落，接近操作前基线
- 若多次操作后，每次 GC 后都未能回到相近位置，出现阶梯式抬升，说明有对象未被释放
配合简单操作验证泄漏迹象
不用写代码，几秒就能试探：
- 点击浮层里的垃圾桶图标（强制执行 GC），观察 JS Heap 是否明显下降；若几乎不动，大概率存在强引用
- 在 Console 中执行
$$('*').length查 DOM 节点总数，操作前后对比差值 - 按 Ctrl+F 搜索
.detached（需先拍过堆快照），查看是否有脱离文档却仍被引用的 DOM
注意它的能力边界
Performance Monitor 是轻量级实时监控工具，优势是即时、低开销，但也有明确限制：
- 只显示“可到达对象”的堆大小，不包含已标记待回收的垃圾
- 不记录历史数据，无法回溯分析某次具体操作的影响时长
- 不展示对象类型、调用栈或引用链，定位根源需配合 Memory 面板的分配时间线或堆快照
