Hướng dẫn tối ưu tốc độ Website và tăng điểm Google Speed Insight với WP Rocket

Huong Dan Dung Wprocket Toi Uu Website Wordpress Optimized

Đang yên đang lành, thì bỗng 1 ngày Website của bạn load chậm rì, ì ạch. Khách hàng Feedback vào trong khung hội thoại trực tuyến rằng “Web bạn chậm quá”… Vậy thì phải làm sao để cải thiện? Trong bài này, Liêm sẽ hướng dẫn dùng Plugin WP Rocket để tăng tốc Website WordPress của các bạn.

WP Rocket là gì?

Đầu tiên Liêm sẽ giải thích cho bạn hiểu WP Rocket là gì, để bạn hiểu rõ hơn về Plugin này. WP Rocket là một Plugin dùng cho Website WordPress dùng để tạo cache (bộ nhớ đệm) cho Website. Cách sử dụng Plugin này cực kỳ dễ dàng, không mất quá nhiều thời gian để thiết lập cho Plugin hoạt động tốt nhất.

Lợi ích mà WP Rocket mang lại

Được tích hợp bên trong các tiện ích  cao cấp, WP Rocket là một Plugin tính phí có khả năng tối ưu Website WordPress một cách tuyệt vời nhất, dưới đây là một số hình ảnh so sánh việc trước / sau khi cài Plugin WP Rocket.

Tăng tốc Website WordPress và kiếm trên 80 điểm GInsight với WP Rocket Tăng tốc Website WordPress và kiếm trên 80 điểm GInsight với WP Rocket

Tính năng của WP Rocket

Bên trong WP Rocket được tích hợp rất nhiều tính năng. Mà trong đó, hầu hết các tính năng này đều tập trung vào việc tăng tốc Website của bạn.

Dưới đây, là tóm gọn về các tính năng mà WP Rocket mang lại cho Website của bạn sau khi cài đặt:

  • Tạo Cache cho trình duyệt
  • Tối ưu tệp tin (Minify CSS/JS – Combine CSS/JS)
  • Hỗ trợ load JS/CSS không đồng bộ
  • Tự động Gzip giảm dung lượng các tệp tĩnh trên website
  • Xóa các chuỗi truy vấn trong tài nguyên để tăng tốc độ load trang
  • Tích hợp Lazy load ảnh và iframe
  • Tắt Emoji để giảm truy vấn HTTP
  • Tắt nhúng từ WordPress để tăng tốc
  • Tích hợp tối ưu Database thủ công / tự động
  • Tích hợp tương thích Cloudflare
  • Dùng chung được với Autoptimize
  • Gián đoạn Javascript giúp Website load nhanh hơn
  • Hỗ trợ OPCache giúp tăng tốc hiệu suất cho Website WordPress
  • Tăng điểm Google Speed Insight

Ở trên là một số thông tin mà WP Rocket mang lại cho bạn, để có góc nhìn tổng quan hơn, bạn nên tải và cài đặt trực tiếp WP Rocket về Website và sử dụng bằng cách xem tiếp ở dưới nhé.

Hướng dẫn tải WP Rocket và cài đặt vào Website WordPress

Huong Dan Tai Va Cai Dat Wp Rocket

Đầu tiên, để tải được WP Rocket, Liêm mời bạn click vào đây (phiên bản mới nhất WP Rocket 3.7) để vào trang tải Plugin. Sau khi đã tải về, các bạn truy cập vào trang quản trị của Website và tiến hành cài đặt theo đường dẫn sau:

Sau khi cài đặt xong, việc còn lại của bạn là hiểu về cách sử dụng WP Rocket hiệu quả nhất.

Hướng dẫn sử dụng WP Rocket hiệu quả cao nhất

Cũng như bao Plugin tạo Cache khác, WP Rocket cũng sẽ có những giới hạn của nó, nếu bạn áp dụng đúng thì Website của bạn sẽ ít gặp phải lỗi hay các phát sinh trong lúc sử dụng.

