TTFB thấp không đồng nghĩa website nhanh

TTFB đo được gì?

TTFB là khoảng thời gian từ lúc trình duyệt gửi request đến khi nhận được byte đầu tiên của response. Nó phản ánh:

• Thời gian DNS lookup, kết nối TCP, TLS handshake.
• Thời gian server xử lý request và bắt đầu gửi response.

TTFB thấp nghĩa là server phản hồi nhanh, kết nối mạng ổn định. Nhưng đó chỉ là giai đoạn khởi đầu trong cả quá trình tải trang.

Vì sao TTFB thấp mà site vẫn chậm?

1. Payload khổng lồ: Sau khi byte đầu tiên được gửi, trình duyệt vẫn phải nhận hàng MB dữ liệu. Một HTML 50KB + 4MB ảnh chưa nén = TTFB đẹp nhưng tổng thời gian tải thì tệ.
2. Render-blocking: CSS và JS chặn render khiến trang trắng xoá dù đã có dữ liệu. TTFB có thể là 100ms, nhưng người dùng vẫn chờ 3–4s mới thấy chữ.
3. Client-side bloat: Framework JS nặng nề, hydration chậm. TTFB thấp nhưng FCP (First Contentful Paint) và TTI (Time To Interactive) lại cao.
4. Third-party scripts: Quảng cáo, analytics, widget social kéo dài thời gian tải. Dù server chính nhanh, browser vẫn ì ạch.
5. Cache & CDN: Một request cache hit có thể cho TTFB thấp, nhưng request tiếp theo (ảnh, script, font) bị miss → overall vẫn chậm.

Ví dụ thực tế

Website A bật CDN, cache HTML nên TTFB chỉ 80ms. Nhưng trang có:

• Ảnh sản phẩm 3MB chưa nén.
• 5 file JS tổng cộng 1.5MB, load đồng bộ.
• Google Fonts gọi từ 3 domain khác nhau.

Kết quả: TTFB đẹp trên report, nhưng LCP (Largest Contentful Paint) tới 4.5s và người dùng vẫn than “web chậm quá”.

Những chỉ số cần quan tâm ngoài TTFB

• FCP (First Contentful Paint): Thời gian hiển thị nội dung đầu tiên.
• LCP (Largest Contentful Paint): Thời gian hiển thị nội dung chính, ảnh/tiêu đề lớn.
• CLS (Cumulative Layout Shift): Độ ổn định layout khi tải.
• TTI (Time To Interactive): Thời gian trang sẵn sàng cho thao tác người dùng.
• Core Web Vitals: Bộ tiêu chuẩn Google dùng để đánh giá UX thực tế.

Làm gì để website thực sự nhanh?

• Tối ưu tải tài nguyên: Nén ảnh, dùng WebP/AVIF, lazy-load, combine/minify CSS & JS.
• Giảm render-blocking: Dùng async và defer cho JS, preload CSS quan trọng.
• Giảm client-side JS: Tránh nhồi framework nặng nếu chỉ cần render tĩnh.
• Tối ưu font: Dùng subset, preload, và self-host.
• Monitor trải nghiệm thực tế: Dùng công cụ như Lighthouse, WebPageTest, hoặc RUM (Real User Monitoring).

Kết luận

TTFB là một chỉ số quan trọng, nhưng chỉ là mảnh ghép nhỏ trong bức tranh tốc độ website. Tập trung vào TTFB mà bỏ quên tải tài nguyên, render, và UX tổng thể sẽ tạo ra ảo tưởng về hiệu năng. Muốn website thực sự nhanh, cần quan tâm toàn bộ chuỗi chỉ số từ server đến trình duyệt, đặc biệt là Core Web Vitals.