现代网络被广泛的人群所使用,他们使用各种不同的设备和网络连接类型。您的作品可以触达全球各地的用户,但为所有用户提供可靠的 Web 体验可能具有挑战性。 仅仅了解可靠性的含义就可能是一项挑战。
离线时可靠
考虑可靠性的一种方式是,您的 Web 应用是否可以在没有网络连接的情况下正常运行。对于从应用商店安装在移动设备上的平台专用应用,用户会理所当然地认为它们具有这种可靠性。当您看到其中一个应用的图标时,无论您当前是否连接到互联网,都希望能够点按该图标并打开某种体验。
直到最近,构建在没有网络连接的情况下可靠的 Web 应用一直是一项挑战。
可靠地快速
考虑可靠性的另一种方式是,当用户拥有可能不太理想的网络连接时,他们是否可以依赖您的 Web 应用以足够快的速度加载。当回头客使用移动网络连接时,与使用 Wi-Fi 连接时相比,与您的 Web 应用互动时是否会有相同的体验?对于具有高延迟或 "lie-fi" 连接的用户呢?即使在这些情况下,您的 Web 应用是否也能可靠地快速运行?
在最佳情况下快速运行是不够的。用户将根据您的 Web 应用在所有网络条件下的行为来评估其性能。
可靠性是可以实现的
好消息是,现代 Web 平台提供了多种技术(例如 Service Worker 和 Cache Storage API),这些技术 可以作为创建可靠 Web 应用的基础。它们允许您编写位于 Web 应用和网络之间的代码。在许多情况下,您可以完全绕过网络,而是使用之前缓存的内容来满足 Web 应用的要求。
您的指路明灯:离线时响应 200 OK
开始构建 Service Worker 并从缓存提供内容后,很难知道您是否有效地执行了这些操作。您如何知道您实现的 Service Worker 确实有助于您的 Web 应用避免使用网络? 如何防止对缓存策略进行的小幅更改破坏您精心设计的离线体验?
Lighthouse 提供了一项 特定测试,该测试在构建可靠的 Web 应用时特别有用: 离线时响应 200 OK:
这里实际测试的是什么?它归结为在浏览器中模拟网络连接丢失,然后尝试加载您网站上正在接受审核的任何网址。这使用受控的、可重复的操作序列测试了构建可靠网站的一个方面,即“离线时可靠”。
这是一个旅程
如果您刚刚入门,那么您很可能会在“离线时响应 200”检查中获得否定结果。没关系! 除非您使用的是自定义的启动器项目,否则 Web 应用默认不具有这种可靠性。接下来的几份指南将介绍您需要使用的技术来确定 Web 应用正在加载的内容,并教您如何使用 Lighthouse 使加载体验可靠。
在此过程中,我们建议您不断重新运行 Lighthouse 审核。它们将作为您整个旅程的指路明灯,从新的 Web 应用开始,到可靠的渐进式 Web 应用结束。