Bỏ qua tới nội dung
Kiến thức Website· ·8 phút đọc

Tăng tốc website khi ngân sách eo hẹp (làm gì trước, làm gì sau)

Trần Trọng Luân
Tăng tốc website khi ngân sách eo hẹp (làm gì trước, làm gì sau)
Cỡ chữ

Nhiều người nghĩ web chậm là tại hosting rẻ, nên việc đầu tiên họ nghĩ tới là nâng gói. Thực tế phần lớn điểm chậm nằm ở chỗ chưa tối ưu chứ không phải thiếu phần cứng: ảnh nặng tải thẳng, không cache, font chặn render, JavaScript thừa. Đây đều là thứ sửa được mà gần như không tốn đồng nào. Web22 vận hành web22.dev trên LiteSpeed + Cloudflare và xác nhận: làm đúng thứ tự đòn bẩy quan trọng hơn việc trả tiền.

Đo trước, đừng đoán

Trước khi đụng vào bất cứ thứ gì, hãy đo để biết nút thắt thật sự nằm đâu. Hai công cụ miễn phí đủ dùng: PageSpeed Insights để đọc báo cáo Core Web Vitals (kết hợp dữ liệu thật từ người dùng) và Lighthouse trong Chrome DevTools để mô phỏng. Mục tiêu là đạt ngưỡng “Good” theo Google, đo ở phân vị 75 (p75 — 75% lượt truy cập đạt mức tốt):

Chỉ sốNghĩaNgưỡng “Good”
LCP (Largest Contentful Paint — phần tử lớn nhất hiện ra)Tốc độ tải≤ 2,5 giây
INP (Interaction to Next Paint — độ trễ phản hồi tương tác)Khả năng phản hồi≤ 200 mili-giây
CLS (Cumulative Layout Shift — độ xê dịch bố cục)Ổn định thị giác≤ 0,1

Lưu ý: INP đã chính thức thay FID làm Core Web Vital từ tháng 3/2024 — nếu tài liệu nào còn nhắc FID là đã cũ. INP cũng là chỉ số nhiều site trượt nhất hiện nay. Bạn có thể đọc thêm về bộ ba Core Web Vitals 2026 để hiểu từng chỉ số.

Bốn đòn bẩy miễn phí — làm theo thứ tự này

1. Cache trang (đòn bẩy lớn nhất, dễ nhất)

Cache trang biến trang động thành HTML tĩnh, server không phải dựng lại mỗi lượt truy cập — giảm thẳng TTFB (Time To First Byte — thời gian nhận byte đầu tiên), thứ kéo theo cả LCP. Trên hosting rẻ, đây là việc cho hiệu quả/công sức cao nhất. Plugin miễn phí làm tốt: LiteSpeed Cache (nếu host chạy LiteSpeed) hoặc W3 Total Cache / WP Super Cache cho Apache, Nginx. Bật page cache và để mặc định an toàn trước, rồi mới tinh chỉnh. Muốn hiểu cơ chế, xem cache phía máy chủ là gì.

2. Nén ảnh (đòn bẩy lớn thứ hai)

Ảnh chiếm khoảng một nửa trọng lượng trang trung bình và thường chính là phần tử LCP trên đa số trang. Đây là nơi cắt được nhiều ký nhất mà không tốn tiền. Ba việc cần làm:

  • Chuyển sang định dạng hiện đại: AVIF (nhỏ hơn JPEG ~50%) hoặc WebP — định dạng ảnh nhẹ hơn JPEG (~25–35%). Plugin miễn phí như Converter for Media làm tự động.
  • Lazy-load ảnh dưới màn hình đầu bằng loading="lazy" — nhưng tuyệt đối không lazy-load ảnh hero, vì nó làm LCP tệ đi. Với ảnh hero dùng fetchpriority="high" để trình duyệt tải sớm.
  • Khai báo widthheight để chống xê dịch bố cục (giúp CLS).
<!-- Ảnh hero: ưu tiên tải, KHÔNG lazy -->
<img src="hero.avif" width="1200" height="630" fetchpriority="high" alt="...">

<!-- Ảnh dưới fold: lazy-load -->
<img src="anh.avif" width="800" height="500" loading="lazy" alt="...">

