Google uses AI technology to translate content into your preferred language. AI translations can contain errors.

Web Vitals

Philip Walton

Ngày xuất bản: 4/5/2020

Việc tối ưu hoá chất lượng trải nghiệm người dùng là yếu tố then chốt cho thành công dài hạn của bất kỳ trang web nào. Dù bạn là chủ doanh nghiệp, nhà tiếp thị hay nhà phát triển, Web Vitals có thể giúp bạn đánh giá trải nghiệm trên trang web của mình và xác định các cơ hội cải thiện.

Tổng quan

Web Vitals là một sáng kiến của Google nhằm cung cấp hướng dẫn thống nhất về những tín hiệu chất lượng cần thiết để mang lại trải nghiệm người dùng tuyệt vời trên web.

Google đã cung cấp một số công cụ trong những năm qua để đo lường và báo cáo hiệu suất. Một số nhà phát triển là chuyên gia sử dụng những công cụ này, trong khi những nhà phát triển khác nhận thấy việc có quá nhiều công cụ và chỉ số khiến họ khó theo kịp.

Chủ sở hữu trang web không cần phải là chuyên gia về hiệu suất để hiểu được chất lượng trải nghiệm mà họ mang lại cho người dùng. Sáng kiến Web Vitals nhằm đơn giản hoá bối cảnh và giúp các trang web tập trung vào những chỉ số quan trọng nhất, đó là Core Web Vitals.

Các chỉ số quan trọng về trang web

Core Web Vitals là một nhóm nhỏ trong số Web Vitals, áp dụng cho mọi trang web, mọi chủ sở hữu trang web đều phải đo lường và sẽ xuất hiện trên tất cả các công cụ của Google. Mỗi chỉ số trong Core Web Vitals đại diện cho một khía cạnh riêng biệt trong trải nghiệm người dùng, có thể đo lường được trong thực tế và phản ánh trải nghiệm thực tế của một kết quả quan trọng tập trung vào người dùng.

Các chỉ số tạo nên Core Web Vitals sẽ phát triển theo thời gian. Nhóm chỉ số hiện tại tập trung vào 3 khía cạnh của trải nghiệm người dùng – thời gian tải, tính tương tác và độ ổn định của hình ảnh – đồng thời bao gồm các chỉ số sau (và ngưỡng tương ứng):

Đề xuất về ngưỡng Nội dung lớn nhất hiển thị

Đề xuất về ngưỡng Lượt tương tác đến nội dung hiển thị tiếp theo

Đề xuất về ngưỡng Mức thay đổi bố cục tích luỹ

Nội dung lớn nhất hiển thị (LCP): đo lường hiệu suất tải. Để mang lại trải nghiệm tốt cho người dùng, LCP nên xảy ra trong vòng 2,5 giây kể từ khi trang bắt đầu tải lần đầu.
Lượt tương tác đến nội dung hiển thị tiếp theo (INP): đo lường khả năng tương tác. Để mang lại trải nghiệm tốt cho người dùng, các trang phải có INP từ 200 mili giây trở xuống.
Mức thay đổi bố cục tích luỹ (CLS): đo lường độ ổn định trực quan. Để mang lại trải nghiệm tốt cho người dùng, các trang phải duy trì chỉ số CLS là 0,1 trở xuống.

Để đảm bảo bạn đạt được mục tiêu được đề xuất cho các chỉ số này đối với hầu hết người dùng, ngưỡng phù hợp để đo lường là phân vị thứ 75 của số lượt tải trang, được phân đoạn trên thiết bị di động và máy tính.

Những công cụ đánh giá mức độ tuân thủ Core Web Vitals nên xem xét một trang đạt yêu cầu nếu trang đó đáp ứng các mục tiêu được đề xuất ở phân vị thứ 75 cho cả 3 chỉ số Core Web Vitals.

Vòng đời

Các chỉ số trong nhóm Core Web Vitals trải qua một vòng đời gồm 3 giai đoạn: thử nghiệm, đang chờ xử lý và ổn định.

Mỗi giai đoạn được thiết kế để cho nhà phát triển biết cách họ nên suy nghĩ về từng chỉ số:

