Google PageSpeed là gì? Bí quyết tối ưu hiệu suất website toàn diện

Hoàng Nghĩa Hoàng Nghĩa |

10:15 27/05/2024

Mọi Webmaster cần phải trả lời được câu hỏi “Google Pagespeed là gì?”. Ngày nay, Google đã sử dụng các yếu tố tốc độ và trải nghiệm cho mục đích xếp hạng. Để biết cách tối ưu hiệu suất cho website, bạn hãy dành ít phút cho bài viết dưới đây.

PageSpeed Insights là một sản phẩm do chính Google cung cấp. Đây là một công cụ hoàn toàn miễn phí để đo các chỉ số hiệu suất và cung cấp những đề xuất cải thiện trang web.

Cuối năm 2018, Lighthouse chính thức cung cấp SpeedInsight. Sức mạnh của chúng nằm ở khả năng phân tích trang web và cung cấp các đề xuất hữu ích cho cả máy tính và thiết bị di động.

Những kết quả trong báo cáo phân tích trang của bạn sẽ dựa trên API của Lighthouse. Google Lighthouse là công cụ nguồn mở miễn phí giúp đánh giá sự phù hợp của một website với các tiêu chuẩn phát triển web hiện đại.

Google PageSpeed Insights là gì?
PageSpeed cung cấp các chỉ số và đề xuất tối ưu website

Vì vậy, ngoài tốc độ và trải nghiệm thì người dùng còn nhận được các đánh giá liên quan đến SEO, mã nguồn. Có thể nói, PageSpeed Insight là công cụ không thể thiếu của mọi Webmaster. Trong phần tiếp theo, chúng ta sẽ tìm hiểu về ý nghĩa các thông số và cách tối ưu website toàn diện.

Một trong những điều quan trọng cần biết khi tìm hiểu PageSpeed Insight là gì chính là các tiêu chuẩn đánh giá. Những tiêu chuẩn này sẽ là căn cứ để tối ưu website và sẽ thay đổi theo thời gian. Dưới đây là những tiêu chuẩn hiện đang được áp dụng:

  • Tổng thời gian cần để tải trang lên màn hình thiết bị của người dùng. Chỉ số được tính bằng thời gian thực thi JavaScript, thời gian phản hồi của máy chủ,…
  • Tốc độ của website được đánh giá dựa trên các chỉ số hiệu suất của Google.
  • Tổng khối lượng website được đo từ kích thước của tất cả tài nguyên. Các tài nguyên bao gồm hình ảnh, các tệp CSS, JavaScript và tài nguyên khác.
  • Chất lượng hình ảnh được sử dụng gồm kích thước, dung lượng, định dạng,…
  • Khởi động chức năng compress dữ liệu trước khi gửi về trình duyệt trang web.
  • Loại bỏ những tài nguyên chặn hiển thị, phân phối thứ tự các tài nguyên quan trọng và ít quan trọng.
  • Tận dụng tối đa những tài nguyên không đồng bộ trên website.
Tiêu chuẩn đánh giá của Google PageSpeed Insights
Một trong những tiêu chuẩn để đánh giá của Google PageSpeed Insights là chất lượng hình ảnh

Dựa trên các tiêu chuẩn này, PageSpeed Insight sẽ giúp bạn đánh giá “sức khỏe” trang web một cách hiệu quả. Ngoài ra, đối với các website chưa tối ưu sẽ nhận được những đề xuất để cải thiện. Có nhiều thông tin và điểm số từ PageSpeed mà bạn cần phải lưu ý.

Điểm số tốc độ cho biết hiệu suất của một website. Được tính dựa trên Lighthouse Lab, Speed Score có thang đo từ 0 đến 100 điểm. Điểm số càng cao thì hiệu suất càng lớn và ngược lại. Hiệu suất gồm thời gian tải trang, kích thước tệp, số lượng tệp tải xuống và khả năng tương tác của người dùng.

Điểm tốc độ - Speed Score
Điểm tốc độ cho biết hiệu suất cụ thể của một website

Còn được biết đến với tên gọi khác là dữ liệu kiểm thử. Speed Test Insights sẽ thực hiện các bài kiểm tra để đánh giá hiệu suất website trong môi trường giả lập. Vì thế, kết quả thu được sẽ giúp bạn có được cái nhìn tổng quan về trang web trong nhiều điều kiện. Tuy nhiên, bạn cần có dữ liệu thực (Field data) để đánh giá một cách đầy đủ và chính xác nhất.

Dữ liệu thực được Google tự động thu thập từ trình duyệt Chrome khi người dùng truy cập trang web. Bằng cách này, PageSpeed Insights sẽ cung cấp được thông tin chính xác về hiệu suất website trong điều kiện thực tế. Cùng với Lab data, Field data là những thông tin giá trị phục vụ công việc tối ưu trang web.

