网页速度（浏览器）性能指标

解读网页速度（浏览器）结果

网页速度（浏览器）使用真实网络浏览器，通过提供网站组件指标的拆分仪表板（包括加载时间、响应时间、状态、组件大小等），帮助您深入了解网站性能。此外，您还需了解用于渲染资源的 HTTP 协议（1.1 或 2.0 版本）。主仪表板有一个自定义状态横幅，通过按运行状态和状态对已配置的监视器进行分类来识别它们。您还可以查看账户中正在运行的监视器数量和剩余告警积分。通过单击 + 购买更多按钮，可以购买更多监视器和告警积分。您可以通过电子邮件分享监视器详情，这些电子邮件只能发送给已同意从 Site24x7 接收邮件的已验证用户。

性能仪表板分为以下选项卡：

摘要
中断
清单
日志报表
CDN 报表
Lighthouse 报表
根本原因分析 (RCA) 报表

摘要

"摘要"选项卡列出了网页的所有指标。

事件时间线
"事件时间线"小部件记录所选监视器在指定时间范围内的所有历史事件。您可以使用它来识别和解读各种历史事件，包括标记为宕机、严重、故障、维护、暂停或异常的事件。每个事件都有颜色编码，便于识别。可以深入分析事件以提取最多数据，方便故障排除。您还可以跟踪特定时间段内的实际中断时段和总中断时长。

页面加载时间

"页面加载时间"部分显示网站性能的历史信息，以及可用性、页面加载时间、宕机持续时间、宕机事件数量和 SLA 违规情况。图表显示 DNS 时间、连接时间、首字节时间和下载时间等各种因素的页面加载时间。它还显示已配置网页的最大、最小、平均加载时间以及第 95 百分位（毫秒），以及平均吞吐量值（KB/秒）。如果已配置，还会显示网页的全局可用性。

Site24x7 中的百分位数可用于查找异常值。第 95 百分位是一个值，该值大于或等于在所选时间范围内轮询数据的 95% 观测值。换言之，95% 的响应速度都快于此值。

浏览器和网络限速配置文件

每个浏览器显示为单独的选项卡，便于在特定浏览器的性能洞察之间切换。

根据添加监视器页面上保存的配置，系统会显示所选浏览器以及可用模拟网速下的性能数据。以下指定的部分会根据所选浏览器和网速动态加载数据。

可用网速

支持以下模拟网速：

LAN（默认）
3G
4G
5G

每个网速旁边显示的值表示该特定网络条件下的页面加载时间，帮助您比较不同连接场景下的性能。

注意

此功能仅在 Chrome 浏览器中受支持。

对于其他浏览器，性能数据仅显示 LAN 速度。在这种情况下，不会显示网速选择栏。

优势

在不同真实网络条件下评估各浏览器的页面性能。
帮助快速识别因网速较慢或特定浏览器行为引起的性能瓶颈，有助于做出更好的优化决策。

在每个浏览器下，页面加载时间部分分为以下类别：

页面摘要
网页摘要
域摘要
控制台错误
问题

页面摘要
本部分显示网页摘要，包括性能指标、资源和 Web 指标，还包括网页截图。

本部分展示了使用真实浏览器检查的所有网页元素的性能指标。要了解详细计算方法，请阅读此文章。

以下是可用指标列表：

指标	描述
DNS 时间 (ms)	DNS 时间是解析请求域名所需的时间。DNS 时间出现峰值表示域名解析花费了更长时间。
连接时间 (ms)	连接时间是客户端与域 IP 地址建立 TCP 连接所需的时间。服务器过载等因素可能需要更多时间来建立连接，可在影响最终用户之前及时识别和解决此类问题。
SSL 时间 (ms)	完成 SSL/TLS 握手所需的时间。此时间包括确认服务器和客户端身份、共享双方支持的密码、签名或其他选项的详情，以及创建或交换用于数据加密的密钥。
首字节时间 (ms)	首字节时间是从建立到服务器的连接到开始接收基本页面的第一个响应所用的时间。这实际上是服务器响应时间加上网络延迟时间。图表中首字节时间出现峰值可能表明服务器处理请求存在延迟。
开始渲染 (ms)	开始渲染时间是当网页的相关部分开始在浏览器窗口中加载时的测量值（即用户不再看到空白白色窗口的时间点）。
文档完成 (ms)	文档完成时间是页面完成加载所有内容并准备好供用户交互的时间点。
页面加载时间 (ms)	页面加载时间是加载响应完整内容所需的总时间。