Chỉ số thử nghiệm là các Core Web Vitals tiềm năng, có thể vẫn đang trải qua những thay đổi đáng kể tuỳ thuộc vào quá trình thử nghiệm và ý kiến phản hồi của cộng đồng.
Chỉ số đang chờ xử lý là những Core Web Vitals trong tương lai, đã vượt qua giai đoạn thử nghiệm và thu thập ý kiến phản hồi, đồng thời có tiến trình rõ ràng để trở thành chỉ số ổn định.
Các chỉ số ổn định là nhóm Core Web Vitals hiện tại mà Chrome coi là cần thiết để mang lại trải nghiệm người dùng tuyệt vời.

Các chỉ số Core Web Vitals nằm ở các giai đoạn sau trong vòng đời:

LCP: Ổn định
CLS: Ổn định
INP: Ổn định

Thử nghiệm

Khi một chỉ số được phát triển ban đầu và tham gia vào hệ sinh thái, chỉ số đó được coi là chỉ số thử nghiệm.

Mục đích của giai đoạn thử nghiệm là đánh giá mức độ phù hợp của một chỉ số, trước tiên là bằng cách khám phá vấn đề cần giải quyết và có thể lặp lại những gì mà các chỉ số trước đó có thể không giải quyết được. Ví dụ: Lượt tương tác đến nội dung hiển thị tiếp theo (INP) ban đầu được phát triển dưới dạng một chỉ số thử nghiệm để giải quyết các vấn đề về hiệu suất thời gian chạy trên web một cách toàn diện hơn so với Độ trễ đầu vào đầu tiên (FID).

Giai đoạn thử nghiệm của vòng đời Core Web Vitals cũng nhằm mục đích mang lại sự linh hoạt trong quá trình phát triển một chỉ số bằng cách xác định lỗi và thậm chí khám phá các thay đổi đối với định nghĩa ban đầu của chỉ số đó. Đây cũng là giai đoạn mà ý kiến phản hồi của cộng đồng đóng vai trò quan trọng nhất.

Đang chờ xử lý

Khi nhóm Chrome xác định rằng một chỉ số thử nghiệm đã nhận được đủ phản hồi và chứng minh được hiệu quả của mình, chỉ số đó sẽ trở thành chỉ số đang chờ xử lý. Ví dụ: INP đã được chuyển từ trạng thái thử nghiệm sang trạng thái đang chờ xử lý vào năm 2023 với mục đích cuối cùng là gỡ bỏ FID.

Các chỉ số đang chờ xử lý sẽ được giữ lại trong giai đoạn này ít nhất 6 tháng để hệ sinh thái có thời gian thích ứng. Ý kiến phản hồi của cộng đồng vẫn là một khía cạnh quan trọng trong giai đoạn này, vì ngày càng có nhiều nhà phát triển bắt đầu sử dụng chỉ số này.

Ổn định

Khi một chỉ số đề xuất Chỉ số quan trọng chính của trang web được hoàn thiện, chỉ số đó sẽ trở thành một chỉ số ổn định. Đây là thời điểm chỉ số này có thể trở thành một Chỉ số quan trọng chính của trang web.

Các chỉ số ổn định được hỗ trợ tích cực và có thể được sửa lỗi cũng như thay đổi định nghĩa. Các chỉ số ổn định trong Core Web Vitals sẽ không thay đổi quá một lần mỗi năm. Mọi thay đổi đối với một Core Web Vital sẽ được thông báo rõ ràng trong tài liệu chính thức của chỉ số, cũng như trong nhật ký thay đổi của chỉ số. Core Web Vitals cũng được đưa vào mọi quy trình đánh giá.

Công cụ đo lường và báo cáo Core Web Vitals

Google tin rằng Core Web Vitals là yếu tố quan trọng đối với mọi trải nghiệm trên web. Do đó, Google cam kết hiển thị những chỉ số này trong tất cả các công cụ phổ biến của mình. Các phần sau đây trình bày chi tiết những công cụ hỗ trợ Core Web Vitals.

Các công cụ thực tế để đo lường Core Web Vitals

