Hiểu mỗi chỉ số đang báo gì
Largest Contentful Paint (LCP) đo thời điểm xuất hiện của ảnh lớn nhất hoặc khối văn bản lớn nhất trong viewport ban đầu. Interaction to Next Paint (INP) đo độ phản hồi của lượt truy cập thông qua tương tác đạt điều kiện chậm nhất của lượt đó. Cumulative Layout Shift (CLS) đo chuyển động hiển thị bất ngờ trong suốt lượt truy cập.
Các ngưỡng trải nghiệm do Google công bố là LCP ở hoặc dưới 2.5 giây, INP ở hoặc dưới 200 mili giây, và CLS ở hoặc dưới 0.1. Đánh giá chúng tại phân vị thứ 75 (75th percentile) của các lần tải trang, tách biệt cho thiết bị di động và máy tính để bàn. Dùng các mục tiêu này để tập trung công việc, không phải làm căn cứ cho xếp hạng hay lý do bỏ qua những người dùng chậm hơn.
Nội dung chính xuất hiện muộn; điều tra đường đi từ server, phát hiện tài nguyên, tải xuống và quá trình render.
Một cú nhấp, chạm hoặc nhấn phím bị chờ quá lâu để có phản hồi hình ảnh; nguồn có thể là khung nhúng (embedded frame).
Nội dung dịch chuyển bất ngờ; chú ý thêm đến những chuyển dịch gần điều khiển, biểu mẫu và vị trí đọc.
Để dữ liệu trường đặt ưu tiên và kiểm thử lab giải thích nguyên nhân
Dữ liệu trường đến từ các lượt truy cập thực tế, bao gồm thiết bị thực, mạng, vị trí, trạng thái cache và hành vi. Dữ liệu từ Chrome User Experience Report xuất hiện trong PageSpeed Insights và Search Console khi có đủ dữ liệu. Giám sát người dùng thực (real-user monitoring) của bạn có thể thêm ngữ cảnh lượt trang; chỉ thu thập telemety cần thiết và tránh ghi nhận nội dung do khách hàng nhập.
Dữ liệu phòng thí nghiệm (lab data) là kiểm thử có thể lặp lại dưới điều kiện được chọn. Nó hữu ích để cô lập một thay đổi phát hành và đọc trace, nhưng không thể đại diện cho mọi người truy cập. Lighthouse không thể đo INP thực sự nếu không có tương tác thực, vì vậy Total Blocking Time là chỉ báo chẩn đoán. Khi kết quả khác nhau, dùng dữ liệu trường để ưu tiên và dữ liệu lab để điều tra.
Ghi lại xem dữ liệu ở cấp URL hay origin và liệu đó là mobile hay desktop.
Lưu ngày, nhóm trang, thiết bị, phân phối, cài đặt kiểm thử và các phát hành gần nhất cùng với đường cơ sở.
Phân loại ưu tiên theo phạm vi ảnh hưởng, tổn hại nhiệm vụ, bằng chứng và khả năng đảo ngược
Đừng bắt đầu từ con số thấp nhất trên dashboard. Xếp hạng các ứng viên theo lượt truy cập bị ảnh hưởng, tầm quan trọng của nhiệm vụ người dùng, lặp lại trên một mẫu (template), và liệu một thay đổi có thể được cô lập và hoàn nguyên. Cách này biến tối ưu Core Web Vitals thành khắc phục vận hành hơn là đuổi chỉ số.
Một thuộc tính ảnh thiếu kích thước trên template dùng chung có thể là thay đổi đầu tiên tốt hơn một cuộc viết lại front-end mang tính suy đoán. Một tương tác thanh toán ít phổ biến hơn có thể được ưu tiên khi nó chặn hoàn tất. Ghép bằng chứng chỉ số với phản hồi hỗ trợ, quan sát funnel và rà soát truy cập.
Các vấn đề lặp lại được quan sát trong trường trên các template quan trọng với biện pháp khắc phục rõ ràng, rủi ro thấp.
Ý tưởng kiến trúc mà không có vấn đề người dùng được đo lường hoặc đường hoàn nguyên; giữ chúng lại như các giả thuyết.
Sửa LCP bằng cách rút ngắn đường đi tới nội dung chính
Xác định phần tử LCP cho trang và nhóm thiết bị bị ảnh hưởng. Kiểm tra phản hồi HTML ban đầu, thời điểm trình duyệt phát hiện phần tử, thời gian tải tài nguyên của phần tử đó, và những gì chặn việc render. Thời gian phản hồi server (TTFB) cao có thể khiến mục tiêu LCP trở nên phi thực tế ngay cả khi tài sản hero đã được tối ưu tốt.
Giữ nội dung chính được phát hiện sớm khi phù hợp với thiết kế. Không lazy-load hình ảnh chính là phần tử LCP. Với các trang dẫn bằng ảnh, sử dụng tài sản có kích thước và mã hóa phù hợp cùng kích thước rõ ràng. Thử preload và quy tắc phân phối: một yêu cầu sớm chỉ hữu ích nếu nó không cạnh tranh với công việc quan trọng hơn.
Kiểm tra redirect, công việc server, hành vi cache và khoảng cách phân phối; điều này có thể cần đến quyền sở hữu ứng dụng hoặc hosting.
Kiểm tra xem việc render phía client, script hoặc CSS có trì hoãn việc phát hiện văn bản hoặc ảnh chính không.
Làm cho tương tác phản hồi nhanh và bố cục dự đoán được
Đối với INP, tái tạo luồng chậm trong trace của trình duyệt. Tách độ trễ nhập liệu, xử lý sự kiện và độ trễ trình bày. Nhiệm vụ main-thread dài, bộ xử lý nặng, render tốn kém và layout thrashing có thể mỗi cái trì hoãn paint tiếp theo. Làm công việc hiển thị cho frame tiếp theo trước; hoãn lưu không cần thiết, analytics hoặc cập nhật thứ yếu khi yêu cầu sản phẩm cho phép.
Đối với CLS, tìm các phần tử dịch chuyển thay vì đoán theo tổng số. Dành chỗ cho ảnh, video, quảng cáo, nhúng và iframe với kích thước hoặc tỷ lệ khung (CSS aspect-ratio). Kiểm tra tải font và nội dung chèn vào. Không giấu tin nhắn đồng ý, lỗi hoặc truy cập cần thiết chỉ để cải thiện điểm; hãy cho chúng một vị trí ổn định.
Hoãn công việc có thể thay đổi thời điểm ứng dụng. Kiểm thử hồi quy trạng thái, xác thực và hành vi bàn phím.
Cuộn qua khu vực lazy-loaded và nhúng; kiểm thử chỉ tải có thể bỏ sót các chuyển dịch sau này.
Phát hành cải tiến an toàn và xác nhận chúng
Các thay đổi hiệu năng có thể ảnh hưởng đến script, cache, render, nhúng hoặc cấu hình phân phối. Thực hiện thay đổi theo giai đoạn, so sánh một đường dẫn kiểm thử xác định với đường cơ sở, và ghi lại cách rollback. Với luồng thanh toán, tài khoản hoặc ở vùng có quy định, tham vấn người rà soát an ninh, tuân thủ và truy cập trước khi thay đổi nhúng, xác thực hoặc xử lý dữ liệu. Đây là hướng dẫn mang tính giáo dục, không phải đánh giá tuân thủ.
Sau khi phát hành, so sánh cùng đường dẫn lab và theo dõi các phân khúc trường tương tự trong cửa sổ báo cáo thông thường. Kiểm tra các tác dụng không mong muốn như lỗi bị ẩn hoặc giao diện không đọc được. Status Is UP hỗ trợ tối ưu hóa tính khả dụng chủ động thông qua kiểm tra định kỳ, quyền sở hữu khắc phục rõ ràng và sẵn sàng rollback giữa các sự cố.
Liên kết mỗi thay đổi với một nhóm trang, chỉ số, chủ sở hữu, bằng chứng kiểm thử, đánh đổi và hướng dẫn rollback.
Không tuyên bố thành công chỉ từ một lần chạy tổng hợp; xác nhận mẫu người dùng thực liên quan.