Hướng dẫn tối ưu LiteSpeed Cache để tăng tốc WordPress

Bạn có bao giờ cảm thấy website WordPress của mình load chậm như “rùa bò” và không biết làm sao để cải thiện chưa? Mình từng như vậy, và sai lầm lớn nhất của Khương là không biết đến LiteSpeed Cache sớm hơn. Sau khi khám phá công cụ này, mình nhận ra nó không chỉ miễn phí mà còn mạnh mẽ hơn nhiều plugin trả phí như WP Rocket. Trong bài viết này, mình sẽ chia sẻ trải nghiệm của mình và hướng dẫn bạn cách tối ưu LiteSpeed Cache để tăng tốc website một cách dễ dàng.

Test Page Speed Chuẩn SEO
Đây là kết quả sau khi cài đặt Litespeed Cache

LiteSpeed Cache là gì?

LiteSpeed Cache là một plugin miễn phí giúp tăng tốc website WordPress bằng cách tận dụng công nghệ caching của máy chủ LiteSpeed. Không giống các plugin khác, nó tích hợp chặt chẽ với server, giảm thời gian tải trang xuống chỉ còn vài giây. Điều mình thích nhất? Nó hoàn toàn miễn phí và dễ dùng, ngay cả với người mới như mình lúc trước.

Tại sao LiteSpeed Cache vượt trội hơn WP Rocket?

Trước khi dùng LiteSpeed Cache, mình từng bỏ tiền mua WP Rocket vì nghe quảng cáo “tăng tốc đỉnh cao”. Nhưng sau khi thử cả hai, mình nhận ra:

  • Miễn phí vs trả phí: LiteSpeed Cache miễn phí, WP Rocket thì hơn $49/năm.
  • Hiệu suất: LiteSpeed Cache tận dụng máy chủ LiteSpeed (nếu hosting của bạn hỗ trợ), cho tốc độ vượt trội hơn caching thông thường.
  • Tính năng: Cả hai đều có Lazy Load, tối ưu CSS/JS, nhưng LiteSpeed Cache còn có QUIC.cloud CDN miễn phí.

