Core web vitals là gì? Tại sao bạn cần tối ưu hóa tăng tốc website

Core web vitals là gì Tại sao bạn cần tối ưu hóa tăng tốc website

Core web vitals là thuật toán mới được Google áp dụng lên các website trên nền tảng của họ với mục đích là làm cho trang web đó càng nhanh càng tốt, càng đáp ứng các trải nghiệm người dùng càng tốt. Tuy nhiên khái niệm này với nhiều bạn vẫn khá mơ hồ do các bài viết bằng Tiếng Việt không được dịch tốt. Bài viết này sangsieusale.com sẽ hướng dẫn và giải thích tỉ mỉ cho các bạn biết thuật toán Core web vitals là gì! Tại sao nó lại ảnh hưởng cực lớn đến SEO website của bạn.

Core web vitals là gì?

Core web vitals (CWV) là tổng hợp 3 yêu cầu cơ bản với một trang web bao gồm  largest contentful paint (LCP), first input delay (FID), và cumulative layout shift (CLS).

Các điều kiện này cần được đáp ứng đầy đủ để bạn được xếp hạng cao hơn trong kết quả tìm kiếm của Google search. Đây là các yếu tố đảm bảo chất lượng website nhằm tăng khả năng trải nghiệm người dùng với nguyên tắc : Nhanh hơn thì tốt hơn!

Largest contentful paint (LCP)

Thực tế đây không được xem là một lỗi mà chỉ là một yêu cầu, LCP là nội dung lớn nhất đầu tiên được tải phải thật nhanh chóng, thường là ảnh hoặc khối văn bản lớn đầu tiên của trang. Điều này có nghĩa là dù trang chưa được tải đầy đủ nhưng nội dung đầu tiên khán giả đã có thể đọc hoặc xem được để họ không mất thời gian và tăng trải nghiệm từ đó khiến trang hữu ích hơn.

Để cung cấp trải nghiệm người dùng tốt, các trang web nên cố gắng có Nội dung có nội dung lớn nhất xuất hiện trong vòng 2,5 giây đầu tiên kể từ khi trang bắt đầu tải. Nếu vượt quá 4 giây tức là website đang không đạt là bị đánh giá là chậm 

First input delay (FID)

FID là thước đo sự chậm trễ khi bạn nhấp hoặc chạm vào một cái gì đó như liên kết hoặc nút và thời gian trình duyệt phản hồi hành động của bạn và bắt đầu xử lý nó. Các loại tương tác người dùng liên tục, như phóng to hoặc cuộn trang, không thể được đo lường chính xác bằng cách sử dụng số liệu này. Điều này là do chúng thường không chạy trên chủ đề chính của trình duyệt và có những ràng buộc khác nhau.

  • FID từ 100ms trở xuống được coi là tốt,
  • FID từ 100-300ms cần cải thiện,
  • FID trên 300ms được coi là kém.

Cumulative layout shift (CLS)

Cumulative Layout Shift (CLS) là một chỉ số hiệu suất được giới thiệu vào năm 2020 bởi Lighthouse để đo lường sự ổn định hình ảnh nhận thức của tải trang. Nói một cách đơn giản, CLS đo lường sự thay đổi bất ngờ của các yếu tố web trong khi trang đang được hiển thị.

CLS là một thước đo quan trọng, lấy người dùng làm trung tâm để đo lường sự ổn định của hình ảnh vì nó giúp định lượng tần suất người dùng trải nghiệm sự thay đổi bố cục bất ngờ – CLS thấp giúp đảm bảo rằng trang thú vị. 

Theo Google

CLS chiếm 15% tổng điểm hiệu suất, biểu thị tầm quan trọng tương đối cao của nó.

Xem thêm  Ảnh WebP là gì? Dùng ảnh WebP tốt hơn cho SEO không?

Trong khi một số chỉ số Điểm hiệu suất khác có liên quan trực tiếp đến tốc độ tải trang, CLS tập trung vào việc đo lường trải nghiệm trang của khách truy cập.

Đặc biệt, CLS là một đóng góp lớn cho “niềm vui của người dùng” – tức là, cung cấp trải nghiệm mượt mà, không bị lag cho khách truy cập của bạn.

Điều này được củng cố thêm bằng cách đưa nó vào bộ Core Web Vitals.

Ngưỡng cho điểm CLS là, như sau:

  • Tốt – không có gì để làm ở đây = CLS từ 0,1 trở xuống.
  • OK, nhưng hãy xem xét cải thiện = CLS từ 0,1 đến 0,15.
  • Dài hơn khuyến nghị = CLS từ 0,15 đến 0,25.
  • Lâu hơn nhiều so với khuyến nghị = CLS từ 0,25 trở lên .

Cách khắc phục thời gian phản hồi của máy chủ chậm trên website

Cách đo lường chỉ số core web vitals bằng các công cụ hỗ trợ

