在blog.mozilla.org 上，我们分享了速度对比研究的结果，展示了启用跟踪保护的 Firefox Quantum 与其他浏览器的速度对比。虽然博客文章重点关注结果以及跟踪保护可以为用户提供的速度优势，即使是在非私人浏览模式下，我们也希望分享一些关于这些页面加载时间对比研究和不同浏览器基准测试背后的方法的见解。

跨浏览器性能比较的通用方法

在跨浏览器比较性能时，最重要的部分是要选择可比较的指标。最常见的是，这些指标来自标准化的 Web API。关于性能比较，导航计时 API 提供了跨浏览器可用的大量数据来源。特别是，其PerformanceTiming 接口 提供了访问属性的权限，这些属性提供了页面加载期间发生的各种事件的性能数据。

为了完整性，我们想提及还有关注屏幕截图的视觉检查指标。这里感兴趣的指标包括页面请求开始的计时，例如鼠标点击或按键，到特定时间点：首次绘制 或视觉指标，例如速度指数，感知速度指数 或视觉完整性，即折叠上方不再发生更改的时刻。

对于这篇博文，我们将重点关注基于导航计时 API 的比较。

选择测试集并设计测试

除了定义良好的测试指标集外，还需要选择有意义的测试内容。关注技术方面的基准测试和比较可能会选择一组具有挑战性的网站。在我们的测试中，我们关注用户，因此寻找对用户重要的网站选择。通常，一组热门网站是一个不错的选择，尽管有时有必要关注特定类别。例如，Alexa 提供了不同类别和国家/地区的顶级网站集。

在我们的研究中，我们重点关注全球排名前 200 的新闻网站，因为这些网站往往拥有最多的跟踪器。这些网站在 Chrome v61.0.3163.100 中的普通模式和隐身模式以及 Firefox Quantum Beta v57.0b10 中的普通模式和启用跟踪保护的私人浏览模式下加载。每个浏览器每个网站加载 10 次。

选择好指标和一组测试网站后，就可以开始运行测试了。

使用 Selenium WebDriver 控制实验

每个运行过基准测试和性能比较的人可能都同意我的观点，即运行测试和收集数据可能很乏味。因此，在可能的情况下自动执行测试是有意义的。同样，选择跨浏览器工作的自动化方法也很重要。这可以通过像Mozilla 的 Hasal 项目 这样的外部脚本应用程序或像Selenium WebDriver 这样的浏览器自动化框架来完成，它是一个远程控制界面来控制用户代理。

我们的页面加载测试基于一个 Python 脚本，该脚本使用Selenium Python 绑定 通过geckodriver 和chromedriver 分别控制浏览器。一个功能齐全但尚未完美的脚本，类似于在 Chrome 和 Firefox 中加载一组网站并在每次加载后存储 window.performance.timing 的脚本，可以在此处找到。我期待改进的补丁。

我们在连接到 Webpass 100Mbps 连接的 WiFi (802.11ac, 867Mbit/s) 上的最新 Macbook Pro (13 英寸 Macbook Pro 2017, 3.1GHz i5, 16GB 内存, OSX 10.13) 上执行了测试。该脚本在其中一个浏览器中加载网站并将性能加载时间与 return window.performance.timing 作为 csv 文件保存。每个网站在每个浏览器中加载 10 次。在脚本中，页面加载超时设置为 60 秒。尤其是网站上的广告，页面加载速度可能非常慢。在这种情况下，页面加载在 60 秒后由脚本中断。它使用 PerformanceTimingAPI 检查 loadEventEnd 是否已存在。

loadEventEnd 代表请求页面加载事件完成的时刻，即页面的所有静态内容都已完全加载。如果保存了 loadEventEnd 时间，它将存储在 csv 文件中。如果没有，该脚本将尝试重新加载相应的页面。在极少数情况下，重复的页面请求也超时，该页面将手动加载，没有任何自动设置的超时，并在页面完全加载后手动请求 window.performance.timing。

结果一览

我们的研究的原始数据可以在此处找到。作为参考，R 中的分析也可用作 RMarkdown 笔记本。

首先，让我们比较一下浏览器的平均页面加载时间。为此，我们查看每个浏览器按所有 2000 次测量（200 个新闻网站 * 每页 10 次运行）平均得到的平均页面加载时间。每个浏览器的平均值在下面以橙色点绘制。此外，为了更好地了解数据的分布，还显示了每个浏览器的箱线图。

Chrome 隐身模式和 Firefox Quantum 私人浏览之间的加载时间差为 **2.4 倍**。我们在 Chrome 的普通模式和隐身模式之间没有看到差异。这表明 Firefox Quantum 与其私人浏览器选项之间的差异，这类似于 Chrome 的隐身模式 + 跟踪保护，必须来自跟踪保护。

loadEventEnd 可能不是用户在加载页面时在屏幕上体验的最佳指标，这是一个合理的担忧。但是，最近发现 loadEventEnd 和平均会话加载时间都是用户跳出率的良好预测指标。从SOASTA Inc. 的第三方研究结果 中，我们发现平均会话加载时间为 6 秒会导致 70% 的跳出率。让我们看看我们数据中加载时间超过 6 秒的页面的比例，并在不同浏览器之间进行比较。虽然启用跟踪保护的 Firefox Quantum 的页面加载时间只有约 5.5% 超过 6 秒，但 Google Chrome 的页面加载时间约为 31%。

最后一个感兴趣的问题是，数据是否也可以用于了解页面加载过程中不同浏览器之间的差异发生在哪里。让我们再次只关注 Chrome 隐身模式和 Firefox Quantum 私人浏览模式。performance.timing 在页面加载过程中提供事件。我们可以按页面加载过程中的出现顺序打印这些事件，并查看不同浏览器之间的差异，以newsweek.com 为例。

很明显，主要差异发生在加载过程的末尾。在两个浏览器中创建 DOM 所需的工作都同样快，但 Chrome 比 Firefox 等待内容的时间明显更长。主要差异开始出现于 domComplete，即解析器完成对主文档的工作的时刻。这再次强调了 Firefox 的跟踪保护在私人浏览中使用，通过阻止跟踪器来阻止加载缓慢的第三方内容。

总结和行动号召

这项研究表明，您可以通过相对简单的方法从页面加载速度比较中得出有趣的见解。如果您想执行自己的基准测试并将您最喜欢的浏览器与竞争对手进行比较，您可以自由地采用这种方法并将其应用于自己的测试中。我们选择了新闻网站作为我们的测试集，因为我们正在寻找包含许多跟踪器的网站。扩展这项研究的一些想法是

• 比较其他网站集的页面加载时间
• 使用其他浏览器的测量结果扩展这些发现
• 使用移动设备的测量结果扩展这些桌面端发现

或者，如果您愿意在您的机器上针对您所在国家/地区的顶级新闻网站重复我们的研究，那么我们很高兴您能在下面的评论中分享结果。

有兴趣体验这些结果在速度方面意味着什么？亲自尝试私人浏览模式！

如果您想更进一步，每次使用 Firefox 时都启用跟踪保护，请下载 Firefox Quantum。请记住，跟踪保护可能会阻止社交“喜欢”按钮、评论工具和一些跨站点视频内容。在 Firefox Quantum 中，打开首选项。选择隐私和安全，向下滚动，直到找到跟踪保护部分。或者，只需在“在首选项中查找”字段中搜索“跟踪保护”。启用“始终”的跟踪保护，您就可以在使用 Firefox Quantum 时享受更快的速度和更好的隐私。