页面摘要部分还包括所分析网页的截图。

本部分展示了使用真实浏览器检查的所有网页元素的资源情况。以下是可用指标列表：

指标	描述
失败资源	网页上在访问期间未正确加载的任何元素均称为失败资源。监控这些失败资源对于确保所有关键元素正确加载至关重要。
不安全资源	通过未加密的 HTTP 连接（而非 HTTPS）加载的网站元素（如图像、脚本或样式表）称为不安全资源。
JS 堆总大小 (KB)	JavaScript 堆大小提供了浏览器内存中存储 JavaScript 对象、变量和函数的区域。JavaScript 引擎对此进行管理，在执行代码时动态分配和释放内存。
JS 堆大小限制 (KB)	JavaScript 堆大小限制是 JavaScript 引擎为存储堆中的对象、变量和函数而分配的最大内存量。
CDN 命中率 (%)	CDN 命中率 %：（命中数 / 命中和未命中链接总数）× 100 允许的标头包括：x-cache、x-cache-status、x-cache-hits、cf-cache-status、server-timeing、x-proxy-cache、x-origin-cache 和 akamai-cache-status。如果标头值为以下内容，则声明为 CDN 命中：HIT, HIT; HIT,MISS; MISS,HIT ; DYNAMIC ; H; 1,1; 1,0 ; 0,1; 1 如果标头值为以下内容，则为 CDN 未命中：MISS,MISS; 0,0; 0

本部分展示了使用真实浏览器检查的所有网页元素的 Web 指标。以下是可用指标列表：

指标	描述
首次内容绘制 (ms)	首次内容绘制 (FCP) 是一项指标，用于测量页面上第一个文本或图像为用户加载的时间。FCP 是浏览器渲染文档对象模型 (DOM) 中第一位内容的时间。第一位内容可以是文本或图像，FCP 为用户提供了页面实际正在加载的初始提示。
最大内容绘制 (ms)	最大内容绘制 (LCP) 是页面加载最大元素所用时间的测量值。LCP 测量网站向用户显示屏幕上最大内容所需的时间。通常认为它包括页面折叠以上的所有内容，即不滚动页面即可看到的内容。
累积布局偏移	累积布局偏移 (CLS) 测量用户尝试访问页面时发生的布局偏移。CLS 是一项性能指标，用于测量页面加载时的感知视觉稳定性。结果将量化为该页面上所有单个布局偏移的汇总分数。CLS 是 Google Web 指标之一。

瀑布图
瀑布图展示了 URL 的各种元素，包括状态码、响应时间、大小、HTTP 版本、不安全链接、CDN 命中、失败资源、SSL 时间和首字节时间。它以可视化方式呈现每个组件对页面的贡献，有助于识别导致加载时间较长的组件。

单击分享此内容后，您可以复制瀑布图的永久链接，在单独页面上查看，并与他人分享公开链接。链接在剪贴板上有效期为七天。

不安全链接：使用 HTTP 或不安全连接的 URL 数量将在此处以不安全链接形式列出。
您现在可以使用下拉选项筛选资源。可用筛选器包括：所有资源、前 20 个资源、按大小排列的前 20 个资源、前 20 张图像、前 20 个 JS、前 20 个 CSS、不安全资源（此处将列出 HTTP URL）、CDN 未命中资源以及包含嵌入链接数量的各个域。前 20 个资源/图像/JS/CSS/域按响应时间降序排列选取。

