一些工具可以帮助您跟踪页面性能并衡量您的改进。最好的之一是 PageSpeed Insights。它可以作为Web 应用程序和Chrome开发者工具中的 Lighthouse 选项卡使用(Edge、Opera、Brave 和 Vivaldi 中也提供相同的工具)。
网页性能比以往任何时候都更加重要。用户期望网页像桌面应用程序一样灵活且响应灵敏。此外,Google Core Web Vitals 还可以衡量页面性能,这会影响 PageRank 和您的SEO工作 。
WordPress为超过三分之一的网站提供支持巴林电话号码库
,但性能受到无效托管、缓慢主题和过度依赖插件的影响。大多数问题可以通过升级到良好的托管并使用性能最佳实践来解决。
内容 隐藏
1 进入灯塔
2 什么是PageSpeed Insights API?
3 PageSpeed Insights API 简要说明
4 PageSpeed Insights API JSON 结果
4.1 加载体验
4.2 起源LoadingExperience
4.3 lighthouse结果
4.4 分析UTCTimestamp
5 个 有用的 JSON 结果指标
5.1 指标汇总
5.2 性能指标
6 无需代码即可创建生产力仪表板
7 创建 Web 性能仪表板
8 进一步发展的选择
9 总结
9.1 相关出版物:
进入灯塔
打开您想要浏览的页面并按 Ctrl/Cmd + Shift + I 或从更多工具菜单中选择开发人员工具来启动 Lighthouse。切换到 Lighthouse 选项卡并单击分析页面负载按钮。结果将在几秒钟内显示:
您可以深入了解顶级百分比,以查找解决已知问题的其他信息和提示。这个工具非常有价值,但也有缺点:
您必须手动运行您测试的每个页面。
随着时间的推移,记录因素如何改善或恶化并不容易。
需要核对的数据很多,很容易出错。
为开发人员提供了技术细节。对于想要快速了解进度的客户和经理来说,这可能会让人不知所措。
Lighthouse 性能可能会受到本地设备和网络速度的影响,这可能会导致错误的假设。
PageSpeed Insights API提供了一种解决这些问题的方法,使得测试可以自动化、记录和比较。
什么是 PageSpeed Insights API?
Google 提供免费的 PageSpeed Insights REST API,它返回包含所有 Lighthouse指标等的JSON数据。它允许您自动运行页面、存储捕获的数据、查看随时间的变化,并显示您需要的确切信息。
PageSpeed Insights API 模拟 Google 如何看待您的网站。您可以每隔几天或每次发布性能更新时运行该报告。
结果很有用,但并不总是反映实际的用户体验。如果您想跟踪所有用户设备和网络的实际性能,浏览器性能 API 是最佳选择。
PageSpeed Insights API 简要说明
将以下地址复制到您的网络浏览器中并编辑该网址以评估您的页面性能:
https://www.googleapis.com/pagespeedonl ... rsite.com/
Firefox 是理想的选择,因为它有一个内置的 JSON 查看器,尽管 Chrome 也有提供相同功能的扩展。以下是 Lighthouse 性能评估的总体结果:
您可以更改您自己的页面和首选项的 API URL 查询字符串。唯一需要的参数是 url,例如
url=https://mysite.com/page1
默认情况下,桌面测试会运行,但您可以使用以下命令显式请求它:
strategy=desktop
或使用以下方式切换到移动设备:
strategy=mobile
除非您指定您感兴趣的一个或多个类别,否则仅运行性能测试:
category=performance
category=accessibility
category=best-practices
category=seo
category=pwa
可以通过设置区域设置来设置特定语言 - 例如法语:
locale=fr-FR
和Google Analytics活动详细信息可以使用以下方式设置:
utm_campaign=
utm_source=
对于不频繁的请求,该服务是免费的,但如果您打算在短时间内从单个IP 地址运行许多测试,则需要注册 Google API 密钥。使用以下命令将密钥添加到 URL:
key=<api-key>.
您可以通过指定您选择的参数来构造 URL 查询字符串,参数之间用与号 (&) 分隔。以下 API URL使用移动设备测试https://mysite.com/页面,以评估性能和可访问性标准:
https://www.googleapis.com/pagespeedonl ... essibility
如果需要更多帮助,您可以创建自己的 URL 或使用Google 的 PageSpeed API URL 构建工具。
PageSpeed Insights API JSON 结果
测试通常会返回大约 600KB 的 JSON 格式数据,具体取决于所选类别、页面上的资产数量以及屏幕截图的复杂性(以 Base64 格式嵌入)。
数据量令人望而生畏,存在一些重复,并且结果的记录并不总是清晰的。 JSON 分为四个部分,如下所述。
]
加载经验
这些是针对最终用户的页面加载体验计算的指标。它包括 Core Web Vitals CUMULATIVE_LAYOUT_SHIFT_SCORE、FIRST_CONTENTFUL_PAINT_MS 和 FIRST_INPUT_DELAY_MS 等信息。如果未进行任何测量,详细信息和“类别”值将返回“快速”、“平均”、“慢速”或“无”。例子:
"loadingExperience": {
"metrics": {
"CUMULATIVE_LAYOUT_SHIFT_SCORE": {
"percentile": 0,
"distributions": [
{
"min": 0,
"max": 10,
"proportion": 0.970
},
{
"min": 10,
"max": 25,
"proportion": 0.017
},
{
"min": 25,
"proportion": 0.012
}
],
"category": "FAST"
},
来源加载经验
这些是为所有用户计算的聚合指标。这些部分与上面的 loadExperience 相同,流量较少的站点不太可能显示出任何性能差异。
灯塔结果
这是包含所有 Lighthouse 指标的最大部分。它包含有关测试的信息:
requestUrl - 您请求的 URL
FinalUrl 是所有重定向后测试的实际页面。
lighthouseVersion -软件版本
fetchTime — 测试执行时间
userAgent — 用于测试的浏览器的用户代理字符串
环境 - 扩展用户代理信息
configSettings - API 传递的设置
如何使用PageSpeed Insights API监控页面性能
-
- Posts: 14
- Joined: Tue Dec 03, 2024 4:37 am