3. Localize Google Font + font-display swap

Gọi font thẳng từ máy chủ Google thêm một vòng kết nối tới domain lạ, làm chậm hiển thị chữ. Tự host font (localize — đặt file font ngay trên server của bạn) cắt được vòng đó; định dạng WOFF2 là nhẹ nhất. Quan trọng không kém: thêm font-display swap để chữ hiện ngay bằng font hệ thống trong lúc font riêng tải về, tránh khoảng trắng chờ font. Đây đúng là cách web22.dev đang làm — không tốn tiền, chỉ tốn cấu hình.

@font-face{ 
  font-family: "Inter";
  src: url("/fonts/inter.woff2") format("woff2");
  font-display: swap; /* chữ hiện ngay, không chờ */
 }

4. Bật CDN Cloudflare (gói free)

CDN (Content Delivery Network — mạng phân phối nội dung) đặt bản sao file tĩnh ở máy chủ gần người dùng, giảm độ trễ. Gói free của Cloudflare đã đủ phục vụ phần lớn site nhỏ: CDN cơ bản, nén, HTTPS, chống tấn công cơ bản — không mất phí. Trỏ DNS qua Cloudflare, bật cache cho file tĩnh là xong. Xem hướng dẫn cấu hình CDN Cloudflare. Tính năng APO (cache cả trang động) là tuỳ chọn trả phí ~5 USD/tháng — chỉ cân nhắc sau khi đã làm hết phần miễn phí mà vẫn cần thêm.

Sơ đồ bốn đòn bẩy miễn phí tăng tốc website theo thứ tự: cache, nén ảnh, font và CDN
Làm bốn việc miễn phí này trước, hosting rẻ vẫn có thể nhanh.

Việc đáng chi tiền — khi nào

Sau khi vắt hết phần miễn phí mà vẫn chưa “Good”, lúc đó tiền mới đáng bỏ — và bỏ đúng chỗ:

Hạng mụcCân nhắc khi
Nâng gói hosting / đổi sang LiteSpeedTTFB vẫn cao dù đã cache — server yếu hoặc quá tải thật
Cloudflare APO (~5 USD/tháng)Lượng truy cập từ xa lớn, cần cache cả trang động ở rìa mạng
Plugin cache cao cấp (FlyingPress, WP Rocket)Bản free đã hết dư địa, cần tối ưu JS/CSS sâu hơn

Triết lý: chi tiền vào nút thắt đã đo được, không chi vào nỗi sợ mơ hồ “web chậm”.

Đừng quên JavaScript và CSS thừa

Sau bốn đòn bẩy lớn, nếu còn dư thời gian: defer các script không quan trọng để không chặn render, và minify JS, CSS (xoá khoảng trắng, ký tự thừa). Đây là tinh chỉnh, không phải đòn bẩy đầu tiên — làm sau cùng. Plugin cache miễn phí ở bước 1 thường gộp sẵn các tuỳ chọn này.

Sơ đồ so sánh việc miễn phí làm trước và việc đáng chi tiền khi tối ưu tốc độ web
Vắt kiệt việc miễn phí trước, chỉ chi tiền khi thật sự chạm trần.

Câu hỏi thường gặp

Hosting rẻ có thể đạt Core Web Vitals “Good” không?

Có, với phần lớn site nhỏ. Cache trang và CDN bù phần lớn hạn chế phần cứng. Hosting chỉ là nút thắt khi TTFB vẫn cao sau khi đã cache đúng.

Nên làm việc nào trước nếu chỉ có một buổi?

Bật cache trang và nén ảnh. Hai việc này cho hiệu quả cao nhất trên mỗi giờ công bỏ ra và đều miễn phí.

Cloudflare free có đủ không hay phải mua APO?

Gói free đủ cho đa số site nhỏ. APO chỉ đáng cân nhắc khi đã làm hết phần miễn phí mà vẫn cần cache trang động ở quy mô lớn.

Nếu đã làm hết các bước trên mà site vẫn chưa đạt ngưỡng, dịch vụ tối ưu tốc độ website của Web22 có thể đo và xử lý nút thắt còn lại cho bạn.

Đọc tiếp

Bài viết
cùng chủ đề.

Tất cả bài viết