您还可以通过选中 CSS、图像、HTML、JavaScript 和其他的相应复选框来筛选资源，从而轻松对列表中的资源进行分类。

网页摘要
网页摘要是对网页关键内容的简要概述，包括请求数、总对象数、图像数、JavaScript 数、CSS 数和总页面大小。该摘要还提供饼图，展示以下内容：按请求分类的内容细分、按大小分类的内容细分、响应时间细分和按域分类的请求数细分。
域摘要
本部分显示特定 URL 下各域发送的请求数、代理中用于渲染资源的 HTTP 版本以及每个域的响应时间。
其他详情包括：域的 IP 地址、每个域的大小 (KB)、每个请求的平均页面加载时间（毫秒）以及平均吞吐量值（内容长度/响应时间）。

例如，在 URL www.mysite.com 下，图像从 images.xyz.com 加载；广告横幅从 ads.sample.com 加载，以此类推。每个域发送的请求数、其 HTTP 版本（1.1 或 2.0）以及各域的响应时间均在域摘要部分中详细说明。

这里还提供了根据第一方域、第三方域、CDN 域和广告筛选域的选项。

域摘要根据按域划分的总请求量和按域划分的持续时间，显示过去 24 小时的趋势报表，有助于了解过去的性能并为未来规划做出数据驱动的决策。
控制台错误
控制台错误是显示在开发者控制台中的消息，指示 JavaScript 问题、网络问题或与 CSS 或 HTML 相关的错误。这些错误有助于开发者识别和解决问题，提升网页的整体质量。
选择控制台错误选项卡可获取控制台错误列表。
问题
问题选项卡显示浏览器检测到的与网页相关的问题列表，分为三个部分：重大变更、改进和页面错误。
重大变更：本部分突出显示需要立即关注的关键问题。
改进：此处列出了可对网页进行增强的建议。
页面错误：本部分列出与 JavaScript、CSS、HTML 及其他元素相关的错误。
每个类别都有助于开发者有效识别和解决问题。

按资源类型划分的平均大小
按资源类型划分的平均大小是网页上使用的每类资源（包括图像、脚本、HTML、样式表等）的数据大小（兆字节）度量值。这些数据有助于分析资源加载情况、优化性能，并识别可能影响网页速度的大型资源。
Web 指标
本部分提供 Web 指标（如首次内容绘制和最大内容绘制）的图表。了解更多关于 Web 指标的信息。
地理地图
地理地图通过整合来自综合和 RUM 来源的数据，提供网页全球可用性和性能的可视化展示。您可以将鼠标悬停在不同区域上，以查看平均响应时间和其他关键指标。这种统一视图有助于您了解网页在各个地理区域的性能，包括模拟浏览器检查和实际用户体验两个维度。

借助地理地图，您可以快速识别页面加载时间较慢的区域，将综合浏览器指标与真实用户性能数据相关联，并确定问题是针对特定区域还是广泛存在。这有助于更快地检测和解决前端性能瓶颈，缩短平均检测和修复时间。

按指标查看

选择一个指标，以跨位置可视化可用性和性能。地理地图会根据所选指标动态更新，让您分析趋势。
- 响应时间：使用颜色渐变显示（绿色表示加载速度较快，红色表示加载速度较慢）。气泡大小随响应时间增加而增大、随加载速度加快而缩小，有助于识别各区域的性能瓶颈。
  - 综合： 显示从已配置位置使用基于浏览器的监控捕获的响应时间。
  - RUM： 根据真实用户交互，以国家/地区级别热力图显示响应时间。
    将鼠标悬停在某个位置上可显示工具提示，包含平均页面加载时间、可用性、页面浏览量（RUM 数据）及其他相关性能指标。
