介绍

Lighthouse 是一个开源的自动化工具，用来测试前端页面性能，反馈页面问题以提升页面体验。可以联合谷歌浏览器，作为插件导入，开启后可测试页面性能

下载链接

链接: https://pan.baidu.com/s/1L2Ymkdw9wSB8RASMU2GN0Q 提取码: z6m3
下载后，打开谷歌浏览器，扩展程序，打开 开发者模式，将安装包拖入到页面，然后打开开关，如下图
点击我的扩展程序，将改程序固定到工具，就可以在浏览器右上角查看或者使用该插件

使用方法

1、浏览器打开要测试的页面
2、F12调出控制台，在右侧展开，找到 lighthouse 灯塔，点击打开
3、如下可看到分析按钮，点击按钮，即可分析前端性能

前端性能指标解读

指标	含义	快	中	慢（超标）
First Contentful Paint	首次绘制内容	0~1.8s	1.8~3s	>3s
Speed Index	速度指标	0~3.4s	3.4~5.8s	>5.8s
Time to Interactive	可交互时间	0~3.8s	3.9~7.3s	>7.3s
Total Blocking Time	总阻塞时间	0~200ms	200~800ms	>800ms
Largest Contentful Paint	最大内容绘制	0~2.5s	2.5~4s	4s