【高性能网站搭建-learn-web-vitals翻译】——开篇

原文章链接：https://web.dev/learn-web-vitals/

【重点词汇】

1.Vitals ['vaɪt(ə)lz]：生命体征;要害  web Vitals  web开发/设计的要点

2.Essential metrics：重要的衡量指标

3.unified 统一的

【翻译】

web开发要点-健壮网站的重要衡量指标

概述：web vitals提供了一些统一的网站质量衡量指标，这些指标对于提供良好的用户体验至关重要。

目录如下

一、概述

• Web Vitals 网站要点

二、关键衡量指标

• Largest Contentful Paint (LCP)  最大内容绘制，视口内可见的最大内容元素的渲染时间。用于衡量加载体验。为了提供良好的用户体验， LCP 应该在页面首次开始加载后的 2.5 秒内发生 。对应的有Fisrt paint 第一帧 / First contentful paint 第一帧有意义的画面 。
• First Input Delay (FID) 第一输入延迟，即用户首次与网站交互的时间。用户衡量可交互性，为了提供良好的用户体验，页面的 FID 应当小于 100毫秒。
• Cumulative Layout Shift (CLS)  累计布局偏移，指网页布局在加载期间的偏移量。得分范围是 0–1，其中 0 表示没有偏移，1 表示最大偏移。衡量视觉稳定性，为了提供良好的用户体验，页面的CLS应保持小于 0.1。
• Defining the Core Web Vitals metrics thresholds 定义核心web衡量指标的阈值

三、测量衡量指标

• Getting started with measuring Web Vitals  从测量web vitals开始
• Tools to measure Core Web Vitals  测量web vitals的工具
• Best practices for measuring Web Vitals in the field 在测量web vitals方面的最佳实践

四、提高衡量指标

• Optimize Largest Contentful Paint 优化LCP
• Optimize First Input Delay 优化FID
• Optimize Cumulative Layout Shift 优化CLS

 

下一篇正式开始。