Báo cáo trải nghiệm người dùng trên Chrome thu thập dữ liệu đo lường ẩn danh của người dùng thực cho từng Core Web Vitals. Dữ liệu này giúp chủ sở hữu trang web nhanh chóng đánh giá hiệu suất mà không cần phải đo lường chỉ số phân tích theo cách thủ công trên các trang của họ, đồng thời hỗ trợ các công cụ như Chrome DevTools, PageSpeed Insights và báo cáo Core Web Vitals của Search Console.

	LCP (Thời gian hiển thị nội dung lớn nhất)	INP	CLS (Điểm số tổng hợp về mức thay đổi bố cục)
Báo cáo trải nghiệm người dùng trên Chrome
Chrome DevTools
PageSpeed Insights
Search Console (báo cáo Core Web Vitals)

Dữ liệu do Báo cáo trải nghiệm người dùng trên Chrome cung cấp là một cách nhanh chóng để đánh giá hiệu suất của các trang web, nhưng dữ liệu này không cung cấp thông tin đo từ xa chi tiết cho mỗi lượt xem trang. Thông tin này thường cần thiết để chẩn đoán, giám sát và nhanh chóng phản ứng chính xác với các trường hợp hồi quy. Do đó, các trang web nên thiết lập tính năng giám sát người dùng thực.

Đo lường Core Web Vitals bằng JavaScript

Bạn có thể đo lường từng Core Web Vitals bằng JavaScript thông qua các API web tiêu chuẩn.

Cách dễ nhất để đo lường tất cả Core Web Vitals là sử dụng thư viện JavaScript web-vitals. Đây là một trình bao bọc nhỏ, sẵn sàng cho hoạt động sản xuất xung quanh các API web cơ bản. Thư viện này đo lường từng chỉ số theo cách hoàn toàn khớp với cách các chỉ số được báo cáo bởi tất cả các công cụ của Google được liệt kê trước đó.

Với thư viện web-vitals, bạn có thể đo lường từng chỉ số bằng cách gọi một hàm duy nhất. Hãy xem tài liệu để biết thông tin chi tiết đầy đủ về cách sử dụng và API.

import {onCLS, onINP, onLCP} from 'web-vitals';

