Total Blocking Time (TBT) yüksek: ana iş parçacığını ne kilitliyor?

Sayfa görünüyor ama kaydırmaya veya tıklamaya çalıştığınızda bir süre tepki vermiyor. Tarayıcının ana iş parçacığı, büyük JavaScript paketlerini çalıştırmakla meşgul.

KTYAPTECH SEO Analyzer bu sorunu PERF-HIGH-TBT-LAB-001 koduyla, “Yüksek Total Blocking Time (lab)” başlığı altında ve orta önem derecesiyle raporlar (Performans). Bu rehber, bulgunun ne anlama geldiğini, neden önemli olduğunu ve adım adım nasıl düzeltileceğini anlatıyor.

Yüksek Total Blocking Time nedir?

Total Blocking Time, First Contentful Paint ile etkileşime hazır olma arasındaki sürede, 50 milisaniyeden uzun her görevin 50 milisaniyeyi aşan kısmının toplamıdır. Lighthouse puanında en yüksek ağırlığa sahip metriklerden biridir ve INP ile yakından ilişkilidir.

Neden önemli? SEO ve kullanıcı deneyimine etkisi

Yüksek TBT, kullanıcı etkileşimlerinin gecikmesi, yani kötü INP demektir. Özellikle orta seviye telefonlarda ağır JavaScript'in etkisi çok belirgindir.

Sorun nasıl tespit edilir?

• SEO Analyzer raporundaki “Yüksek Total Blocking Time (lab)” bulgusunu inceleyin.
• PageSpeed Insights'ta “Ana iş parçacığı çalışmasını en aza indirin” ve “JavaScript yürütme süresini azaltın” önerilerini görün.
• DevTools Performans panelinde uzun görevleri (kırmızı üçgenli) ve hangi betiklerden geldiklerini bulun.

Adım adım çözüm

1. Uzun görevlerin kaynağı olan betikleri belirleyin.
2. JavaScript paketini rota ve bileşen bazında bölün; yalnızca gereken kodu yükleyin.
3. Kullanılmayan kodu ve gereksiz bağımlılıkları kaldırın.
4. Etkileşim gerektirmeyen bölümleri sunucuda render edip istemciye JavaScript göndermeyin.
5. Üçüncü taraf betikleri azaltın ve sayfa yüklendikten sonra çalıştırın.
6. Kaçınılmaz uzun işleri parçalara bölün veya Web Worker'a taşıyın.

Hidrasyon maliyeti

Sunucuda render edilen sayfaların istemcide etkileşimli hale getirilmesi (hidrasyon) büyük bir uzun görev oluşturabilir. Sunucu bileşenleri, kısmi hidrasyon ve adacık (islands) mimarileri bu maliyeti azaltır.

Sık yapılan hatalar

• Tüm uygulamayı tek bir JavaScript paketi olarak göndermek.
• Kullanılmayan kütüphaneleri projede bırakmak.

Düzeltmeyi nasıl doğrularsınız?

• Lighthouse'ta TBT'nin 200 ms civarına düştüğünü görün.
• SEO Analyzer'ı yeniden çalıştırın.

Sık sorulan sorular

TBT ile INP arasındaki ilişki nedir?

TBT laboratuvarda ölçülür ve ana iş parçacığının ne kadar meşgul olduğunu gösterir; INP ise gerçek kullanıcı etkileşimlerinin tepki süresidir. TBT'yi azaltmak genellikle INP'yi de iyileştirir.

İyi TBT değeri nedir?

Lighthouse mobil ölçümlerde 200 milisaniyenin altını iyi kabul eder.

Özet

Yüksek TBT, ana iş parçacığının JavaScript ile kilitlendiğini gösterir. Kodu bölün, kullanılmayanı kaldırın, etkileşimsiz bölümleri sunucuda bırakın ve üçüncü taraf betikleri azaltın.

Sitenizde bu ve benzeri sorunların olup olmadığını görmek için KTYAPTECH Ücretsiz SEO Analizi aracını kullanabilirsiniz: rapordaki her bulgunun yanında, sorunu anlatan çözüm rehberine giden bir bağlantı bulunur.