Tốc độ tải ảnh hưởng trực tiếp đến doanh thu

Google đã chứng minh: mỗi giây tải chậm thêm làm giảm tỷ lệ chuyển đổi khoảng 7%. Với trang bán hàng 100 đơn/ngày, chậm 1 giây = mất 7 đơn mỗi ngày, khoảng 2.500 đơn mỗi năm. Tối ưu tốc độ là đầu tư có ROI cao nhất trong tất cả các cải tiến kỹ thuật.

Công cụ đo tốc độ miễn phí

Trước khi tối ưu, hãy đo điểm baseline. Hai công cụ miễn phí tốt nhất:

  • Google PageSpeed Insights (pagespeed.web.dev): Cho điểm 0–100 và danh sách cụ thể cần cải thiện
  • GTmetrix (gtmetrix.com): Hiển thị waterfall chi tiết, cho thấy file nào load chậm nhất

Target cho trang bán hàng: điểm Mobile ≥ 70, LCP (Largest Contentful Paint) dưới 2.5 giây.

Nguyên nhân #1: Ảnh quá nặng

Ảnh chiếm 60–80% dung lượng tải của hầu hết trang web. Đây là nơi tối ưu dễ nhất và hiệu quả nhất.

Bước 1: Compress ảnh trước khi upload

Dùng Squoosh (squoosh.app — miễn phí, chạy trên trình duyệt): Upload ảnh, chọn định dạng WebP, kéo quality xuống 75–80%. Ảnh 1MB thường giảm còn 100–200KB mà mắt thường không phân biệt được.

Bước 2: Dùng định dạng WebP

WebP nhỏ hơn JPEG 25–34% và nhỏ hơn PNG 26% với cùng chất lượng. Tất cả trình duyệt hiện đại (Chrome, Safari, Firefox) đều hỗ trợ WebP.

Bước 3: Đặt kích thước đúng với display size

Nếu ảnh chỉ hiển thị 400px trên trang, không cần upload ảnh 2000px. Resize trước khi upload: chiều rộng hiển thị × 2 (cho màn hình Retina) là đủ.

Lazy loading ảnh — 5 giây để implement

Lazy loading trì hoãn việc tải ảnh nằm ngoài vùng nhìn thấy cho đến khi người dùng cuộn đến. Thêm thuộc tính này vào thẻ img trong HTML block:

<img src="..." loading="lazy" alt="..." style="max-width:100%">

Một attribute duy nhất, không cần JavaScript. Được hỗ trợ bởi 95%+ trình duyệt hiện đại.

Tránh blocking resources trong HTML block

  • Không nhúng Google Fonts: Dùng font stack có sẵn (Arial, system-ui) hoặc kế thừa font từ CMS host
  • Không có script tag: AITaoPage đã strip script khi xuất HTML — đây cũng là lý do block tải nhanh hơn so với builder có JavaScript
  • Dùng CDN cho ảnh: Upload ảnh lên CDN (Cloudflare Images, imgix) thay vì server riêng để giảm latency

Kết quả thực tế sau tối ưu

Một trang product landing page điển hình sau khi áp dụng đầy đủ:

  • Dung lượng trang: 2.3MB → 480KB (giảm 79%)
  • Thời gian tải mobile: 4.2 giây → 1.8 giây
  • PageSpeed Mobile: 42 → 87
  • Tỷ lệ bounce giảm 23%

Kết luận

Tối ưu tốc độ không cần kỹ năng lập trình. Compress ảnh + chuyển sang WebP + thêm lazy loading = 80% hiệu quả tối ưu với 20% công sức. Làm điều này cho mọi HTML block trước khi dán vào CMS — kết quả thấy được ngay trên điểm PageSpeed và tỷ lệ chuyển đổi.