Bạn đang test tốc độ website trên Google Pagespeed Insights ?

Và giật mình khi điểm số quá thấp ?

Ngay lập tức bạn tìm các hướng dẫn, cũng như cài đặt plugin nhằm tăng tốc WordPress.

Như các plugin tạo bộ nhớ đệm giống WP Rocket hoặc Swift Performance.

Bây giờ bạn quay lại và kiểm tra lại điểm số và nhận ra rằng

Điểm số có tăng hoặc tăng không đáng kể

Có quá nhiều cảnh báo cũng như đề nghĩ được PageSpeed Insights đưa ra:

• Các cảnh báo đỏ và vàng nghĩa là gì?
• Tại sao điểm số của mình lại thấp thế?
• Những đề xuất này có ý nghĩa gì?

Lúc này, có quá nhiều thứ sẽ làm bạn băn khoăn.

Bạn không biết tại sao caching plugin không tự động sửa những lỗi này, hay liệu mình phải thêm những gì.

Rất nhiều người đã hỏi mình tại sao điểm số trên PageSpeed của họ không thể cao hơn.

Hay mấy cái plugin tăng tốc kia không có tác dụng ?

Sự thật rất đơn giản:

Số điểm trên Google PageSpeed không quan trọng

Chính xác, mình nói là không quan trọng.

Đây là lý do:

Sự thật về tốc độ

Các cache plugin sinh ra để làm cho website nhanh hơn.

Tốc độ, hay thời gian tải trang là một trong những số liệu rất quan trọng.

Đây là thước đo cảm nhận của người dùng về tốc độ trên trang.

Hai số liệu này có ảnh hưởng đến SEO và UX (trải nghiệm của người dùng).

Khi Google bot thu thập dữ liệu trên web, chúng không thể tính “điểm số”, chỉ đo tốc độ thôi.

Bạn có biết rằng thật ra Google PageSpeed thậm chí còn không đo thời gian tải trang?

Một lần nữa

Google PageSpeed Insights không thực sự đo tốc độ trên website

Hiện tại điểm Google PageSpeed dựa hoàn toàn trên API PageSpeed, hiện đang được biết với cái tên khác là Lighthouse.

Mình rất thích sử dụng Pingdom Tools để đo tốc độ web:

Khi còn đi học, các bạn có chắc là điểm số càng cao thì có nghĩa càng thông minh không?

Mình thì không cho là như vậy. Điểm số cao chỉ cho thấy người đó làm tốt bài kiểm tra. Nhưng sự thông minh không nằm ở đấy. .

Như vậy, điểm số không thể hiện sự thông minh, và những con số trên PageSpeed cũng không đại diện cho tốc độ tải trang.

Đây là ví dụ về 3 website có thời gian tải tương đương, nhưng điểm PageSpeed lại khác nhau:

1. PurePlanetRecycling

Pingdom Test:

PageSpeed trên desktop:

PageSpeed trên mobile:

• Thời gian tải: 881 ms
• Google PageSpeed: 89 trên desktop / 37 trên mobile

2. AnticaTrattorialPortico.it

Pingdom Test:

PageSpeed trên desktop:

PageSpeed trên mobile:

Thời gian tải: 649 ms

Google PageSpeed: 98 trên desktop / 41 trên mobile

3. CheekyPunter.com

Pingdom Test:

PageSpeed trên desktop:

PageSpeed trên mobile:

Thời gian tải: 461 ms

Google PageSpeed: 100 trên desktop / 30 trên mobile

Giữa 3 website, thời gian tải dao động từ 461 ms đến 881 ms nhưng điểm số PageSpeed lại từ 30 đến 41 trên mobile!

Và website bên dưới có điểm PageSpeed cao nhất nhưng lại có tốc độ chậm nhất

Pingdom Test:

PageSpeed trên desktop:

PageSpeed trên mobile:

Vậy, điểm số từ Google PageSpeed không đại diện cho tốc độ tải trang.

Chạy theo “điểm số” rất mất thời gian

Không có website nào đạt được điểm số hoàn hảo, thực tế là rất khó.

Hơn nữa chúng cũng chẳng liên quan đến tốc độ, tại sao bạn lại phải quan tâm?

Nếu bạn cố gắng đạt được con số hoàn hảo bằng cách thực hiện tất cả các đề xuất Google PageSpeed đưa ra.

Phải nhắc lại là nó rất khó, và đôi khi còn phi thực tế.

