一、引言：为什么 Chrome 内存泄漏值得重视
说明内存泄漏在前端应用中的典型表现，如页面越用越卡、标签页崩溃、内存占用持续攀升，并点明本文的写作目标与读者收益。
二、先分清概念：内存泄漏、内存膨胀与 GC 压力
区分真正的内存泄漏、内存占用偏高和垃圾回收压力过大三类问题，避免误判，为后续诊断建立判断标准。
三、诊断前的准备工作
3.1 环境与工具准备
介绍 Chrome DevTools 相关面板、无痕模式、性能录制配置以及必要的浏览器版本说明。
3.2 建立可复现的测试场景
说明如何构造稳定的复现路径，包括操作步骤、重复次数和观察指标。
四、快速定位：从现象到可疑区域
4.1 使用任务管理器观察内存趋势
通过 Chrome 任务管理器查看标签页与进程的内存占用变化，初步判断泄漏范围。
4.2 使用 Performance 面板录制内存曲线
讲解如何录制内存时间线、识别 JS Heap 持续上升的锯齿形态。
4.3 使用 Memory 面板进行堆快照对比
介绍三次快照对比法，通过 Comparison 视图找出持续增长的对象类型。
五、深入排查：常见泄漏场景与验证方法
5.1 未解绑的事件监听器
说明全局事件、DOM 事件未移除导致的引用残留，并给出验证思路。
5.2 定时器与异步回调未清理
分析 setInterval、Promise 链和订阅未取消造成的对象长期存活。
5.3 闭包与全局变量持有大对象
讲解闭包引用链、意外挂载到 window 上的数据以及缓存未设上限的问题。
5.4 DOM 节点脱离文档但仍被引用
介绍 Detached DOM 的识别方式与常见成因。
5.5 第三方库与框架层泄漏
说明组件销毁不彻底、状态管理残留和第三方 SDK 的排查方法。
六、实战案例：一次完整的内存泄漏排查过程
以一个单页应用为例，完整走一遍从现象发现、快照对比、定位引用链到修复验证的流程。
七、修复与验证
给出修复后的回归验证方法，包括内存曲线对比、长时间压测和监控指标确认。
八、预防措施与工程化实践
- 建立内存基线并纳入性能监控
- 在组件卸载阶段统一清理副作用
- 为缓存设置容量上限与淘汰策略
- 在 CI 或测试流程中加入内存回归检查
九、总结
回顾诊断思路与关键工具，强调"先复现、再对比、后定位"的排查原则。