到今天应该已经可以顺利写出一个 PWA 了。不过为了避免释出后使用者无法安装的窘境,可以用 Lighthouse 来检查是否达到 PWA 的标准。
Lighthouse 是个开放源代码的检测工具,可以用来检测效能、可用性、SEO、PWA 等指标。而且 Lighthouse 整合在 DevTools 中,不管是不是已发布在公开的网域、IP 上,还是未发布的测试网站,甚至是需要账号密码才能登入的网站,都可以顺利检查。
打开你的 PWA 网站后,按下右键→检查元素叫出 DevTools,并找到 Lighthouse 页签,可以看到右边有你可以测试的选项,你也可以选择要测试手机还是电脑。如果要开发适用于 Chromebook 的 PWA 应用程序,这边选择 Desktop。
Lighthouse 会自动开始检查,不用十秒的时间就会跑出报表。
接着就会跑出刚刚你勾选的检测项目的指标,以目前的范例可以看到,Performance 的部分效能不大好,不过大部分都不错,也符合了 PWA 指标。
报告也会显示 Performance 不好的原因,你可以点击这些标题,查看你没有通过的原因,修改后再跑一次检测,看看有没有改变成绩。你也可以往下看你通过的项目有哪些。
平常没有要开发 PWA 的话,不用特别最后一个检测项目。但今天最重要的是这个 PWA,先看一下报表再看细节是什么。
之后不知道会不会增加,不过目前有三个指标:快速可靠、可安装、PWA **化。其中里面又有 3 个、3 个、8 个子项目。快速可靠是指开始画面、目前画面都要是可以浏览,手机浏览要够快等等。最后则是 PWA 优化,可以参考这边的细节,做出一个更友善的 PWA。