(Gợi ý: Nếu bạn muốn chọn hosting tối ưu cho WordPress, xem review hosting Gethost.one

Hướng dẫn cài đặt Litespeed Cache

Bước 1: Cài đặt LiteSpeed Cache

Để bạn không “lạc lối” như mình lúc mới bắt đầu, đây là cách cài đặt đơn giản:

  • Cài plugin: Vào WordPress Dashboard > Plugins > Add New > tìm “LiteSpeed Cache” > cài đặt và kích hoạt. hoặc vào trang WordPress.org tải LiteSpeed Cache

Cài đặt LiteSpeed Cache trên WordPress
  • Bật cache: Vào LiteSpeed Cache > Cache > Bật “Enable Cache”.
  • Cài đặt trước: Cấu hình cài đặt trước để tiết kiệm thời gian.
Cài đặt trước Litespeed Cache

Bước 2: Cấu hình Cache

  • Bật Bộ Nhớ Đệm: Kiểm tra trang web của bạn trên uptrends.com và tìm kiếm x-litespeed-cache hit.
  • Bộ Nhớ Đệm Cho Người Dùng Đã Đăng Nhập: TẮT tùy chọn này trừ khi bạn điều hành một trang web thành viên hoặc có người dùng đăng nhập cần bộ nhớ đệm riêng, nếu không sẽ tốn tài nguyên.
  • Bộ Nhớ Đệm Cho Người Bình Luận: TẮT tùy chọn này nhằm tạo bộ nhớ đệm riêng cho những bình luận đang chờ duyệt, nhưng cũng sẽ tiêu tốn tài nguyên nếu blog của bạn nhận nhiều bình luận.
  • Cache Rest API: BẬT để sử dụng với nhiều chủ đề, plugin và Trình chỉnh sửa khối WordPress.
  • Cache Trang Đăng Nhập: BẬT để tiết kiệm tài nguyên máy chủ vì trang đăng nhập là mục tiêu chung. Không thay đổi URL đăng nhập vì LiteSpeed + QUIC.cloud tối ưu hóa trang đăng nhập mặc định.
  • Lưu Trữ Đệm favicon.ico: BẬT để lưu trữ đệm favicon (hình ảnh logo nhỏ hiển thị trên tab trình duyệt).
  • Cache Tài Nguyên PHP: BẬT để lưu trữ đệm các tệp PHP tĩnh (bao gồm CSS + JS) được chủ đề của bạn tải. Chỉ tắt nếu bạn sử dụng CSS động + JavaScript tải trong PHP, mà có thể không áp dụng.
  • Cache Di Động: BẬT đóng vai trò quan trọng khi sử dụng Chế độ Khách, Tối ưu hóa Khách và các cài đặt khác (UCSS, CCSS, AMP) hoặc khi sử dụng nội dung dành riêng cho thiết bị di động. Tiêu tốn tài nguyên.
  • Lưu Trữ URI Bộ Đệm: Không cần thiết đối với hầu hết các trang web vì cài đặt “lưu trữ người dùng đã đăng nhập” đã xử lý các URI bộ đệm riêng tư, và thường không có trang nào trên trang web của bạn cần lưu trữ bộ đệm bắt buộc.
  • Loại Bỏ Chuỗi Truy Vấn: Các chiến dịch tiếp thị và URL theo dõi thường chứa chuỗi truy vấn mà bộ nhớ đệm bị bỏ qua. Danh sách mặc định thường ổn, nhưng nếu bạn có danh sách khác, hãy thêm chúng.

Cấu hình Litespeed Cache

Bước 3: Xóa Cache tự động

  • Purge All On Upgrade: Bật để xóa bộ nhớ đệm khi lõi, chủ đề hoặc plugin WordPress được nâng cấp, giúp đảm bảo trang web của bạn hiển thị đúng. LiteSpeed khuyên bạn nên giữ tùy chọn này ở chế độ Bật.
  • Quy Tắc Xóa Tự Động Khi Xuất Bản/Cập Nhật: Cài đặt mặc định là hợp lý. Mỗi khi bạn xuất bản bài viết, nội dung blog và các phần khác có thể cần được cập nhật, vì vậy chúng cũng nên được xóa.
  • Phục Vụ Bản Cũ: Tắt. Khi bật tính năng này, bản sao đã xóa gần đây nhất (bản cũ) của trang sẽ được phục vụ nếu phiên bản bộ nhớ đệm mới chưa được tạo ra (bật tính năng này sẽ tiêu tốn tài nguyên).
  • URL Xóa Theo Lịch Trình: Không cần thêm URL ở đây trừ khi bạn cần xóa các trang vào thời điểm cụ thể (khi lưu lượng truy cập thấp). Trong trường hợp đó, bạn cũng sẽ cần thiết lập thời gian xóa theo lịch trình.
  • Xóa Tất Cả Khi Sử Dụng Hooks: Cài đặt mặc định là tốt. Khi các hook cụ thể được kích hoạt, nó sẽ xóa tất cả. LiteSpeed cho biết rằng comment_post có thể là tốt để xóa tất cả khi có bình luận.

Screenshot

Sang tab trình duyệt bật tính năng cache trình duyệt

Bước 4 Litespeed

Tối ưu hình ảnh

  • Thay thế WebP hình ảnh: Bật – bật tùy chọn này nếu bạn đã bật tùy chọn trước đó.
  • Thuộc tính WebP cần thay thế: chỉ định các thuộc tính phần tử sẽ được WebP thay thế.
  • WebP dành cho srcset bổ sung: Bật – đảm bảo hình ảnh trong mã tùy chỉnh được phục vụ dưới dạng WebP.
  • Kiểm soát chất lượng hình ảnh của WordPress: 85 – PSI kiểm tra hình ảnh ở mức 85% nên đó là mức mình sử dụng.

Tối ưu hóa hình ảnh litespeed cache

Bước 4: Tối ưu CSS

Chỉ nên bật Nén và Kết hợp CSS, tắt các cấu hình khác. Nếu web bị vỡ bố cục, hãy tắt bố cục CSS

Cách Tối ưu CSS Litespeed Cache

Chuyển tối ưu font chữ sang Swap để khắc phục Render Blocking do font chữ

Chuyển Tối ưu font chữ sang Swap trên Litespeed cache

Bước 5: Tối ưu Javascripts

  • Nén JS (JS Minify): Bật – để loại bỏ các ký tự không cần thiết khỏi mã JavaScript.
  • Gộp JS (JS Combine): Tắt. Hãy tắt tính năng này nếu bạn đang sử dụng máy chủ HTTP/2 hoặc HTTP/3 (có lẽ bạn đang làm như vậy).
  • Gộp JS Từ Ngoài và Inline: Tắt. Chỉ bật nếu tính năng JS combine đang được bật, nhưng thực tế không nên kích hoạt tính năng này.
  • Tải JS Trì Hoãn: Bật tính năng trì hoãn. Tính năng này có thể mang lại kết quả tốt nhất, nhưng thường gây hỏng cho các trang web, vì vậy bạn cần thêm các loại trừ trì hoãn JS phổ biến trong phần cài đặt Điều chỉnh và loại trừ các tệp JS có vấn đề khác nếu cần. Tính năng trì hoãn vẫn tốt, nhưng tắt luôn là lựa chọn an toàn nhất.

Cài đặt JS Litespeed cache

Bước 6: Tối ưu HTML

Nên bật các cấu hình như trong ảnh.

Cách tối ưu HTML trên wordpress bằng litespeed cache
Bước 8.1 Litespeed

Bước 7: Cài đặt Media

  • Lazy Load: Tùy thuộc. Không thể lazu load hình ảnh background trong khi Perfmatters có thể sử dụng hình ảnh nền CSS. Tốt hơn nên sử dụng hình ảnh nền CSS nếu bạn có nhiều hình ảnh.
  • Trình Giữ Chỗ Hình Ảnh Cơ Bản: Sử dụng trình giữ chỗ hình ảnh trong thời gian hình ảnh đang tải.
  • Trình Giữ Chỗ Phản Hồi: Tùy thuộc vào việc có sử dụng trình giữ chỗ hình ảnh cơ bản hay không (giảm CLS).
  • SVG Giữ Chỗ Phản Hồi: Chỉ định tệp SVG để sử dụng làm trình giữ chỗ phản hồi.
  • Màu Chỗ Giữ Chỗ Phản Hồi: Màu xám mặc định mà LiteSpeed Cache sử dụng sẽ ổn.
  • Trình Tạo LQIP Trên Đám Mây: Bật. Hình ảnh chất lượng thấp hơn (do QUIC.cloud tạo ra) sẽ được sử dụng làm trình giữ chỗ trước khi hình ảnh chất lượng cao hơn được tải. Bạn nên tự kiểm tra.
  • Chất Lượng LQIP: Nếu cài đặt trước đó được bật, cài đặt này sẽ xác định chất lượng hình ảnh thấp hơn.
  • Kích Thước Tối Thiểu Của LQIP: 150×150 pixel là đủ. Chỉ áp dụng khi bật trình tạo đám mây LQIP, và LQIP sẽ chỉ được sử dụng khi hình ảnh lớn hơn kích thước này.
  • Tạo LQIP Ở Chế Độ Nền: Bật. LiteSpeed cho biết việc tắt tính năng này sẽ làm chậm tốc độ tải trang.
  • Tải Chậm Iframe: Bật. Tính năng này giúp tải chậm video, bản đồ và các iframe khác để cải thiện tốc độ.
  • Thêm Kích Thước Còn Thiếu: Bật. Thêm kích thước hình ảnh còn thiếu để thiết lập chiều rộng và chiều cao rõ ràng.

Hướng dẫn tối ưu Lazy Load hình ảnh, Trình giữ chỗ đáp ứng, Lazy Load Iframes
Cài đặt Lazy Load Media

Bước 8: Loại trừ Lazy Load ảnh LCP

  • Hình ảnh LCP nếu lazy load sẽ làm điểm LCP giảm rất thấp
  • Ô 1: Nhập link hình không muốn lazy load
  • Ô 2: Nhập html class của hình không muốn lazy load
  • Ô 3: Nhập class của thẻ HTML chứa hình không muốn lazyload

Cách Loại trừ Lazy Load ảnh LCP trong wordpress

Bước 9: Tối ưu Bot

  • Bật Chế độ khách và Tối ưu hóa Khách để áp dụng mức tối ưu maximum cho bot.
  • Tạo cache riêng cho bot với mức tối ưu cao nhất -> Bao gồm cả delay javascript -> cẩn thận cloaking nếu không kiểm soát tốt.
  • ** Đối với người dùng truy cập lần đầu, web sẽ kiểm tra có phải bot không và reload lại. Các lần sau không bị.

Tối ưu Bot để giảm delay trên wordpress

Bước 10: Quản lý Cache

  • Không xóa tất cả cache nếu thay đổi không áp dụng cho toàn bộ website
  • Thay vào đó, hãy xóa cache theo URL

Phần quản lý cache litespeed cache hiệu quả

Nhờ mấy mẹo này, site của tôi giờ đạt 100 điểm trên PageSpeed Insights!

Kết Quả Litespeed

Sai lầm thường gặp khi dùng LiteSpeed Cache

Dùng sai cách có thể làm site chậm hơn đấy! Đây là 3 lỗi mình từng mắc phải:

  1. Không tắt plugin cache cũ: Mình để lại WP Rocket, gây xung đột và làm site lỗi. Hãy xóa hết plugin cache khác trước khi dùng.
  2. Không tối ưu hình ảnh trước: Ảnh nặng làm site vẫn chậm dù có cache.
  3. Bỏ qua hosting: LiteSpeed Cache phát huy tối đa khi hosting của bạn dùng máy chủ LiteSpeed. Tránh được mấy lỗi này, bạn sẽ thấy hiệu quả ngay.

Kết luận

LiteSpeed Cache thực sự là “báu vật” miễn phí mà mình ước mình biết sớm hơn. Chỉ cần cài đặt đúng và áp dụng vài mẹo nhỏ, website của bạn sẽ nhanh như gió mà chẳng tốn nhiều công sức. Bạn đã thử LiteSpeed Cache chưa? Hãy để lại bình luận chia sẻ trải nghiệm của bạn nhé, hoặc nếu cần thêm mẹo, cứ hỏi mình!

(Gợi ý : Xem thêm các plugin SEO miễn phí cho WordPress: 3 plugin SEO WordPress phổ biến cho SEOer mà mình đã tổng hợp.)

Bài viết nổi bật