Lighthouse生成的是一个报告，会给你的页面跑出一个分数来。 分别是 页面性能（Performance）、Accessibility（可访问性）、Best Practices（最佳实践）、SEO 四项指标的跑分。甚至针对我们的性能问题给出了可行的建议、以及每一项优化操作预期会帮我们节省的时间。这份报告的可操作性是很强的——我们只需要对着 LightHouse 给出的建议，一条一条地去尝试，就可以看到自己的页面，在一秒一秒地变快。
Lighthouse 评分说明
（分数每次测会有偏差，而且跟网速也有关系，所以不用太在意分数，关心一下Lighthouse给我们的建议）
经过检测，Lighthouse 会对上述五个维度给出一个的评估得分，分值范围0-100，主要分为三个档次，分别用红黄绿三种颜色代表：
- 0 – 49（慢）：红色
- 50 – 89（平均值）： 橙色
- 90 – 100（快）： 绿色
如果得分能达到 90 分以上（绿色），则说明网站应用在该方面的评估表现符合最佳实践。
打开项目跑一下分数，看看都有什么问题（分数每次测会有偏差，而且跟网速也有关系，所以不用太在意分数，关心一下Lighthouse给我们的建议）还有个人觉得在生产环境测会比本地靠谱
我们以掘金首页为例，看下使用调试面板中的LightHouse
1. F12打开浏览器调试面板，切换到Lighthouse选项卡,如下所示
2. 选择需要测试的页面，点击Analyze page load按钮(Categories指标种类复选框可选择Performance、Accessibility、Best Practice、SEO四项，Device设备复选框选择Desktop)
3. 等测试完就能看到本网页的性能报告，其中包括各个指标评分
三、指标详解
一、页面性能（Performance）
我们评估后，就会有这么一个结果:
指标的含义在 Performance面板 那篇有详细解释
给出了一些优化建议：
- Serve static assets with an efficient cache policy（为静态资源提供缓存） 对于不常改变的静态资源比如说css、image等可以进行缓存，打开ngnix配置文件，把缓存配上（实际项目根据实际需要配置缓存）
- Eliminate render-blocking resources消除渲染阻止资源
- Reduce unused JavsScript/CSS 减少未使用的JavsScript/CSS
- Avoid enormous network payloads 避免大量的网络负载
二、可访问性（Accessibility）
Accessibility 辅助功能 : 无障碍设计，也称为网站可达性。是指所创建的网站对所有用户都可用/可访问，不管用户的生理/身体能力如何、不管用户是以何种方式访问网站。
比如：
Background and foreground colors do not have a sufficient contrast ratio. 这个意思就是某处文字背景色和文字颜色对比度不够，对于视障用户可能不好区分,展开可以看到具体是哪块元素。
三、最佳实践（Best Practices）
Best Practices 最佳实践 : 实践性检测，如网页安全性，如是否开启 HTTPS、网页存在的漏洞等
四、SEO 搜索优化
SEO（Search Engine Optimization）：搜索引擎优化检测，如网页 title 是否符合搜索引擎的优化标准等