- 可用性 (%)：表示每个监控位置的页面加载成功率。颜色渐变（绿色表示高可用性，红色表示低可用性）突出显示页面加载失败或出错的区域。将鼠标悬停在某个位置上可显示包含可用性详情的工具提示。
- 当前状态：指示每个监控位置的实时状态，地图显示各位置是否正常运行。该视图有助于您快速评估所有区域浏览器检查的运行状态。
宕机/故障/严重历史
本部分提供监视器宕机/故障/严重历史的详细洞察，包括状态、确切宕机时间（开始时间到结束时间）、持续时间以及宕机状态的具体原因。

您可以单击添加中断按钮来添加中断，这些中断可导出为 CSV 或 PDF 格式，或通过电子邮件发送。

单击汉堡菜单图标并选择标记为维护，可将记录标记为正在维护。您也可以选择添加/编辑注释来添加或编辑记录的注释。如有需要，可单击删除来删除记录。
按位置划分的可用性和页面加载时间
每个监控位置的可用性和页面加载时间以表格格式呈现。这些数据可用于计算整体可用性百分比、页面加载时间（秒）以及每个位置的宕机时间。本部分包括以下详情：位置、可用性 (%)、宕机持续时间、宕机次数、上次宕机时间和页面加载时间（秒）。
按位置划分的页面加载时间
按位置划分的页面加载时间指标显示网页在各个位置根据访问时间加载所需的时间（秒），以图表方式可视化，便于按区域比较加载时间。
Apdex 得分
通过我们的 RUM 集成小部件，您可以立即使用 Apdex 行业标准来衡量用户使用应用程序或服务的满意度。您可以从用户的角度了解应用程序的性能（即"满意"、"容忍"或"沮丧"）。

Apdex 得分是最终用户满意度的衡量标准，分类如下：
- Apdex 得分 > 0.9 表示满意。
- Apdex 得分 > 0.5 且 < 0.9 表示容忍。
- Apdex 得分 < 0.5 表示沮丧。
您可以通过从下拉菜单中选择位置或为位置选择适当选项来按位置筛选 Apdex 得分。此外，还可以根据响应时间、页面浏览量和错误进一步筛选 Apdex 得分。此功能有助于获取更准确的得分，还允许您将得分导出为 CSV 文件。
全球行业平均值
全球行业平均值是用于基准性能比较的重要工具，此小部件可让您将网页性能直接与同行业对手进行比较。
借助此性能基准比较小部件，您可以快速查看并将您在各行业领域的平均响应时间和服务可用性与同行进行比较。

中断

您可以访问监视器详情页面中的中断选项卡，以收集各种中断和维护宕机时间的详细洞察，为故障排除提供充分信息。

您还可以访问各类中断的根本原因分析报表。访问已列出监视器中断或维护的汉堡菜单图标时，您将看到以下选项：

标记为维护：将中断标记为维护
标记为宕机：将维护标记为宕机
编辑注释：添加/编辑注释
查看 HTML：查看内容检查失败时获取的 HTML 格式错误响应
查看图像：查看中断的 RCA 截图
删除：永久删除中断/维护

清单

"清单"部分捕获基本监视器信息及其各种配置设置，包括轮询位置、轮询间隔、许可类型等。

日志报表

通过我们针对各个监视器的集成日志记录，您可以在自定义时间段内深入了解已配置监视器的各种日志详情。您还可以按位置和可用性筛选日志。此处捕获各种数据，包括可用性状态、HTTP 状态码、DNS 响应时间等。您还可以使用表格按钮筛选和导出日志报表的列，然后单击下载 CSV 按钮以 CSV 格式导出。

CDN 报表

CDN 报表提供内容分发网络 (CDN) 在传送 Web 内容方面的性能洞察，指标包括响应时间、位置、未命中、未命中率、失败请求和命中率。
了解更多关于 CDN 报表的信息。

Lighthouse 报表