Các chỉ số của CWV cần được tối ưu dựa trên rất nhiều yếu tố, các bạn cần có công cụ để có thể đo lường các chỉ số cho trang web của mình như 

Lighthouse

Lighthouse là một công cụ kiểm tra web tự động, giúp lập trình viên chẩn đoán lỗi và nắm bắt cơ hội cải thiện trải nghiệm người dùng cho trang của họ. Nó đo một số khía cạnh về chất lượng trải nghiệm người dùng trong môi trường thử nghiệm, bao gồm hiệu suất và khả năng truy cập. Phiên bản mới nhất của Lighthouse bao gồm các bài kiểm tra bổ sung, chỉ số mới, chấm điểm hiệu suất tổng quan mới.

Lighthouse

PageSpeed Insights

PageSpeed Insights (PSI) báo cáo kết quả thử nghiệm và trường của trang trên cả hai thiết bị mobile và desktop. Công cụ này cung cấp tổng quan về cách người dùng trên khắp thế giới trải nghiệm trang của bạn như thế nào (được cung cấp bởi Chrome UX Report) và tập hợp các đề xuất khả thi về cách chủ sở hữu trang có thể cải thiện trải nghiệm người dùng (được cung cấp bởi Lighthouse).

 

PageSpeed Insights và PageSpeed Insights API cũng được nâng cấp để sử dụng Lighthouse 6.0 và giờ hỗ trợ đo các chỉ số xếp hạng web trong cả phần lab và field của báo cáo. Core Web Vitals được đánh dấu bằng ribbon màu xanh lam như hình bên dưới.

PageSpeed Insights
 

Trong Search Console cung cấp cho chủ sở hữu trang web một cái nhìn tổng quan tuyệt vời về nhóm các trang cần lưu tâm, PSI giúp xác định cơ hội trên mỗi trang để cải thiện trải nghiệm. Trong PSI, bạn có thể thấy rõ trang đó có đáp ứng ngưỡng trải nghiệm tốt hay không trên toàn bộ Core Web Vitals ở trên cùng của báo cáo.

Xem thêm  Cách sử dụng plugin LiteSpeed Cache để tăng tốc trang web của bạn 2022

CrUX

Chrome UX Report (CrUX) là một bộ dữ liệu công khai về dữ liệu trải nghiệm người dùng trên hàng triệu trang web. Nó đo các phiên bản trường của tất cả Core Web Vitals. Khác dữ liệu thử nghiệm, dữ liệu CrUX đến từ người dùng được chọn trong trường đó. Dùng dữ liệu này, lập trình viên có thể hiểu phân bổ trải nghiệm người dùng trong thế giới thực trên web của họ hoặc đối thủ cạnh tranh. Ngay cả khi bạn không có RUM trên trang, CrUX có thể cung cấp giải pháp nhanh chóng và dễ dàng để đánh giá các chỉ số xếp hạng Core Web Vitals. Bộ dữ liệu CrUX trên BigQuery bao gồm dữ liệu hiệu suất chi tiết cho tất cả Core Web Vitals và có sẵn trong bản ghi nhanh hàng tháng ở cấp độ gốc.

Cách duy nhất để thực sự biết cách trang của bạn như thế nào đối với người dùng là đo hiệu suất của nó trong trường khi những người dùng đó đang tải và tương tác với nó. Kiểu thước đo này thường được gọi là Real User Monitoring (RUM) – Giám sát người dùng thực. Thậm chí, nếu không có RUM trên trang, CrUX vẫn có thể cung cấp cho bạn giải pháp đơn giản & thần tốc để đánh giá Core Web Vitals.

Giới thiệu CrUX API

CrUX API cho bạn một cách nhanh chóng và dễ dàng tích hợp quy trình phát triển với thước đo chất lượng cấp URL gốc cho các chỉ số Field sau:

  • Largest Contentful Paint
  • Cumulative Layout Shift
  • First Input Delay
  • First Contentful Paint
 

Lập trình viên có thể truy vấn nguồn gốc hoặc URL và kết quả phân đoạn bằng các nhân tố hình thức khác nhau. API cập nhật hàng ngày và tổng kết dữ liệu có giá trị trong vòng 28 ngày trước đó. API cũng có cùng hạn ngạch API công khai linh hoạt được đặt trên PageSpeed Insights API (25.000 truy vấn mỗi ngày).

Bên dưới là ví dụ sử dụng CrUX API để minh họa các chỉ số Core Web Vitals với các bản phân phối tốt, cần cải thiện và kém:

Chỉ số đánh giá trải nghiệm người dùng trên Chrome cho một web

Bảng Chrome DevTools Performance

Các sự kiện Debug Layout Shift trong phần Experience

Bảng Chrome DevTools Performance có một phần Experience mới, có thể giúp bạn phát hiện những thay đổi bố cục không mong muốn. Tính năng này hữu ích trong việc tìm và sửa các lỗi hình ảnh không ổn định trên trang, góp phần vào Cumulative Layout Shift (Thay đổi bố cục tích lũy).