Diagnose performance issues là khu vực chẩn đoán các vấn đề về hiệu suất của website. Bạn sẽ tìm thấy những thông báo lỗi tại đây như định dạng, kích cỡ hình ảnh chưa tối ưu, các tài nguyên bị chặn, giảm các tệp JavaScript không sử dụng,…. Ngoài thông báo, PageSpeed Insights còn cung cấp những giải pháp để khắc phục hoặc cải thiện.

Chẩn đoán - Diagnostics
Các chẩn đoán giúp bạn biết được vấn đề làm chậm website

Ngay bên cạnh chẩn đoán về các vấn đề hiệu suất, bạn sẽ tìm thấy đề xuất cải thiện trang web (Accessibility). Nói cách khác, những điều được xác định là vấn đề sẽ cần khắc phục trước. Sau khi đã hoàn tất, bạn có thể cải thiện thêm thông qua những gợi ý được cung cấp. Một vài mục mà bạn sẽ được cân nhắc cải thiện như độ tương phản của màu sắc, sắp xếp tiêu đề, tên các nút không thể truy cập được,….

Đề xuất cải thiện trang - Opportunities
Có thể cải thiện trang web dựa vào các đề xuất

Trong mỗi mục kiểm tra của PageSpeed Insights bao gồm Performance, Accessibility, Best Practice và SEO luôn có mục Passed Audits. Đây là khu vực dùng để liệt kê các tiêu chuẩn mà trang web đã đạt được. Nếu nhìn thấy phần này với các dòng được đánh dấu xanh thì website đã tối ưu thành công. Ví dụ trong mục SEO, website đã có thẻ <title> thì nó sẽ được liệt kê trong Passed Audits.

Đạt yêu cầu - Passed Audits
Những tiêu chuẩn đã đạt yêu cầu sẽ được đánh dấu riêng

Khi tìm hiểu Google PageSpeed là gì nhiều bạn lo lắng về mức độ ảnh hưởng đến hoạt động SEO. Tuy nhiên, điểm số của SEO PageSpeed Insights không ảnh hưởng trực tiếp đến thứ hạng từ khóa. Vì Google sử dụng nhiều tiêu chí cũng như thuật toán phức tạp để xếp hạng trang web. Dù vậy, vẫn có một mối liên hệ nhất định mà bạn không thể bỏ qua các đề xuất từ công cụ này.

PageSpeed Insights có ảnh hưởng đến SEO hay không?
PageSpeed Insights có mối liên hệ trực tiếp với SEO

Trải qua nhiều năm nghiên cứu và phát triển cho công việc tối ưu website, PageSpeed Insights ngày càng hoàn thiện. Giờ đây, không chỉ tốc độ tải trang mà cả trải nghiệm người dùng, tối ưu SEO cũng được liệt kê chi tiết. Đối với một Webmaster thì đây chính là những thông tin cực kỳ hữu ích.

Kể từ năm 2018, Google đã bổ sung tốc độ tải trang vào các yếu tố xếp hạng trên các thiết bị di động. Nói cách khác, không có khách truy cập nào muốn chờ đợi một trang web. Và bạn phải dựa vào PageSpeed Insights để biết cách kiểm tra, tính điểm hay tối ưu hiệu suất website.

Vì PageSpeed sử dụng API Lighthouse nên điểm số sẽ do công cụ này tính toán. Lighthouse cho biết hiệu suất tổng thể được tính bằng các chỉ số (Metrics) chứ không phải Opportunities hay Diagnostics. Dù vậy, bạn có thể dựa trên hai mục này để cải thiện các chỉ số một cách tối ưu.

Cách thức tính điểm website trên PageSpeed Insights
Các phiên bản Lighthouse khác nhau sẽ có sự điều chỉnh về chỉ số

Hiện nay, phiên bản Lighthouse 10 có 5 mục mà bạn cần tối ưu. Dưới đây là từng mục và trung bình điểm số của chúng ảnh hưởng đến hiệu suất tổng thể.

  • First Contentful Paint: 10%
  • Speed Index: 10%
  • Largest Contentful Paint: 25%
  • Total Blocking Time: 30%
  • Cumulative Layout Shift: 25%

Theo thang đo 100 điểm, có ba khoảng điểm được phân chia bằng màu sắc. Qua đó, người dùng sẽ đánh giá được tình trạng hiệu suất của trang web. Cụ thể:

  • Từ 0 đến 49 điểm (chậm) : Màu đỏ cho biết website có nhiều vấn đề,
  • Từ 50 đến 89 điểm (trung bình) : Màu cam là website cần cải thiện,
  • Từ 90 đến 100 điểm (nhanh) : Màu xanh là website đã được tối ưu.
Cách thức tính điểm website trên PageSpeed Insights
Màu sắc được dùng để tượng trưng cho các khoảng điểm số