Lighthouse 是一款开源工具，可用于分析网页的速度和性能。您可以对任何网页（无论是公开的还是需要身份验证的）运行 Lighthouse，它提供性能、可访问性、渐进式 Web 应用、SEO 等方面的审计报表。如果您在 Site24x7 中有网页速度（浏览器）监视器，则可以为添加监控的 URL 获取详细的 Lighthouse 报表。

提交 URL 进行审计后，Lighthouse 会对该页面运行一系列审计，并生成关于页面性能的报表。例如，可以使用测试浏览器中网页速度的 URL 来生成 Lighthouse 报表。每次审计都有一个参考或建议部分，详细说明审计的相关性以及解决问题应采取的措施。

Lighthouse 报表以百分比形式显示性能指标得分，以及每个指标的七天趋势图。该图表使用颜色编码系统（红色、橙色和绿色）指示每个审计类别的得分质量。

Lighthouse 针对五个主要网站优化类别提供审计报表：

性能
可访问性
最佳实践
SEO
渐进式 Web 应用 (PWA)

颜色	得分范围（0–100%）	说明
绿色	90–100	良好。您的网站性能优秀。
黄色	50–89	需要改进。您的网站性能一般，但有明显的优化机会。
红色	0–49	较差。您的网站存在重大性能问题，需要立即关注。

每天的指标数据均可视化呈现，以指示表现良好的区域和需要改进的区域。
综合所有指标后，将根据页面性能分配一个得分，得分范围为 0 到 100。

性能

在此审计中，Lighthouse 衡量页面加载速度和用户访问的便利性。审计报表包含与网页性能相关的五项速度指标数据，每项指标均衡量页面速度的某个方面。

首次内容绘制 (FCP)：FCP 是一项指标，用于测量页面上第一个文本或图像为用户加载的时间。
最大内容绘制 (LCP)：LCP 是页面加载最大元素所用时间的测量值。
总阻塞时间 (TBT)：TBT 测量页面无法响应用户输入的时间。
累积布局偏移 (CLS)：CLS 测量用户尝试访问页面时发生的布局偏移。
速度指数 (SI)：SI 显示页面内容的加载速度。

综合所有指标后，将根据页面性能分配一个得分，得分范围为 0 到 100。

每项性能指标都包含一个趋势图，可在七天内可视化网站速度。图表采用颜色编码（绿色、黄色和红色）。总体性能得分由多个单独指标（通常称为核心 Web 指标）的加权平均值计算得出。
每个核心 Web 指标都有唯一的范围，定义为良好、需要改进或较差。

以下是每个指标的范围及其类别：

指标	类别	范围	描述
首次内容绘制 (FCP)	良好	0–0.9s	页面快速显示内容
	需要改进	0.9–1.6s	页面加载可以更快
	较差	>1.6s	页面显示内容较慢
最大内容绘制 (LCP)	良好	0–1.2s	主要内容加载快速
	需要改进	1.2–2.4s	主要内容加载速度一般
	较差	>2.4s	主要内容加载较慢
总阻塞时间 (TBT)	良好	0–150s	主线程阻塞极少
	需要改进	150–350s	存在一定的主线程阻塞
	较差	>350s	交互延迟较高
累积布局偏移 (CLS)	良好	0–0.1s	布局稳定
	需要改进	0.1–0.25s	存在轻微布局偏移
	较差	≥0.25s	布局偏移明显
速度指数 (SI)	良好	0–1.3s	视觉加载快速
	需要改进	1.3–2.3s	视觉加载速度一般
	较差	>2.3s	视觉加载较慢

查看树形图：单击查看树形图 链接可查看网页的树形图。Lighthouse 中的查看树形图功能提供网站 JavaScript 包的可视化分解，帮助您识别可能影响网页性能的大型或未使用的模块。

树形图中的每个矩形代表一个模块或包，大小与其在包中的权重成比例，便于发现优化机会。

了解更多关于树形图的信息。

