Lighthouse前端性能优化测试工具

本是古典何须时尚 2022-10-06 00:40 179阅读 0赞

**安装**

1.  访问：[https://chrome.google.com/webstore/category/extensions?hl=zh-CN][https_chrome.google.com_webstore_category_extensions_hl_zh-CN]
2.  搜索`lighthouse`点击添加进扩展程序  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzMTc0NjQz_size_16_color_FFFFFF_t_70]
3.  刷新页面
4.  `F12`调出控制台选择`lighthouse`并点击`generate report`允许等待生成报告  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzMTc0NjQz_size_16_color_FFFFFF_t_70 1]

[https_chrome.google.com_webstore_category_extensions_hl_zh-CN]: https://chrome.google.com/webstore/category/extensions?hl=zh-CN
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzMTc0NjQz_size_16_color_FFFFFF_t_70]: /images/20221005/3453592297fd4fcf89ae85c6843b65b4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQzMTc0NjQz_size_16_color_FFFFFF_t_70 1]: /images/20221005/0103a162a7d94787a388a7957384b1f2.png

发表评论取消回复

表情：

评论列表（有 0 条评论，179人围观）

还没有评论，来说两句吧...

相关阅读

相关 web页面性能检测工具Lighthouse

> About Automated auditing, performance metrics, and best practices for the web. Lighth

比眉伴天荒/ 2024年03月22日 14:51/ 0 赞/ 79 阅读

相关【前端性能优化】Webpack性能优化

目录 1. 什么是Webpack？ 2. 提高构建速度 2.1 npm install 过程中的优化

ゞ浴缸里的玫瑰/ 2022年12月04日 02:27/ 0 赞/ 485 阅读

相关前端性能优化-CSS性能优化

文章目录一、内联首屏关键CSS 二、异步加载CSS 异步加载的几种方式 1.js动态创建样式表link元素，并插入到DOM中

ゞ浴缸里的玫瑰/ 2022年11月13日 14:26/ 0 赞/ 434 阅读

相关 Lighthouse前端性能优化测试工具

安装 1. 访问：[https://chrome.google.com/webstore/category/extensions?hl=zh-CN][https_chrom

本是古典何须时尚/ 2022年10月06日 00:40/ 0 赞/ 180 阅读

相关前端性能优化

前端性能优化 1.　　减少HTTP请求　　　　基本原理： > 　　在浏览器(客户端)和服务器发生通信时，就已经消耗了大量的时间，尤其是在网络情况比较糟糕的时候

布满荆棘的人生/ 2022年09月25日 10:26/ 0 赞/ 40 阅读

相关 Linux 性能监控、测试、优化工具

Linux 性能监控、测试、优化工具监控 ![0_wx_fmt_png][] 测试 ![0_wx_fmt_png 1][]

短命女/ 2022年09月25日 08:29/ 0 赞/ 237 阅读

相关前端性能优化

文章目录 1.图片优化 1.1 图片懒加载 1.2 图片预加载 1.3 响应式图片加载 1.4 渐进式图片

港控/mmm°/ 2022年09月07日 09:59/ 0 赞/ 90 阅读

相关 Linux 性能监控、测试、优化工具

Linux 平台上的性能工具有很多，眼花缭乱，长期的摸索和经验发现最好用的还是那些久经考验的、简单的小工具。系统性能专家 Brendan D. Gregg 在最近的 Linu

àì夳堔傛蜴生んèń/ 2022年08月06日 11:10/ 0 赞/ 274 阅读

相关前端性能优化

前端性能优化的方法：合并、压缩、缓存或者在服务器上开启gzip之类的，目的都是为了让页面加载的更快资源预拉取（prefetch）则是另一种性能优化的技术。通过预拉取可以告诉

Dear 丶/ 2022年06月06日 10:25/ 0 赞/ 385 阅读

相关前端性能优化

1. 减少 HTTP 请求数量在浏览器与服务器进行通信时，主要是通过 HTTP 进行通信。浏览器与服务器需要经过三次握手，每次握手需要花费大量时间。而且不同浏览器对资源文

拼搏现实的明天。/ 2021年11月01日 21:20/ 0 赞/ 575 阅读