Màu sắc rất hữu ích để làm nổi bật các phần quan trọng. Nó sẽ cho bạn biết vấn đề nào cần được ưu tiên. Ngoài ra, bạn cần học cách kiểm tra tốc độ và đọc kết quả trên PageSpeed Insights.

Đây là một công cụ miễn phí và để sử dụng bạn chỉ cần truy cập, sau đó nhập địa chỉ trang web muốn kiểm tra. Cụ thể từng bước được hướng dẫn chi tiết sau đây:

  • Bước 1 : Bạn mở trình duyệt và truy cập vào địa chỉ PageSpeed: https://pagespeed.web.dev/.
  • Bước 2 : Nhập trực tiếp hoặc sao chép và dán một URL vào ô trống, nhấn “ Analyze (Phân tích) ”.
  • Bước 3 : Việc tiếp theo là chờ đợi hệ thống thực hiện công việc phân tính, đánh giá. Tùy vào website cụ thể mà thời gian phân tích sẽ nhanh hay chậm.
  • Bước 4 : Nếu địa chỉ bạn nhập vào đúng thì kết quả sẽ trả về là thông tin hiệu suất website.
Cách kiểm tra tốc độ tải website và đọc kết quả
Phân tích tốc độ tải trang của website bằng Google PageSpeed chỉ với 4 bước

Bạn có thể nhập bất kỳ địa chỉ nào muốn kiểm tra. Điều đó bao gồm cả những trang web mà bạn không phải là chủ sở hữu. Và bạn sẽ xem xét được cách mà các webmaster khác đang tối ưu website của họ. Dưới đây là ý nghĩa của từng thông số:

First Contentful Paint (FCP): Là khoảng thời gian mà trình duyệt cần để hiển thị phần nội dung DOM đầu tiên sau khi người dùng điều hướng đến trang của bạn. Những hình ảnh, phần tử <canvas> mà không phải màu trắng và SVG trên trang là nội dung DOM, không bao gồm những thứ bên trong iframe.

Speed Index : Hỗ trợ đo tốc độ hiển thị trực quan của nội dung trong quá trình tải trang. Lighthouse sẽ quay video tải trang trong trình duyệt và tính toán tiến trình trực quan giữa các khung. Sau đó, mô-đun Speedline Node.js sẽ tính điểm.

Total Blocking Time (TBT) : Là tổng thời gian mà một trang bị chặn phản hồi thông tin đầu vào của người dùng. Ví dụ như nhấp chuột, nhấn màn hình hoặc nhấn bàn phím. Tổng số được tính bằng cách cộng phần chặn của tất cả các tác vụ dài giữa Thời gian hiển thị nội dung đầu tiên (First Contentful Paint) và Thời gian tương tác (Time to Interactive). Tác vụ thực thi lâu hơn 50 ms là tác vụ dài. Tác cụ cần nhiều hơn 50 ms là phần chặn. Ví dụ nếu Lighthouse phát hiện một tác vụ dài 70 mili giây thì phần chặn sẽ là 20 mili giây.

Total Blocking Time (TBT)
Minh họa về Total Blocking Time trên Google PageSpeed

Largest Contentful Paint (LCP): Được tính từ thời điểm phần tử nội dung lớn nhất trong khung nhìn được hiển thị trên màn hình. Điều này gần đúng khi nội dung chính của trang được hiển thị cho người dùng.

Cumulative Layout Shift (CLS) : Là chỉ số Core Web Vital ổn định. Chỉ số này lấy người dùng làm trung tâm để đo lường độ ổn định của hình ảnh. CLS càng thấp thì càng tốt vì người dùng không bị ảnh hưởng bởi những thay đổi không mong muốn.

Dựa vào những chỉ số và đề xuất mà PageSpeed cung cấp, các Webmaster có thể tối ưu hiệu suất website. Mặc dù, việc này không trực tiếp ảnh hưởng đến thứ hạng từ khóa. Việc cải thiện điểm số trên PageSpeed Insights sẽ góp phần nâng cao hiệu suất website và trải nghiệm của người dùng.

Mối quan tâm hàng đầu của các Webmaster khi tìm hiểu Google PageSpeed chính là cách cải thiện điểm số. Hiện nay, có nhiều phương pháp được chia sẻ để tăng điểm trên PageSpeed. Dù vậy, cách làm cơ bản nhất vẫn là dựa vào những chỉ số và đề xuất được cung cấp. Những phương án dưới đây có thể sẽ giúp bạn “đổi màu” kết quả.

Bằng cách sử dụng tính năng giải nén server của PageSpeed, bạn sẽ có những tài nguyên được nén. Các tài nguyên này được nén lại trong quá trình truyền qua các HTTP request. Hành động giải nén sẽ tiết kiệm băng thông, giúp website tải nhanh hơn.