function sendToAnalytics(metric) {
  const body = JSON.stringify(metric);
  // Use `navigator.sendBeacon()` if available, falling back to `fetch()`.
  (navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
    fetch('/analytics', {body, method: 'POST', keepalive: true});
}

onCLS(sendToAnalytics);
onINP(sendToAnalytics);
onLCP(sendToAnalytics);

Sau khi bạn định cấu hình trang web để sử dụng thư viện web-vitals nhằm đo lường và gửi dữ liệu Core Web Vitals đến một điểm cuối phân tích, bước tiếp theo là tổng hợp và báo cáo dữ liệu đó để xem liệu các trang của bạn có đáp ứng ngưỡng được đề xuất cho ít nhất 75% số lượt truy cập trang hay không.

Mặc dù một số nhà cung cấp dịch vụ phân tích có hỗ trợ sẵn cho các chỉ số Core Web Vitals, nhưng ngay cả những nhà cung cấp không hỗ trợ cũng nên có các tính năng cơ bản về chỉ số tùy chỉnh để bạn có thể đo lường Core Web Vitals trong công cụ của họ.

Thay vào đó, những nhà phát triển muốn đo lường trực tiếp các chỉ số này bằng cách sử dụng các API web cơ bản có thể sử dụng các hướng dẫn về chỉ số này để biết thông tin chi tiết về cách triển khai:

Để biết thêm hướng dẫn về cách đo lường các chỉ số này bằng các dịch vụ số liệu phân tích phổ biến hoặc công cụ số liệu phân tích nội bộ của riêng bạn, hãy xem bài viết Các phương pháp hay nhất để đo lường Web Vitals trong thực tế.

Công cụ phòng thí nghiệm để đo lường Core Web Vitals

Mặc dù tất cả Core Web Vitals đều là chỉ số thực tế, nhưng nhiều chỉ số trong số đó cũng có thể đo lường được trong phòng thí nghiệm.

Đo lường trong phòng thí nghiệm là cách tốt nhất để kiểm thử hiệu suất của các tính năng trong quá trình phát triển – trước khi các tính năng đó được phát hành cho người dùng. Đây cũng là cách tốt nhất để phát hiện các trường hợp hồi quy hiệu suất trước khi chúng xảy ra.

Bạn có thể dùng các công cụ sau để đo lường Core Web Vitals trong môi trường phòng thí nghiệm:

	LCP (Thời gian hiển thị nội dung lớn nhất)	INP	CLS (Điểm số tổng hợp về mức thay đổi bố cục)
Chrome DevTools
Lighthouse		(thay vào đó, hãy dùng TBT)

Mặc dù đo lường trong phòng thí nghiệm là một phần thiết yếu để mang lại trải nghiệm tuyệt vời, nhưng không thể thay thế cho việc đo lường thực tế.

Hiệu suất của một trang web có thể thay đổi đáng kể dựa trên khả năng của thiết bị người dùng, điều kiện mạng, những quy trình khác có thể đang chạy trên thiết bị và cách họ tương tác với trang. Trên thực tế, điểm số của từng chỉ số Core Web Vitals đều có thể bị ảnh hưởng bởi lượt tương tác của người dùng. Chỉ có phép đo thực tế mới có thể ghi lại chính xác thông tin tổng quan đầy đủ.

Đề xuất để cải thiện điểm số

Các hướng dẫn sau đây đưa ra những đề xuất cụ thể về cách tối ưu hoá trang cho từng Core Web Vitals:

Có nhiều cách để cải thiện Core Web Vitals và mỗi phương pháp đều có mức độ tác động, mức độ phù hợp và mức độ dễ sử dụng khác nhau cho từng tình huống. Hãy tham khảo bài viết Những cách hiệu quả nhất để cải thiện các chỉ số Core Web Vitals để xem danh sách ngắn gồm những đề xuất hàng đầu của nhóm Chrome.

Các chỉ số quan trọng khác về trang web

Mặc dù Core Web Vitals là những chỉ số quan trọng để tìm hiểu và mang đến trải nghiệm người dùng tuyệt vời, nhưng vẫn có những chỉ số hỗ trợ khác.

Các chỉ số khác này có thể đóng vai trò là chỉ số thay thế hoặc chỉ số bổ sung cho 3 Core Web Vitals, giúp nắm bắt phần lớn trải nghiệm hoặc hỗ trợ chẩn đoán một vấn đề cụ thể.

Ví dụ: chỉ số Thời gian cho byte đầu tiên (TTFB) và Nội dung đầu tiên hiển thị (FCP) đều là những khía cạnh quan trọng của trải nghiệm tải và đều hữu ích trong việc chẩn đoán các vấn đề với LCP (thời gian phản hồi của máy chủ chậm hoặc tài nguyên chặn hiển thị, tương ứng).

Tương tự, một chỉ số như Tổng thời gian chặn (TBT) là một chỉ số trong phòng thí nghiệm đóng vai trò quan trọng trong việc phát hiện và chẩn đoán các vấn đề tiềm ẩn về tính tương tác có thể ảnh hưởng đến INP. Tuy nhiên, chỉ số này không thuộc nhóm Core Web Vitals vì không thể đo lường trên thực tế và cũng không phản ánh kết quả lấy người dùng làm trung tâm.

Các thay đổi đối với Web Vitals

Web Vitals và Core Web Vitals là những tín hiệu tốt nhất mà nhà phát triển hiện có để đo lường chất lượng trải nghiệm trên web. Tuy nhiên, những tín hiệu này chưa hoàn hảo và bạn nên kỳ vọng vào những điểm cải thiện hoặc bổ sung trong tương lai.

Core Web Vitals có liên quan đến tất cả các trang web và xuất hiện nổi bật trong các công cụ có liên quan của Google. Những thay đổi đối với các chỉ số này sẽ có tác động trên diện rộng; do đó, nhà phát triển nên dự kiến các định nghĩa và ngưỡng của Core Web Vitals sẽ ổn định, đồng thời các bản cập nhật sẽ được thông báo trước và có nhịp độ dự đoán được hằng năm.

Các Web Vitals khác thường phụ thuộc vào bối cảnh hoặc công cụ cụ thể và có thể mang tính thử nghiệm hơn so với Các Core Web Vitals. Do đó, định nghĩa và ngưỡng của các chỉ số này có thể thay đổi thường xuyên hơn.

Đối với tất cả các Web Vitals, các thay đổi sẽ được ghi lại rõ ràng trong CHANGELOG công khai này.