TTFB nedir?
TTFB, bir kaynak isteği ile yanıtın ilk baytının gelmeye başlaması arasındaki süreyi ölçen bir metriktir.
startTime ile responseStart arasında geçen süreyi ölçer.
TTFB, aşağıdaki istek aşamalarının toplamıdır:
- Yönlendirme süresi
- Service Worker başlatma süresi (varsa)
- DNS araması
- Bağlantı ve TLS iletişimi
- Yanıtın ilk baytı gelene kadar istek
Bağlantı kurulum süresinde ve arka uçta gecikmenin azaltılması TTFB'nizi düşürebilir.
TTFB'nin diğer tanımları
Önceki tanım geleneksel tanım olsa da İlk İpuçları'nın kullanıma sunulmasıyla "ilk bayt" olarak kabul edilenler tartışmaya açıldı. firstInterimResponseStart, responseStart için bunların ayırt edilebilmesi için yeni bir zamanlama girişidir ancak bu yalnızca Chrome ve Chromium tabanlı tarayıcılarda desteklenir. Bu nedenle, Erken İpuçları da dahil olmak üzere bazı tarayıcılar ve araçlar (CrUX dahil), ilk baytlar alınana kadar ölçüm yapar.
Erken İpuçları, erken yanıt vermeye daha yeni bir örnektir. Bazı sunucular, ana gövde kullanılabilir olmadan önce belge yanıtının temizlenmesine izin verir. Bu işlem, yalnızca HTTP üstbilgileriyle veya <head> öğesi ile gerçekleştirilebilir. Bunların her ikisi de Erken İpuçları'na benzer olarak kabul edilebilir ve böylece TTFB'nin ne ölçtüğünün tanımını da bulanıklaştırır.
Dokümanla ilgili işlem yapılabilir verilerin "ilk baytlarının" tarayıcı tarafından ne zaman alındığının bir ölçüsü olarak, tüm bu tanımlar geçerli kabul edilebilir. Tam yanıt biraz daha zaman alacaksa verileri erkenden geri göndermenin gerçek bir değeri vardır. Buradaki en önemli nokta, kullandığınız aracın hangi ölçümün olduğunu ve bunun ölçülen platformdan nasıl etkilendiğini anlamaktır. Bu, hangi özelliklerin kullanıldığına ve bunun kullanılan TTFB ölçümünü nasıl etkilediğine bağlı olarak farklı platformlar veya teknolojiler arasında TTFB'yi karşılaştırmayı zorlaştırır.
TTFB de genellikle sunucu veya ana makine yanıt süresinin bir göstergesi olarak kabul edilir. Bununla birlikte, yönlendirme süresi gibi doğrudan kontrol dışındaki faktörlerden (ör. bir CDN tarafından önbellek isabetinden sunulup sunulmaması veya kaynak sunucuya daha uzun bir yolculuk gerçekleştirmesi gerekip gerekmediği) etkilenir. Bu durum özellikle saha verilerinde belirgindir. Nihai URL genellikle test edildiği ve önbelleğe alma değişikliklerini çoğu zaman tekrar tekrar olumsuz etkilediği için laboratuvar testleri bu faktörlerden genellikle daha az etkilenir. Lighthouse, bu durumu daha açık hale getirmek için TTFB yerine sunucu yanıt süresini bildirir, ancak diğer laboratuvar araçları bunu yapmayabilir.
İyi bir TTFB puanı nedir?
TTFB, First Contentful Paint (FCP) ve Largest Contentful Paint (LCP) gibi kullanıcı odaklı metriklerden önce geldiğinden, kullanıcıların 75. yüzdelik diliminin "iyi" eşiğinde bir FCP ile karşılaşması için sunucunuzun gezinme isteklerine yeterince hızlı yanıt vermesi önerilir. Kaba bir kılavuz olarak, çoğu sitenin 0,8 saniye veya daha kısa bir TTFB'ye sahip olması gerekir.
TTFB nasıl ölçülür?
TTFB, laboratuvarda veya sahada aşağıdaki yöntemlerle ölçülebilir.
Alan araçları
Laboratuvar araçları
- Chrome Geliştirici Araçları'nın ağ panelinde
- WebPageTest
JavaScript'te TTFB'yi ölçme
Gezinme Timing API'si ile tarayıcıda gezinme isteklerinin TTFB'sini ölçebilirsiniz. Aşağıdaki örnekte, bir navigation girişini işleyen ve bunu konsola kaydeden bir PerformanceObserver işleminin nasıl oluşturulacağı gösterilmektedir:
new PerformanceObserver((entryList) => {
const [pageNav] = entryList.getEntriesByType('navigation');
console.log(`TTFB: ${pageNav.responseStart}`);
}).observe({
type: 'navigation',
buffered: true
});
web-vitals JavaScript kitaplığı ayrıca tarayıcıda TTFB'yi daha kısa ve öz bir şekilde ölçebilir:
import {onTTFB} from 'web-vitals';
// Measure and log TTFB as soon as it's available.
onTTFB(console.log);
Kaynak isteklerini ölçme
TTFB, yalnızca gezinme istekleri için değil, tüm istekler için geçerlidir. Özellikle çapraz kaynak sunucularda barındırılan kaynaklar, bu sunucularla bağlantı kurma ihtiyacı nedeniyle gecikmeye neden olabilir. Alandaki kaynaklar için TTFB'yi ölçmek için bir PerformanceObserver içinde Resource Timing API'yi kullanın:
new PerformanceObserver((entryList) => {
const entries = entryList.getEntries();
for (const entry of entries) {
// Some resources may have a responseStart value of 0, due
// to the resource being cached, or a cross-origin resource
// being served without a Timing-Allow-Origin header set.
if (entry.responseStart > 0) {
console.log(`TTFB: ${entry.responseStart}`, entry.name);
}
}
}).observe({
type: 'resource',
buffered: true
});
Önceki kod snippet'i, gezinme isteği için TTFB'yi ölçmek için kullanılana benzer, ancak 'navigation' girişlerini sorgulamak yerine 'resource' girişleri için sorgu gönderirsiniz. Ayrıca, bağlantı zaten açık olduğu veya bir kaynağın önbellekten anında alındığı için birincil kaynaktan yüklenen bazı kaynakların 0 değeri döndürebileceği de hesaba katılır.
TTFB nasıl iyileştirilir?
Sitenizin TTFB'sini iyileştirme konusunda yardım için TTFB'yi optimize etme ile ilgili ayrıntılı kılavuzumuza bakın.