无需登录 数据私有 本地保存

Lighthouse JSON 报告查看器 - 本地审计结果可视化

11
0
0
0
拖拽 Lighthouse JSON 报告到此处
或通过以下方式加载报告文件

常见问题

什么是 Lighthouse？
Lighthouse 是 Google 开发的一款开源自动化工具，用于改善网页质量。它可以对网页进行性能、可访问性、最佳实践、SEO 和 PWA 等方面的审计，并生成详细的 JSON 报告。您可以在 Chrome DevTools、命令行或通过 PageSpeed Insights 运行 Lighthouse。
如何获取 Lighthouse JSON 报告？
有多种方式获取 JSON 报告：
1. Chrome DevTools：打开 DevTools → Lighthouse 面板 → 点击"Generate report" → 点击右上角下载按钮选择 JSON 格式。
2. 命令行：运行 lighthouse https://example.com --output json --output-path report.json
3. PageSpeed Insights：在线运行后下载报告。
Lighthouse 各项分数的含义是什么？
Lighthouse 分数范围为 0-100：
• 90-100（绿色）：优秀，表现良好。
• 50-89（橙色）：需要改进，存在优化空间。
• 0-49（红色）：较差，需要重点关注。
每个类别（性能、可访问性、最佳实践、SEO、PWA）独立评分，权重各不相同。
为什么我的 PWA 分数显示为"不适用"？
如果您的网站没有配置 Service Worker、Web App Manifest 等 PWA 所需的核心技术，Lighthouse 的 PWA 类别中许多审计项会显示为"不适用"（notApplicable）。这是正常的，意味着这些检查项与您的网站场景无关。如果您的网站确实不需要作为 PWA 运行，可以忽略这部分分数。
审计项中的"informative"和"manual"是什么意思？
• Informative（信息性）：该审计项仅提供信息，不计入最终分数，但可以帮助您了解页面的一些特征。
• Manual（手动检查）：这些项目需要人工判断，Lighthouse 无法自动评估，需要开发者自行检查确认。
如何利用这个工具提升网站质量？
建议流程：
1. 上传您的 Lighthouse JSON 报告到本工具。
2. 重点关注红色和橙色标记的审计项。
3. 展开每个未通过的审计项，查看详细描述和建议。
4. 按类别逐一优化，优先处理权重较高的项目。
5. 优化后重新运行 Lighthouse 并对比报告变化。
🔧 相关工具