TTFB là gì? Tại sao trình duyệt và PageSpeed Insights khác nhau?
Bạn từng thắc mắc tại sao đo TTFB trên trình duyệt (F12) thì nhanh, nhưng Google PageSpeed Insights lại báo đỏ? Đó không phải lỗi công cụ — mà do ngữ cảnh đo lường khác nhau. Bài viết này giải thích sự khác biệt và cách tối ưu đúng cách.
TTFB là gì?
TTFB (Time to First Byte) là thời gian từ khi browser gửi request đến khi nhận byte đầu tiên từ server. Gồm 3 giai đoạn:
- Kết nối: DNS lookup, TCP handshake, SSL (HTTPS).
- Xử lý Server: Chạy PHP/NodeJS, truy vấn Database.
- Phản hồi: Byte đầu tiên truyền về browser.
Tại sao TTFB trên trình duyệt và PageSpeed khác nhau?
1. Khoảng cách địa lý
| Trình duyệt (F12) | PageSpeed Insights | |
|---|---|---|
| Location | Bạn đang ở VN | Mỹ hoặc Châu Âu |
| Latency | < 100ms | 200-300ms+ |
| Kết quả | TTFB thấp | TTFB cao |
Nếu server đặt ở VN và bạn test từ VN → khoảng cách ngắn → TTFB thấp.
Nhưng Google đo từ Mỹ → dữ liệu phải đi nửa vòng trái đất → TTFB cao hơn nhiều.
2. Lab Data vs Field Data
Google PageSpeed có 2 loại dữ liệu:
- Lab Data (PSI Lab): Mô phỏng thiết bị di động cấu hình trung bình + bóp băng thông 4G. Dùng để debug.
- Field Data (CrUX): Trung bình từ người dùng thật trong 28 ngày. Ảnh hưởng trực tiếp đến SEO.
Nếu khách của bạn dùng 4G yếu, nhiều region → Field Data sẽ cao hơn Lab Data.
3. Cấu hình thiết bị
- Trình duyệt: Dùng toàn bộ sức mạnh CPU/RAM máy bạn.
- PSI: Mô phỏng điện thoại tầm trung (1.8GHz, 4GB RAM).
Nên tin vào con số nào?
| Mục tiêu | Công cụ |
|---|---|
| Trải nghiệm người dùng | Trình duyệt F12, KeyCDN, Dotcom-tools |
| SEO (Google ranking) | PageSpeed Insights (Field Data) |
Trải nghiệm người dùng
Nếu khách hàng mục tiêu của bạn ở VN và họ thấy website nhanh → bạn đã thành công về mặt UX.
# Test TTFB từ nhiều location # KeyCDN: https://tools.keycdn.com/speed # Dotcom-tools: https://www.dotcom-tools.com/ # GTmetrix: https://gtmetrix.com/
SEO (Google Ranking)
Google dùng Field Data (CrUX) để xếp hạng. Dù khách thấy nhanh, nếu PSI đỏ → Google vẫn đánh giá thấp.
Mục tiêu: Cả hai đều “xanh” là tốt nhất.
Cách tối ưu TTFB
1. Dùng CDN
CDN đặt bản sao website ở nhiều location → người dùng ở Mỹ nhận từ server gần Mỹ nhất.
# Cloudflare, AWS CloudFront, Vercel Edge # Hoặc BunnyCDN (giá rẻ, location VN tốt)
2. Cache
Cache biến request PHP+SQL thành HTML tĩnh → TTFB giảm drámatically.
# TTFB trước: 2-3 giây # TTFB sau cache: 50-200ms # Nginx FastCGI Cache fastcgi_cache_path /var/cache/nginx levels=1:2 keys_zone=WP:100m inactive=60m;
3. Đặt Server gần người dùng
- Khách VN → đặt Singapore hoặc VN.
- Khách Mỹ → đặt US West hoặc US East.
- Đa region → dùng CDN.
4. Tối ưu Database
# Thêm index cho các cột thường query ALTER TABLE wp_posts ADD INDEX idx_post_status (post_status, post_date); # Dùng Redis Object Cache # Giảm thời gian query từ 500ms xuống 5ms
5. HTTP/2 và Keep-Alive
# Nginx
http {
keepalive_timeout 65;
keepalive_requests 100;
}
server {
http2 on;
}
Cách kiểm tra TTFB chuẩn xác
Trình duyệt
Mở Chrome Developer Tools (F12) → Network tab → tìm request đầu tiên (HTML) → xem Timing → Waiting (TTFB).
PageSpeed Insights
- PageSpeed Insights — đo Lab Data và Field Data
- Nhập URL → xem cả Lab Data và Field Data
- Field Data: xem phân bố (75th percentile)
Công cụ đa location
Mục tiêu TTFB
| TTFB | Đánh giá |
|---|---|
| < 200ms | ✅ Tốt |
| 200-500ms | ⚠️ Cần cải thiện |
| 500ms – 1s | ⚠️ Chậm |
| > 1s | ❌ Rất chậm |
Kết Luận
TTFB trình duyệt và PageSpeed khác nhau vì ngữ cảnh đo lường khác nhau:
- Trình duyệt: Đo từ location của bạn.
- PageSpeed: Đo từ server Google + mô phỏng thiết bị di động.
Chiến lược tối ưu:
- Ưu tiên UX → test tại location khách hàng.
- Ưu tiên SEO → tối ưu để PSI xanh.
- Tốt nhất: Cả hai đều xanh.
