使用 Lighthouse 检查网络应用的质量并采取哪些措施来改进您的应用

2018年7月21日09:09:33 发表评论 363 阅读
使用 Lighthouse 审查网络应用。
Lighthouse 是一个开源的自动化工具,用于改进网络应用的质量。 您可以将其作为一个 Chrome 扩展程序运行,或从命令行运行。 您为 Lighthouse 提供一个您要审查的网址,它将针对此页面运行一连串的测试,然后生成一个有关页面性能的报告。

从此处,您可以失败的测试为指示器,看看可以采取哪些措施来改进您的应用。

注:Lighthouse 目前非常关注 Progressive Web App 功能,如“添加到主屏幕”和离线支持。不过,此项目的首要目标是针对网络应用质量的各个方面提供端到端审查。

使用入门
运行 Lighthouse 的方式有两种:作为 Chrome 扩展程序运行,或作为命令行工具运行。 Chrome 扩展程序提供了一个对用户更友好的界面,方便读取报告。 命令行工具允许您将 Lighthouse 集成到持续集成系统。

使用 Lighthouse 检查网络应用的质量并采取哪些措施来改进您的应用

Lighthouse 检查你网络应用的质量

使用 Lighthouse 审查网络应用。
Lighthouse 是一个开源的自动化工具,用于改进网络应用的质量。 您可以将其作为一个 Chrome 扩展程序运行,或从命令行运行。 您为 Lighthouse 提供一个您要审查的网址,它将针对此页面运行一连串的测试,然后生成一个有关页面性能的报告。

Chrome 扩展程序

下载 Google Chrome 52 或更高版本。

安装 Lighthouse Chrome 扩展程序。

转到您要进行审查的页面。

点击位于 Chrome 工具栏上的 Lighthouse 图标 (Lighthouse 图标)。

Chrome 工具栏上的 Lighthouse 图标

如果您在工具栏上没有看到此图标,它可能隐藏在 Chrome 的主菜单中。

Chrome 的菜单中的 Lighthouse 图标

点击此图标后,您应看到一个菜单。

使用 Lighthouse 检查网络应用的质量并采取哪些措施来改进您的应用

 

如果您想仅运行审查的子集,则点击 Options 按钮并停用您不关注的审查。 向下滚动并按 OK 以确认您的更改。

Lighthouse 选项菜单

点击 Generate report 按钮以针对当前打开的页面运行 Lighthouse 测试。

在完成审查后,Lighthouse 将打开一个新标签,并在页面的结果上显示一个报告。

使用 Lighthouse 检查网络应用的质量并采取哪些措施来改进您的应用

Lighthouse在页面的结果上显示一个报告

hcyaobin

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: