内存面板提供了诊断工具,可让您查看 JavaScript 对象的内存分配情况、发现和隔离内存泄漏、按函数查看内存分配明细等。
概览
借助内存面板,您可以捕获四种配置文件类型。这些配置文件类型可从不同角度显示快照,并提供不同的实用功能:
- 堆快照:显示网页的 JavaScript 对象和相关 DOM 节点之间的内存分布情况。
- 时间轴上的分配插桩:显示一段时间内的插桩 JavaScript 内存分配。记录分析后,您可选择一个时间间隔,以查看已在其中分配且到录制结束时仍保持活跃状态的对象。使用此配置文件类型隔离内存泄漏。
- 分配采样:使用采样方法记录内存分配情况。此性能分析类型的性能开销最低,可用于长时间运行的操作。此工具能非常可靠地估计分配情况,并按 JavaScript 执行堆栈细分结果。
- 已分离的元素:显示由 JavaScript 引用保留的对象。
您可以选择在其中运行每个配置文件的 JavaScript 虚拟机实例。
如需了解详情,请参阅以下资源:
打开“内存”面板
如需打开回忆面板,请执行以下操作:
- 打开开发者工具。
- 按如下键打开命令菜单:
- macOS:Command + Shift + P
- Windows、Linux、ChromeOS:Ctrl + Shift + P
- 开始输入
memory
,选择 Show Memory,然后按 Enter 键。DevTools 会在开发者工具窗口的顶部显示 Memory 面板。
或者,您也可以通过以下方式打开 Memory 面板:
- 在顶部的操作栏中,点击 更多面板,然后从下拉列表中选择内存。
- 在右上角,依次选择 更多选项 > 更多工具 > 记忆。