可访问性
Lighthouse 的可访问性测试验证使用辅助技术的用户访问网站的便利程度。页面上的各种元素（如按钮或链接）将被检查其用户友好程度。图像也将被检查以确保存在 alt 文本，这对使用屏幕阅读器的视力受限或无视力用户很有帮助。
与性能审计类似，可访问性报表也会给出 100 分满分的得分。
最佳实践
最佳实践审计将分析页面是否遵循现代 Web 开发标准，检查以下内容：
- 资源是否从 HTTPS 安全服务器加载。
- 图像是否具有正确的宽高比和适当的分辨率。
- JavaScript 库是否安全且无漏洞。
- 内容安全策略是否能有效防御跨站脚本攻击。
- 页面是否无浏览器错误。
- 页面是否包含已弃用的框架或 API。
- 页面是否有有效的源映射。
- 页面在 Chrome DevTools 面板中是否无问题。
- 页面是否提供更好的用户体验。
  
  这些因素的性能将决定您的满分 100 分得分。
SEO
此审计分析网页以识别可能影响 SEO 的技术方面，检查以下内容：
- 页面是否适合移动端。
- 页面是否具有有效的结构。
- 内部链接是否可被爬取。
- 页面是否具有有效的 hreflang 属性。
- 页面是否具有标题和 meta 描述标签。
- 页面是否可被索引。
- Robots.txt 文件是否有效。
- 页面上的链接是否具有上下文文本。
- 图像是否具有 alt 文本。
- 页面是否包含 viewport meta 标签。
  
  此审计下可分配的最高得分为 100 分。
PWA
此审计检查您的 Web 应用程序是否使用现代 Web 功能以确保更好的用户体验，检查以下内容：
- 在移动网络上是否快速可靠，并提供离线功能。
- 是否可安装在多种设备类型上。
- 是否通过将 HTTP 流量重定向到 HTTPS 进行 PWA 优化。
  测试运行后，将为您分配一个 PWA 徽章。

根本原因分析 (RCA) 报表

监视器报告中断后 150 秒，您可以获取宕机监视器的深入根本原因分析报表。RCA 报表提供监视器基本详情、中断详情、复检详情和中断原因。根本原因分析自动生成大量信息，以得出触发宕机时间的明确结论。RCA 旨在确定特定宕机时间或性能问题的根本原因。正常的 RCA 报表包含以下详情：

主要位置的检查和次要位置的复检。
Ping 分析
DNS 分析
TCP 路由追踪
MTR 报表
基于 MTR 的网络路由
比较截图、HTML 和资源
结论
比较截图、HTML 和资源
您可以使用此选项检查 RCA 报表中截图、HTML 和资源之间的差异。旧响应在左侧显示，新响应在右侧显示。

此功能对于识别 Web 应用程序中的任何变更非常有用。例如，如果您的公司使用某个应用程序，而更新导致用户无法访问，此功能可以帮助精确定位问题所在，从而让开发者迅速修复，而无需调试整个应用程序。

- 截图对比：此功能让您将监视器事务步骤正常运行时拍摄的截图与宕机时的截图进行对比，还提供每张截图的日期和时间。通过对比截图可以识别任何差异。
- HTML 对比：此选项让您将应用程序或网页最近正常运行时与宕机时的 HTML 代码进行对比，以分析任何变更。添加的行以绿色高亮显示，删除的行以红色高亮显示。您可以使用上一个差异和下一个差异功能在 HTML 中的差异之间移动，便于发现 HTML 内容中的差异。
资源对比：将宕机页面的资源与最近正常运行页面的资源进行对比。

此功能列出了与当前宕机页面不同的所有资源以及 URL 的上次正常运行时间。它以表格格式呈现错误代码和相应资源，包括 URL、协议、响应代码、响应时间 (ms) 和大小 (KB)。

单击查看链接可获取标头对比，提供所选资源的上次正常运行和当前宕机值的对比信息，帮助用户了解底层问题。

阅读此关于 RCA 的文章，了解更多关于各种网络诊断报表的信息。