视频字幕
前端Web页面性能测试是现代网站开发中不可或缺的一环。它通过测量和分析网页的加载速度、响应时间以及用户交互体验，帮助开发者识别性能瓶颈并进行优化。主要的测试指标包括请求数量、资源加载情况、页面加载时间，以及用户体验相关的核心指标。
请求数是指浏览器向服务器发起的HTTP请求总数，包括获取HTML文档、CSS样式表、JavaScript脚本、图片和API数据等。资源数则是指页面实际加载的各类文件数量。通常情况下，请求数和资源数是相等的，但在某些情况下可能会有差异，比如缓存命中或请求失败。减少请求数和优化资源加载是提升页面性能的重要手段。
页面加载时间可以分解为多个阶段。首先是DNS解析，将域名转换为IP地址；然后是连接建立，包括TCP握手和SSL握手；接着是请求发送和响应接收，传输HTML文档和各种资源；最后是页面渲染，浏览器解析和显示内容。每个阶段的优化都能显著提升整体加载性能。通过瀑布图可以清晰地看到各阶段的耗时分布。
FCP首次内容绘制指标测量从页面开始加载到页面内容的任何部分在屏幕上完成渲染的时间。这通常是用户看到页面不再是空白的时刻。LCP最大内容绘制指标测量从页面开始加载到最大文本块或图像元素在屏幕上完成渲染的时间。LCP通常对应页面的主要内容，是用户感知页面加载完成的重要指标。优秀的FCP应在1.8秒内，LCP应在2.5秒内。
累积布局偏移CLS是测量页面视觉稳定性的重要指标。当页面元素在加载过程中意外移动时，会产生布局偏移。常见的原因包括图片或广告的延迟加载、字体的异步加载等。CLS分数越低越好，分数小于0.1被认为是良好的用户体验。为了减少CLS，开发者应该为图片和广告预留空间，使用字体显示交换策略，避免在现有内容上方插入内容。