Các tệp CSS hoặc JavaScript có thể là nguyên nhân làm gia tăng lượng tài nguyên không cần thiết. Những đề xuất từ PageSpeed Insights sẽ giúp bạn xác định các tệp nào cần giảm dung lượng (Minify). Việc này yêu cầu một chút kiến thức về mã nguồn, bạn có thể dùng plugin đối với WordPress nhưng phải kiểm tra lại giao diện và các chức năng kỹ lưỡng.

Giảm tối thiểu tài nguyên trên trang web
Mã nguồn mở WordPress có thể dùng plugin để hỗ trợ việc tối ưu hiệu suất

Bạn sẽ nhận được thông báo nếu thời gian phản hồi của máy chủ quá chậm. Hầu hết các nhà cung cấp máy chủ hiện nay đều có quy định đối với sản phẩm của họ. Nói cách khác, bạn chỉ có thể đổi server chính để có được thời gian phản hồi tốt hơn. Hãy ưu tiên các máy chủ phù hợp với vị trí của khách truy cập và có băng thông rộng rãi.

Thông báo “loại bỏ JavaScript chặn hiển thị” xuất hiện khi có một đoạn mã JavaScript đang tạm dừng quá trình tải cho phần trong màn hình đầu tiên của trang. Thông thường, vấn đề này xảy ra với các tập lệnh của bên thứ ba. Google PageSpeed Insights sẽ cho bạn biết đó chính xác là tập lệnh nào.

Một thủ thuật nhỏ để giúp tăng “cảm giác” về tốc độ cho trang web là ưu tiên các nội dung trong màn hình đầu tiên. Khách truy cập sẽ cảm thấy website tải nhanh hơn nếu họ nhìn thấy các nội dung ở trang đầu tiên ngay lập tức. Ngược lại, nếu trang đầu tiên tải lên sau cùng thì sẽ cho cảm giác chậm chạp.

Cache hay bộ nhớ đệm là giải pháp tuyệt vời để cải thiện tốc độ tải trang. Bằng cách ghi nhớ những tài nguyên đã tải ở lần trước, chúng sẽ có sẵn để hiển thị khi khách truy cập khi họ quay trở lại. Việc lưu cache không quá phức tạp, các trang web mã nguồn mở như WordPress có thể cài đặt plugin hỗ trợ.

Sử dụng bộ nhớ cache trong trình duyệt web
Việc lưu cache là phương pháp hiệu quả để cải thiện tốc độ tải của website

Hình ảnh được xem là nguyên nhân hàng đầu dẫn đến việc làm chậm tốc độ tải trang của các website. Phần lớn người dùng không chú ý đến các nội dung bằng hình ảnh khi tải lên. Bạn có thể dễ dàng tìm thấy các hình ảnh đang chiếm nhiều dung lượng trong PageSpeed Insights.

Hiện nay, có hai cách phổ biến để giảm dung lượng ảnh đó là thay đổi định dạng và nén ảnh. Những định dạng được Google khuyến nghị là AVIF và WebP. So với PNG và JPG thì những định dạng như AVIF và WebP giảm kích thước đi đáng kể nhưng vẫn đảm bảo chất lượng ảnh. Tuy nhiên, bạn cần chú ý đến trình duyệt mà khách truy cập thường dùng, vì một số trình duyệt cũ có thể không hỗ trợ.

Cách thứ hai để tối ưu hình ảnh cho website là nén ảnh. Việc nén ảnh có thể hiểu nôm na là giảm chất lượng ảnh để tiết kiệm dung lượng. Điều quan trọng nhất bạn cần lưu ý là khi ảnh bị giảm chất lượng quá nhiều có thể bị nhòe. Đổi định dạng hay nén ảnh đều có thể thực hiện dễ dàng bằng các công cụ miễn phí.

Chuyển hướng trang quá nhiều lần không chỉ làm tăng thời gian tải trang mà còn gây khó chịu cho người dùng. Trước đây, để hiển thị trên nhiều thiết bị, các trang web thường chuyển hướng nhiều lần. Ví dụ như example.com sẽ chuyển đến m.example.com khi truy cập bằng điện thoại.

Hạn chế chuyển hướng trang đích nhiều lần
Việc chuyển hướng nhiều lần sẽ ảnh hưởng trực tiếp đến trải nghiệm của người dùng
Hoàng Nghĩa

Hoàng Nghĩa

Tôi là Hoàng Nghĩa, hiện là CEO/Founder của GYB AGENCY, trải qua hơn 5 năm làm việc trong lĩnh vực Digital Marketing giúp tôi hiểu rõ bản chất và khó khăn trong của ngành. Chính vì thế, tôi mong muốn chia sẻ đến bạn đọc những kiến thức và kinh nghiệm của mình, hy vọng bài viết trên mang lại nhiều thông tin hữu ích cho bạn!

Kiến thức