在 Firefox 98 中，我们发布了现有性能面板的新版本。此面板现在基于 Firefox 分析器 工具，该工具可用于捕获网页的性能配置文件，检查可视化性能数据并对其进行分析以识别缓慢区域。

这个已经非常强大的工具的锦上添花是，您可以单击一下即可上传收集的配置文件数据，并与您的团队成员（或任何人）共享生成的链接。这使得在性能问题上协作变得更容易，尤其是在分布式工作环境中。

新的性能面板默认情况下在 Firefox DevTools 工具箱中可用，可以通过 Shift+F5 快捷键打开。

使用方法

用户需要做的唯一事情就是单击大的蓝色按钮 - 开始录制。查看下面的截图。

如新的面板顶部的新手引导消息所示，之前的分析器将在一段时间内可用，并最终完全删除。

开始分析时（即分析器正在收集性能数据），用户可以看到另外两个按钮

• 捕获录制 - 停止录制，获取到目前为止收集到的数据并将其可视化
• 取消录制 - 停止录制并丢弃所有收集的数据

当用户单击“捕获录制”时，所有收集到的数据都会在新的选项卡中可视化。您应该看到类似以下内容

UI 的检查功能非常强大，允许用户检查性能数据的每一个细节。您可能想关注由 Mozilla 的性能团队创建的这个详细的 UI 导览 演示文稿，以了解有关所有可用功能的更多信息。

定制

有很多选项可用于自定义收集哪些性能数据以及如何收集这些数据，以优化特定的用例（另请参见面板底部的 编辑设置… 链接）。

为了简化自定义，提供了一些预设，并且默认情况下选择了 Web 开发者 预设。分析器也可以用于分析 Firefox 本身，Mozilla 正在广泛使用它来使 Firefox 对于数百万用户来说速度更快。WebDeveloper 预设用于分析标准网页，其余用于分析 Firefox。

分析器也可以直接从 Firefox 工具栏使用，而无需打开 DevTools 工具箱。分析器按钮默认情况下在工具栏中不可见，但您可以通过加载 https://profiler.firefox.com/ 并单击页面上的“启用 Firefox 分析器菜单按钮”来启用它。

这就是按钮在 Firefox 工具栏中的样子。

如您从上面的截图中看到的，UI 几乎完全相同（与 DevTools 性能面板相比）。

共享数据

收集的性能数据可以公开共享。这是分析器最强大的功能之一，因为它允许用户将数据上传到 Firefox 分析器在线存储。在上传配置文件之前，您可以选择要包含的数据，以及要排除的数据，以避免泄露个人数据。然后可以将配置文件链接在在线聊天、电子邮件和错误报告中共享，以便其他人可以查看和调查特定案例。

这非常适合团队协作，这也是 Firefox 开发人员多年来一直用于解决性能问题的方式。配置文件也可以保存在本地机器上的文件中，并从 https://profiler.firefox.com/ 导入。

还有很多更强大的功能可用，您可以在详细的 文档 中了解更多信息。当然，就像 Firefox 本身一样，分析器工具也是一个开源项目，您可能希望 为它做出贡献。

还有一個很棒的 案例研究 关于如何使用分析器来识别性能问题。

DevTools 将会有更多功能，敬请期待！