Tối ưu tốc độ Website theo Google PageSpeed Insights

Bài viết sau sẽ hướng dẫn cách tối ưu tốc độ website WordPress theo Google PageSpeed Insights.

Và website chúng ta sẽ cùng mổ xẻ là: Impactus.com.vn

Kết quả khi kiểm tra bằng Google PageSpeed Insights (trước khi tối ưu)

Hãy truy cập vào website để xem tốc độ thực. Google Pagespeed chỉ là tham khảo, và trong nhiều trường hợp không phản ánh đúng tốc độ của web.

Nhiều trường hợp điểm GG PageSpeed rất cao, nhưng web tải rất chậm, hoặc ngược lại.

themevi-toi-uu-google-pagespeed-insights1-min

themevi-toi-uu-google-pagespeed-insights2-min

Và đây là gợi ý tối ưu từ Google

themevi-toi-uu-google-pagespeed-insights3-min

Bạn có hiểu gì không…?

Nếu không, thì đọc tiếp nhé 😛

Bước 1. Tối ưu hóa hình ảnh

Tối ưu hóa hình ảnh chính là việc nén các ảnh mà Google gợi ý tối ưu để giảm dung lượng hình ảnh. Để nén ảnh, bạn có 2 cách:

  • Cài đặt Plugin nén ảnh
  • Nén bằng công cụ Online

Mình sẽ sử dụng cách 2, vì không cần phải cài đặt thêm Plugin, nhẹ web.

Hướng dẫn nén ảnh Online, không giảm chất lượng ảnh

Hoặc bạn cũng có thể tải ảnh mà Google đã nén sẵn rồi:

themevi-toi-uu-google-pagespeed-insights4-min

Sau khi đã nén ảnh, chỉ cần tải lên và thay thế ảnh hiện tại ở trang chủ hoặc trang đang kiểm tra của website thôi.

Bước 2. Nâng cao lưu bộ nhớ đệm trong trình duyệt

Để nâng cao lưu bộ nhớ đệm trong trình duyệt, bạn chỉ cần cài đặt 1 Plugin Cache và cấu hình. Ở đây mình sẽ lựa chọn WP Super Cache vì hơn 1 triệu website đang sử dụng, và nhiều hướng dẫn trên Internet.

Đầu tiên cần cài đặt và kích hoạt Plugin WP Super Cache

themevi-toi-uu-google-pagespeed-insights5-min

Tiếp theo truy cập vào Settings (Cài đặt, hoặc Thiết lập) > WP Super Cache

themevi-toi-uu-google-pagespeed-insights6-min

Tiếp đó đánh dấu vào Caching On và bấm Update Status

themevi-toi-uu-google-pagespeed-insights7-min

Sau đó mở trang chủ website, bấm tổ hợp phím Ctrl U hoặc F12, rồi kéo xuống cuối cùng. Nếu thấy dòng chữ như hình sau thì Cache đã được kích hoạt

<!– Dynamic page generated in 0.585 seconds. –>

<!– Cached page generated by WP-Super-Cache on 2018-10-09 15:51:29 –>

Chuyển qua tab Advanced, và đánh dấu vào các tùy chọn như hình

themevi-toi-uu-google-pagespeed-insights8-min

Sau đó kéo xuống một tí và bấm vào Update Status

themevi-toi-uu-google-pagespeed-insights9-min

Bước 3. Giảm thời gian phản hồi của máy chủ

Rất nhiều yếu tố ảnh hưởng tới điều này. Và một trong số đó là chất lượng máy chủ (hoặc hosting).

Bạn nên:

  • Đặt máy chủ trong nước, nếu khách truy cập là trong nước
  • Sử dụng CDN Việt Nam, nếu máy chủ đặt tại nước ngoài. Thử VCCLOUD CDN, Free 200 GB.
  • Nếu đặt máy chủ tại nước ngoài, nên chọn vị trí gần Việt Nam như Singapore, Hong Kong hoặc Tokyo

Bước 4. Giảm bớt CSS và JavaScript

Về phần Ưu tiên nội dung hiển thị và Loại bỏ JS trong màn hình đầu tiên…nếu không biết lập trình, bạn sẽ rất khó làm được, mình cũng không biết làm :D.

Để giảm bớt CSS và JavaScript, bạn cần nén các File này, và sẽ sử dụng plugin Autoptimize

Đầu tiên cài đặt và kích hoạt plugin Autoptimize

themevi-toi-uu-google-pagespeed-insights10-autoptimize-min

themevi-toi-uu-google-pagespeed-insights11-autoptimize-min

Sau đó tìm đến Settings (Cài đặt) > Autoptimize

themevi-toi-uu-google-pagespeed-insights12-autoptimize-min

Autoptimize thi thoảng gây vỡ giao diện. Vậy nên bạn chuẩn bị sẵn tài khoản Hosting, để tắt plugin, nếu chẳng may lỗi.

Đánh dấu vào tùy chọn như hình và bấm Save Changes and Empty Cache

Vậy là xong rồi đó!

Gửi một bình luận