Digital Transformation
TTFB (Time to First Byte)
TTFB adalah waktu yang dibutuhkan browser untuk menerima byte pertama dari server sejak request dikirim, indikator awal kecepatan website.
TL;DR: TTFB (Time to First Byte) adalah waktu yang dibutuhkan browser untuk menerima byte pertama dari server setelah mengirim request. Per April 2026, Google menyarankan TTFB di bawah 800 milidetik untuk pengalaman optimal, dan menjadi sinyal pendukung Core Web Vitals.
Apa itu TTFB?
TTFB mengukur waktu antara browser mengirim permintaan halaman dan menerima byte pertama dari server. Komponennya mencakup waktu DNS lookup, koneksi TCP, negosiasi TLS, dan pemrosesan server. TTFB bukan metrik Core Web Vitals langsung, tapi memengaruhi [LCP](/glosarium/lcp) secara signifikan karena byte pertama yang lambat menunda seluruh proses render.
Analogi sederhana: kalau LCP adalah waktu makanan sampai di meja, TTFB adalah waktu pelayan datang membawa nampan kosong dari dapur. Selama itu masih lama, hidangan utama pasti telat.
Cara Mengukur TTFB
| Tool | Sumber Data | Use Case |
|---|---|---|
| Chrome DevTools (Network tab) | Lab data, satu device | Debugging spesifik |
| PageSpeed Insights | Lab + field (CrUX) | Audit gabungan |
| CrUX Dashboard | Real user (28 hari) | Monitoring agregat |
| Vercel Speed Insights | Real user produksi | Monitoring per-route |
Threshold standar Google per April 2026: di bawah 800 ms baik, 800-1800 ms perlu perbaikan, di atas 1800 ms buruk.
Kenapa Penting?
TTFB tinggi mengindikasikan masalah di layer server, hosting, atau DNS. Untuk pasar Indonesia yang sebagian besar trafiknya dari koneksi mobile, setiap 100 ms tambahan TTFB bisa menambah 0,3-0,5 detik di LCP. Praktik standar industri yang saya pakai di proyek client menunjukkan bahwa pindah ke edge runtime atau mengaktifkan ISR sering memangkas TTFB sampai 40-60%.
Pertanyaan Umum
Apakah TTFB sama dengan kecepatan loading?
Tidak. TTFB hanya mengukur byte pertama. Kecepatan loading total mencakup TTFB plus waktu unduh seluruh dokumen, render HTML, eksekusi JavaScript, dan paint elemen utama.
Bagaimana cara menurunkan TTFB di Next.js?
Tiga langkah praktis: pindah ke edge runtime untuk halaman dinamis, gunakan ISR atau SSG untuk halaman statis, dan aktifkan CDN di depan origin.
Istilah Terkait