Vì thế, Liêm sẽ đưa ra những đề xuất, để bạn dựa vào đó để hiểu thêm hơn về việc áp dụng WP Rocket đúng cách cho Website.

Xem thêm: Biến hóa và tối ưu Website WordPress của bạn với WP Extra

I. Hướng dẫn cấu hình trong WP Rocket

Sau khi đã cài đặt WP Rocket vào Website, các bạn nhìn lên thanh Admin Bar sẽ thấy  nút WP Rocket xuất hiện, việc các bạn cần làm bấm vào nút đó để vào tổng quan của tiện ích.

Wp Rocket General

Tại đây, các bạn để giúp cho Liêm các Tab như hình trên, Liêm sẽ giải thích và hướng dẫn chi tiết từng Tab.

#Lưu ý: ✔ là bật

  • Cache
    • Enable caching for Mobile Devices ✔
  • File Optimization
    • CSS Files: các Option khi mở sẽ có thể ảnh hưởng giao diện Website, tắt nếu có lỗi
      • Minify CSS Files (Xóa khoảng trắng giữa các CSS để tối ưu kích thước tải) ✔
      • Combine CSS Files (dùng để gộp tất cả file css lại để tối ưu kích thước tải) ✔
      • Optimize CSS Delivery (tối ưu hóa các css chặn hiển thị để tăng tốc tải web) ✔
    • JavaScript Files: các Option khi mở sẽ có thể ảnh hưởng giao diện Website, tắt nếu có lỗi
      • Remove jQuery Migrate ✔
      • Minify JavaScript Files (tương tự Minify CSS) ✔
      • Combine JavaScript Files (tương tự Combine CSS Files) ✔
      • Exclude JavaScript Files (Copy mấy dòng này bỏ vào -> Mở Code) ✔
      • Load JavaScript Defered (tương tự Optimize CSS Delivery) ✔
        • Safe Mode for jQuery (khuyên dùng) ✔
      • Delay JavaScript execution (Tạo độ trễ load các file JavaScript để tăng tốc tải trang) ✔
  • Media: các Option khi mở sẽ có thể ảnh hưởng giao diện Website, tắt nếu có lỗi
    • Lazy Load: tăng tốc Website khi áp dụng load lần lượt hình ảnh (tắt nếu gây lỗi giao diện)
      • Enable for images ✔
      • Enable for iframe and vidoes ✔
        • Replace Youtube iframe with preview image (thay iframe của Youtube thành ảnh thumbnail mini)
    • Emoji:
      • Disable Emoji: tắt Emoji trên Website để tăng tốc Web (cái này tùy bạn xài không nha – Emoji là đây 🤞)
    • Embeds:
      • Disable WordPress Embeds ✔: Ngăn người khác nhúng nội dung từ trang web của bạn, ngăn bạn nhúng nội dung từ các trang web khác (không được phép) và xóa các yêu cầu JavaScript liên quan đến việc nhúng WordPress
    • WebP compatibility: nếu hình ảnh trên Web của bạn đang xài định dạng WebP thì bật lên nhé. Nếu Website của bạn chưa có WebP thì xài Imagify cho nó tự chuyển nha.
  • Preload:
    • Preload Cache ✔:
      • Active Preloading ✔:
        • Active sitemap-based cache preloading ✔
        • Yoast SEO XML site map (nếu bạn xài Yoast) ✔
    • Preload Links:
      • Enable link preloading ✔
      • Prefecth DNS request ✔: vào đây copy mấy dòng code bỏ vào
      • Preload Fonts: Nếu dùng Flatsome thì Copy dòng này bỏ vào
        • /wp-content/themes/flatsome/assets/css/icons/fl-icons.woff2
    • Database ✔: tích hết tất cả các phần tích được
      • Automatic cleanup: phần này chọn cho Schedule automatic cleanup là Daily nhé
  • Control Hearbeat ✔: tích xong save
  • Add-ons:
    • Google Analytics ✔: mở nếu xài GA
    • Facebook Pixel ✔: mở nếu xài FB Pixel
    • Các add-ons khác cũng tương tự, mở nếu có xài

