Performans · · 15 dk okuma

Core Web Vitals 2026: LCP, INP ve CLS Optimizasyon Rehberi

Google'ın 2026 güncellemesiyle INP artık resmi metrik. LCP'yi 0.9 saniyenin altına düşürme, CLS'i sıfıra yaklaştırma ve Lighthouse 100/100 skoru için uygulama planı.

← Tüm Yazılar

LCP iyileştirme

En büyük görünür elemanı hızlandırmak için kritik CSS inline'a alınmalı, font preload uygulanmalı ve render-blocking script'ler azaltılmalıdır. LCP hedefi: 0.9 saniyenin altı. Hero görselleri için fetchpriority="high" ve loading="eager" kombinasyonu kullanın.

INP odağı

  • Uzun ana thread işlerini parçalayın — her görev 50ms altında kalmalı
  • Event handler ağırlığını azaltın, heavy computation'ı Web Worker'a taşıyın
  • Input aksiyonlarında hızlı görsel geri bildirim verin
  • React/Vue gibi framework'lerde gereksiz re-render'ları memo ile önleyin

CLS kontrolü

Görsellere mutlaka boyut tanımı yapın (width ve height attribute'ları), dinamik alanlara placeholder ekleyin ve stabil tipografi için font-display: swap kullanın. Reklam alanları için sabit boyutlu container'lar tanımlayın. Hedef CLS skoru: 0.1'in altı.