Ví dụ: PageSpeed yêu cầu bạn thu nhỏ hoặc thêm các expire header vào một file không được lưu trữ trên web của bạn.

Một ví dụ minh họa cho đề xuất “Serve static assets with an efficient cache policy”

Như bạn đã thấy, Google PageSpeed Insights muốn chúng ta tối ưu external file đến từ Google Analytics và Optin Monster.

Điều này là bất khả thi (Bó tay)

Eliminate Render Blocking Resources

Một đề xuất rất phổ biến khác mà PageSpeed hay đưa ra là:

”Eliminate Render Blocking Resources”

Đề xuất này liên quan đến cả JS và CSS render-blocking.

Chúng liên quan đến hiệu suất của các file JavaScript đã được load trong footer của trang.

Hoặc không được đồng bộ để việc tải xuống các tài nguyên khác không bị chậm hay chặn lại.

Cách cache plugin thường giải quyết vấn đề này nhờ vào các tùy chọn Deferred JS, Combine JS.

Bằng cách kích hoạt Deferred JS, tất cả các file JavaScript trên web, bao gồm cả các file được rút gọn bởi WP Rocket, sẽ được load với defer attribute.

Còn với Combine JS, tất cả file JS (kể cả inline JS cũng như scripts từ bên thứ 3) sẽ được đặt trong footer, làm cho chúng không bị “render-blocking”.

Nếu đã kích hoạt các tùy chọn này nhưng vẫn thấy thông báo “Render-blocking resources”, rất có thể Safe Mode cho Deferred JS đang được kích hoạt.

Safe Mode sẽ không cho jQuery bị deferred; tuy nhiên PageSpeed lại không muốn như vậy.

Trong trường hợp này, nếu chúng ta quyết định vô hiệu hóa jQuery.

Hãy kiểm tra thật cẩn thận website trong tab ẩn danh để đảm bảo không có vấn đề nào về hiển thị/chức năng xảy ra.

Làm tương tự nếu bạn muốn xóa bất kỳ JS script nào khác.

Đối với render-blocking CSS, WP Rocket cho phép bạn khắc phục bằng tùy chọn Optimize CSS Delivery, xử lý asynchronous CSS và critical CSS.

Khi bạn kích hoạt cài đặt checkbox Optimize CSS, critical CSS sẽ được tạo trong nền và thêm vào khi load trang tiếp theo.

Sau đó, asynchronous CSS sẽ được load.

Vậy đâu là lợi ích khi sử dụng Google PageSpeed?

Google PageSpeed Insights sẽ rất hữu ích nếu bạn sử dụng đúng cách.

Và không quá điên cuồng chạy theo điểm số.

Đôi khi công cụ sẽ cảnh báo bạn về những khu vực trên web đang có vấn đề và cần chúng ta khắc phục.

Ví dụ: PageSpeed sẽ cảnh báo cho chúng ta biết nội dung không được GZIP-ed (Enable Text Compression).

Hiện có nhiều cache plugin hỗ trợ cái này, nếu PageSpeed đưa ra cảnh báo, nhiều khả năng server không kích hoạt chúng.

Hay việc công cụ cảnh báo chúng ta đang có quá nhiều hình lớn và dễ dàng được nén lại.

Đây là một đề xuất hữu ích mà bạn nên thực hiện:

Tối ưu hóa hình ảnh – giúp website load nhanh hơn.

Hiện mình đang dùng shortpixel và nó hoạt động rất tốt (giá cũng khá rẻ)

Theo mình, chúng ta nên sử dụng PageSpeed như một công cụ để tham khảo.

Với mục đích tăng tốc website chứ không phải mục tiêu là đạt “100 điểm” với PageSpeed.

Một số lưu ý khi sử dụng Google PageSpeed

• Đừng quá phụ thuộc vào PageSpeed để đánh giá hiệu suất website. Hãy dùng như một công cụ tham khảo.
• Luôn đọc các đề xuất một cách cẩn thận và áp dụng nếu chúng hữu ích cho bạn. Nếu PageSpeed yêu cầu các bạn làm điều gì đó không thể, bạn nên bỏ qua!
• Đừng quên mục tiêu của chúng ta là tập trung vào tốc độ.
• Luôn sử dụng các công cụ kiểm tra tốc độ khác nhau như Pingdom hay GTMetrix để theo những thứ chúng ta áp dụng có hiệu quả hay không.