Lighthouse Badges
This package allows you to easily create Lighthouse badges for all Lighthouse categories.
Ever wanted to brag about your sites's awesome Lighthouse performance? Then this is the package for you!
Examples
All Badges
Single Badge
Usage
Help
usage: lighthouse-badges [-h] [-v] [-s]
[-b {flat,flat-square,plastic,for-the-badge,popout,popout-square,social}]
[-o OUTPUT_PATH] [-r] -u URLS [URLS ...]
Generate gh-badges (shields.io) based on lighthouse performance.
Optional arguments:
-h, --help Show this help message and exit.
-v, --version Show program's version number and exit.
-s, --single-badge Output only one single badge averaging all lighthouse
categories' scores
-b {flat,flat-square,plastic,for-the-badge,popout,popout-square,social}, --badge-style {flat,flat-square,plastic,for-the-badge,popout,popout-square,social}
Define look and feel for the badge
-o OUTPUT_PATH, --output-path OUTPUT_PATH
Define output path for artifacts
-r, --save-report Save lighthouse report as html for every supplied url
Required arguments:
-u URLS [URLS ...], --urls URLS [URLS ...]
The lighthouse badge(s) will contain the respective
average score(s) of all the urls supplied, combined
Additionally you can pass parameters to the lighthouse process directly via environment variable:
# This will pass '--preset=desktop' to the lighthouse process
export LIGHTHOUSE_BADGES_PARAMS="--preset=desktop"
lighthouse-badges --urls https://www.youtube.com/
Run
Hint: node versions below 12 are not supported.
Option 1: npm
npm i -g lighthouse-badges
lighthouse-badges --urls https://www.youtube.com/ https://www.youtube.com/feed/trending -o test_results
Option 2: npx
npx lighthouse-badges --urls https://www.youtube.com/ https://www.youtube.com/feed/trending -o test_results
Option 3: Docker
# Warning, the docker version may alter the lighthouse results
docker run --rm \
-v $PWD/test_results:/home/chrome/reports \
emazzotta/lighthouse-badges \
/bin/sh -c "lighthouse-badges --urls https://www.youtube.com/ https://www.youtube.com/feed/trending"
Contributing
Sponsors
Sponsored by JetBrains
Author
-
Lighthouse 是一个开源的自动化工具，用于改进网络应用的质量。 可以将其作为一个 Chrome 扩展程序运行，或从命令行运行。 当为 Lighthouse 提供一个要审查的网址，它将针对此页面运行一连串的测试，然后生成一个有关页面性能的报告。可以参考失败的测试，看看可以采取哪些措施来改进应用。 使用入门 运行 Lighthouse 的方式有两种：作为 Chrome 扩展程序运行，或作为命令
-
Lighthouse 是一个简单的 Akka.Cluster（Akka.NET）服务发现平台，旨在更容易部署 Azure/Elastic Beanstalk/AppHarbor 等 PaaS。 Lighthouse 的运行原理：Lighthouse 在静态地址上运行，在部署其它 Akka.Cluster 服务时不会更新，在其它应用部署、重新部署、按比例缩放等过程中，Lighthouse 只是作为一
-
Lighthouse Batch Reporter 是一个在单个命令中就可以对多个站点运行 Lighthouse 分析的工具。支持按顺序对多个站点执行 Lighthouse 分析并生成包含其所有分数的摘要报告。分数是根据性能、PWA、可访问性和最佳实践以及 SEO 部分之间的平均分数计算得出的。 可以为每个站点写出完整的 JSON 报告，也可以选择 HTML 报告。 Lighthouse Batc
-
Lighthouse 使用案例 前面两节我们对 Lighthouse 的使用方法和性能评分计算的原理有了一定的了解，下面我们使用 Lighthouse 对一个实际站点 https://lavas.baidu.com/ 进行测试，看看 Lighthouse 能对站点提供哪些方面的改进指导。 对站点进行测试 为了更直观地展示测试结果，我们使用 Chrome Devtools 中集成的 Lighthou
-
Lighthouse 评分指南 使用 Lighthouse 对网站进行测评后，我们会得到一份评分报告，它包含了性能（Performance），PWA（Progressive Web App），访问无障碍（Accessibility），最佳实践（Best Practice），搜索引擎优化（SEO）等几个部分。这里我们将介绍一下 Lighthouse 是如何计算这几个评分的。 性能评分 性能评分的分值
-
Lighthouse 是一个开源的自动化工具，用于评价 WebApp 多方面的效果指标，并给出建议以帮助开发者改进 WebApp 的质量。 你可以通过2种方式来安装并使用 Lighthouse Chrome 插件形式： Lighthouse - Chrome 网上应用商店 命令行形式： npm install -g lighthouse 为 Lighthouse 提供一个你要审查的网址，它将针对此