Bir web sitesinin kullanıcı deneyimini ve SEO performansını belirleyen en önemli kriterlerden biri, sayfanın ne kadar hızlı ve sorunsuz tepki verdiğidir. Bu noktada devreye giren metriklerden biri de Total Blocking Time (TBT)’dir.
TBT (Toplam Bloklama Süresi), bir web sayfası yüklenirken kullanıcı etkileşimlerine cevap veremeyecek kadar meşgul olduğu süreyi milisaniye cinsinden ölçen bir performans metriğidir.
Daha teknik bir ifadeyle:
Ana iş parçacığını (main thread) 50 ms’den uzun süre meşgul eden görevlerin toplam süresidir.
Örneğin: Sayfa yüklenirken bir JavaScript dosyası 100 ms süren bir işlem yapıyorsa, bu işlem 50 ms eşik değerinin üzerinde olduğu için 50 ms’lik kısmı TBT’ye dahil edilir.
TBT Neyi Gösterir?
TBT, bir sayfanın ilk açılış sürecinde kullanıcı etkileşimlerine (tıklama, kaydırma, yazma gibi) ne kadar süreyle cevap veremediğini ölçer. Yani kullanıcı bir butona tıkladığında sitenin bu tıklamaya ne kadar gecikmeli yanıt verdiğini gösterir.
TBT, özellikle JavaScript yoğunluğu fazla olan siteler için kritik bir metriktir.
TBT ve FID Arasındaki İlişki
- FID (First Input Delay), gerçek kullanıcıların ilk etkileşime geçtiklerinde yaşadıkları gecikmeyi ölçer.
- TBT, laboratuvar ortamlarında (test araçlarında) FID’nin yerine kullanılır.
Yani:
Gerçek kullanıcı deneyiminde FID ölçülürken,
Test ortamlarında TBT ölçülür.
TBT ne kadar düşükse, FID de genellikle o kadar iyidir.
TBT için İdeal Değer Nedir?
Google’ın tavsiye ettiği TBT değerleri:
- ✅ 0 – 200 ms → İyi
- ⚠️ 200 – 600 ms → İyileştirilmeli
- ❌ 600 ms ve üzeri → Zayıf
Amaç, sayfanın toplam bloklama süresini 200 ms’nin altında tutmaktır.
TBT Nasıl Ölçülür?
TBT’yi ölçmek için kullanabileceğiniz araçlar:
- Google PageSpeed Insights
- Lighthouse (Chrome DevTools içinde)
- GTmetrix
- WebPageTest
- Chrome User Experience Report (CrUX)
Bu araçlar, sayfanızın hangi JavaScript görevlerinin TBT’yi yükselttiğini detaylı olarak raporlar.
TBT’yi Artıran Başlıca Nedenler
- Uzun süreli JavaScript işlemleri
- Bloklayıcı büyük JS dosyaları (örneğin üçüncü parti eklentiler)
- Karmaşık hesaplamalar, animasyonlar
- Render-blocking kaynaklar
- Fazla kullanılan dış kaynaklı script’ler (reklam, analiz araçları vs.)
TBT Nasıl İyileştirilir?
1. JavaScript Optimizasyonu Yapın
- Uzun çalışan görevleri küçük parçalara bölün.
async
vedefer
özniteliklerini kullanarak yüklemeyi erteleyin.- Kullanılmayan JavaScript kodlarını silin.
- Üçüncü parti script’leri sınırlandırın veya geciktirin.
2. Kodları Parçalayın (Code Splitting)
- Sayfa açılışında sadece gerekli olan kodları yükleyin.
- Geri kalan kodları sayfa etkileşimi sonrasına bırakın (lazy load JS).
3. Web Worker Kullanın
- Ağır işlemleri tarayıcının ana iş parçacığından ayırmak için Web Worker teknolojisini kullanın.
4. Kullanıcıya Önemli İçeriği Önceliklendirin
- “Critical Rendering Path” optimizasyonlarıyla sayfa yüklemesini kullanıcı için daha hissedilebilir hale getirin.
5. Lighthouse İpuçlarını Takip Edin
- Lighthouse raporundaki “Avoid long main-thread tasks”, “Reduce JavaScript execution time” gibi uyarıları dikkate alın ve düzeltin.
TBT’nin SEO’ya Etkisi Var mı?
Evet!
Google, Core Web Vitals kapsamında FID’yi bir sıralama sinyali olarak kullanır. TBT, FID’nin laboratuvar karşılığı olduğundan dolayı TBT’nin iyileştirilmesi doğrudan SEO’yu olumlu etkiler.
Ayrıca kullanıcılar, yavaş tepki veren bir sayfadan hemen çıkma eğiliminde olduğundan, bounce rate (hemen çıkma oranı) da düşer, dönüşüm oranları artar.
TBT, modern web performans metrikleri arasında çok önemli bir yere sahiptir. Sayfanızda kullanıcı etkileşimini engelleyen ağır işlemler varsa, bu hem kullanıcı memnuniyetini hem de sıralamanızı olumsuz etkileyebilir.
Bu yüzden TBT’yi düzenli olarak ölçmeli ve iyileştirme adımlarını uygulamalısınız.