Vậy là xong, giờ bạn bấm Save Chages và trải nghiệm lại Website xem thế nào.

Kiểm tra xem WP Rocket hoạt động chưa

Để kiểm tra WP Rocket có hoạt động hay không, thì bạn mở tab mới trên Website, và sau đó ấn Ctr + U (trên Window nha, còn MAC thì Liêm không biết). Kéo xuống dưới cùng và check xem có dòng code này hiện lên không

<!-- This website is like a Rocket, isn't it? Performance optimized by WP Rocket. Learn more: https://wp-rocket.me - Debug: cached@16xxxxxxxxxxxx -->

Nếu mà có, thì tức là WP Rocket đã hoạt động, và Website của các bạn đã được tối ưu hoàn tất nhé.

II. Nên xài Theme và Server nào tương thích tốt WP Rocket

Đa số, cách hoạt động của WP Rocket sẽ dựa trên phương thức là tự động, nên sẽ có một số giao diện sẽ không tương thích hết vói các tùy chọn của WP Rocket.

Tương tự, việc lựa chọn Hosting, VPS (gọi chung là Server) cho Website cũng rất quan trọng, vì trong WP Rocket có tính năng tối ưu tối cho server hỗ trợ OPCache (tăng hiệu suất cho Website PHP – trong đó có WordPress).

Giao diện: đề xuất theme Flatsome

Flatsome Logo

Ở đây, Liêm đề xuất bạn sử dụng giao diện Website Flatsome để cho tương thích cao nhất với WP Rocket. Riêng bản thân theme Flatsome này, là nó đã rất nhanh rồi, nếu mà bạn dùng kèm với WP Rocket thì như hổ mọc thêm cánh vậy.

Nhận Theme Flatsome Free

Server: đề xuất dùng VPS tại Maxdata

Vss Chay Website

Tại sao Liêm lại đề xuất dùng VPS của một nhà cung cấp lạ thế nhỉ? Đơn giản thôi, vì nhà cung cấp Server này ở Việt Nam, đảm bảo việc support nhanh cho bạn.

Đồng thời, trong gói VPS dành cho Website mà Maxdata cung cấp, thì đã được cài sẵn DirectAdmin và tích hợp OPCache bên trong, tương thích cực tốt với WP Rocket mà phí hàng tháng chỉ từ 120.000đ.

Bảng giá VPS Website

Video hướng dẫn sử dụng WP Rocket

Để các bạn nắm rõ hơn về việc sử dụng WP Rocket trong bức tranh sinh động hơn. Liêm có làm một đoạn video ngắn về mô tả cũng như hướng dẫn sử dụng WP Rocket cho bạn nào không biết cách setup. Mời bạn xem video ở dưới:

đang cập nhật…

Kết bài

Bài viết này Liêm viết ra, sẽ có thể có nhiều thiếu sót, nhưng nội dung bên trong đa số đề được viết bởi kinh nghiệm thực tế khi Liêm sữ dụng WP Rocket cho Website liemmkt.com nói riêng và các Website WordPress khác mà Liêm làm nói chung.

Đồng thời, các bạn đừng bỏ qua chuyên mục chia sẻ công cụ hữu ích dùng cho WordPress để tìm các bài viết hay về các công cụ có ích bạn nhé.

Chúc các bạn nhận được nhiều giá trị từ bài viết.

Bài được lên nội dung và chia sẻ bởi: Liêm MKT

Click to rate this post!
[Total: 2 Average: 5]
Gọi Liêm
Youtube
Zalo
Website của Liêm sử dụng Cookies để tối ưu hóa trải nghiệm lướt web của bạn.