以用户为中心的前端性能指标关注的是用户体验,即用户在使用页面或应用时的实际感受。这些指标着重于页面的加载速度、交互性和视觉响应。以下是一些常用的用户中心性能指标:
1. 首次绘制(First Paint, FP)
- 定义:从用户发起请求到浏览器首次绘制任何内容的时间。
- 重要性:反映了页面开始呈现内容的速度,影响用户的第一印象。
2. 首次内容绘制(First Contentful Paint, FCP)
- 定义:从用户发起请求到浏览器首次绘制任何内容(文本、图像等)的时间。
- 重要性:表示用户首次看到页面上有意义内容的时间,对用户感知页面加载速度至关重要。
3. 最大内容绘制(Largest Contentful Paint, LCP)
- 定义:从用户发起请求到页面中最大可视内容(如图像或文本)完全绘制的时间。
- 重要性:衡量用户能看到页面的主要内容的时间,对用户体验有重要影响。
4. 首次输入延迟(First Input Delay, FID)
- 定义:从用户首次与页面交互(如点击、触摸)到浏览器能够响应这个交互的时间。
- 重要性:衡量页面对用户输入的响应时间,直接影响用户交互的流畅性。
5. 页面交互时间(Time to Interactive, TTI)
- 定义:从页面加载开始到页面变得完全可交互的时间。
- 重要性:表示页面完全加载并且所有重要的脚本和事件监听器已准备好,用户可以与页面交互的时间。
6. 页面完全加载时间(Load Time)
- 定义:从用户发起请求到页面的所有资源(如图片、CSS、JavaScript)完全加载并可用的时间。
- 重要性:全面反映页面的加载性能,用户需要等待页面完全加载的时间。
7. 视觉稳定性(Cumulative Layout Shift, CLS)
- 定义:衡量页面内容在加载过程中视觉稳定性的指标,计算内容移动的总和。
- 重要性:反映了页面在加载过程中布局的稳定性,避免页面内容在加载时发生位移,影响用户体验。
8. 渲染时间(Render Time)
- 定义:从页面加载开始到页面内容渲染完成的时间。
- 重要性:影响用户看到页面的速度,通常与 FCP 和 LCP 相关联。
9. 延迟(Latency)
- 定义:网络延迟或服务器响应时间,指用户请求到服务器接收请求的时间间隔。
- 重要性:影响用户感知的速度,尤其是在使用需要大量数据交换的应用时。
10. 资源加载时间
- 定义:不同资源(如图片、脚本、样式表)的加载时间。
- 重要性:影响页面的整体加载时间和用户的体验,特别是大文件或慢速网络环境下。
11. 用户感知性能
- 定义:通过用户调查、反馈或分析工具收集的关于页面加载和交互的实际用户体验数据。
- 重要性:反映用户对页面性能的真实感受,帮助了解用户的满意度和体验问题。