Chọn Layout Shift để xem thông tin chi tiết trong tab Summary. Để hình dung vị trí thay đổi diễn ra, trỏ chuột qua trường Moved from và Moved to.

Sẵn sàng tương tác gỡ lỗi với tổng thời chặn ở chân trang

Chỉ số Total Blocking Time (TBT) có thể được đo bằng các công cụ Lab và là một proxy tuyệt vời cho độ trễ đầu vào đầu tiên. TBT đo tổng lượng thời gian giữa First Contentful Paint (FCP) và Time to Interactive (TTI) tại nơi luồng chính bị chặn đủ lâu để chặn phản hồi đầu vào. Các tối ưu hóa hiệu suất cải thiện TBT trong lab có thể cải thiện FID trong trường đó.

Xem thêm  Website chậm và mất traffic? Nguyên nhân và cách khắc phục ngay đây

TBT giờ hiện trong footer của bảng Chrome DevTools Performance khi đo hiệu suất trang:

  • Nhấn Control+Shift+J (Windows) hoặc Command+Option+J (Mac) để mở DevTools.
  • Click tab Performance.
  • Click Record.
  • Tải lại trang theo cách thủ công.
  • Đợi trang tải hết, rồi dừng ghi dữ liệu.

Search Console

Google SearchConsole
 

Báo cáo Core Web Vitals trong Search Console giúp bạn nhận diện nhóm các trang trên web cần quan tâm dựa trên dữ liệu (trường) thế giới thực từ CrUX. Hiệu suất URL được nhóm theo trạng thái, loại chỉ số và nhóm URL (nhóm các trang web giống nhau).

Báo cáo này dựa trên 3 chỉ số Core Web Vitals: LCP, FID, và CLS. Nếu một URL không có số lượng dữ liệu báo cáo tối thiểu cho những chỉ số này thì URL đó sẽ bị bỏ khỏi báo cáo. Hãy thử báo cáo mới để có cái nhìn tổng thể về hiệu suất web gốc của bạn.

Khi đã xác nhận một kiểu trang có những vấn đề liên quan tới Core Web Vitals, bạn có thể dùng PageSpeed Insights để tìm hiểu các đề xuất tối ưu hóa cụ thể cho trang đại diện.

Extension Web Vitals

Web Vitals

Extension Web Vitals đo 3 chỉ số Core Web Vitals tại thời gian thực cho Google Chrome trên desktop. Nó giúp lập trình viên sớm phát hiện lỗi trong quá trình phát triển. Ngoài ra, nó cũng giống như một công cụ chẩn đoán để đánh giá hiệu suất Core Web Vitals khi bạn lướt web.

Cách tăng tốc website wordpress của bạn

Các nền tảng website khác có nhiều cách hơn để tối ưu hóa tốc độ một trang web, tuy nhiên với nền tảng website wordpress thì điều này chỉ cần biết cách sử dụng những plugin khác nhau là được. Với sangsieusale.com tôi dùng plugin Lite speed cache và tăng tốc trang web đáp ứng thuật toán core web vitals của Google một cách hoàn hảo.

Trong nhiều plugin sangsieusale từng sử dụng thì có vẻ như lite speed cache chắc chắn là plugin hỗ trợ tăng tốc trang web được sử dụng nhiều nhất. Nếu bạn muốn xem cách sangsieusale xử dụng plugin này thì bạn có thể xem qua Cách sử dụng plugin LiteSpeed Cache để tăng tốc trang web của bạn 2022

Ngoài ra chính vì sử dụng plugin này nhiều năm, mình có một gói hỗ trợ tối ưu hóa tăng tốc website của bạn trên nền tảng wordpress với plugin Lite speed cache nâng cao hơn, tối ưu hóa SEO và bảo đảm bạn sẽ vượt qua điểm Core web vitals của Google một cách hoàn hảo như sangsieusale.com, chỉ cần gửi email liên hệ cho mình là được, phí là 25$/website nếu là VN thì hạ giá 500k/ trang web. Bảo đảm tốc độ không nhanh không vượt qua các bài kiểm tra thì không lấy tiền nhe! Hoặc liên hệ qua trang dịch vụ tăng tốc và tạo trang web giá rẻ của sangsieusale.com

 

Bài viết mới

Giới thiệu Sangsieusale 1233 bài viết
Sangsieusale viết về các chủ đề game play to earn, cách đầu tư coin thông minh, những thứ liên quan đến giải trí và kiếm tiền online. Bạn muốn một trang web giống sangsieusale? Liên hệ mình sẽ tạo cho bạn, chỉ từ 2.5 triệu đồng là có một trang website để khởi nghiệp rồi đó! Liên hệ ngay nếu bạn có ý tưởng nhé!
Theo dõi
Thông báo của

0 Comments
Phản hồi nội tuyến
Xem tất cả bình luận