Core Web Vitals INP (Interaction to Next Paint) Nedir?

Sayfanız hızlı açılıyor ama bir butona tıklayınca tepki vermesi saniyeler mi sürüyor? Google'ın Mart 2024'te FID'in yerine aldığı INP metriği tam olarak bu gecikmeyi ölçer. Bu rehberde Core Web Vitals INP'nin ne olduğunu, nasıl okunacağını ve nasıl düzeltileceğini adım adım bulacaksınız.

İçindekiler

• Core Web Vitals INP
• Core Web Vitals Nedir
• Core Web Vitals Ne İşe Yarar
• Core Web Vitals Nasıl Çalışır
• Core Web Vitals Metrikleri
• Core Web Vitals Metrics: Eşik Değerleri
• Core Web Vitals Nasıl Kullanılır
• Core Web Vitals Optimization: INP Nasıl Düzeltilir
• Sonraki Adım

**Core Web Vitals INP**

Interaction to Next Paint (INP), kullanıcı bir sayfayla etkileşime girdikten sonra ekranın görsel olarak güncellenmesine kadar geçen süreyi ölçer. Tıklama, dokunma ve klavye girdileri hesaba katılır; kaydırma ve üzerine gelme (hover) katılmaz.

Metrik, sayfa ömrü boyunca yapılan tüm etkileşimleri izler ve genellikle en yavaş olana yakın değeri raporlar. Yani tek bir hızlı tıklama sizi kurtarmaz; sayfanın genel tepkiselliği önemlidir.

INP üç aşamadan oluşur:

1. Giriş gecikmesi: Tarayıcının olayı işlemeye başlamasını bekleyen süre.
2. İşlem süresi: Olay yöneticilerinin (event handler) çalışma süresi.
3. Sunum gecikmesi: Tarayıcının sonraki kareyi çizmesi için geçen süre.

**Core Web Vitals Nedir**

Core Web Vitals, Google'ın kullanıcı deneyimini ölçmek için tanımladığı üç temel performans metriğidir: yükleme hızı, etkileşim tepkisi ve görsel kararlılık. Sayfa deneyimi sinyallerinin ölçülebilir kısmını oluşturur.

Bu metrikler gerçek kullanıcı verisine (CrUX raporu) dayanır. Laboratuvar testleri yol gösterir, ancak Google'ın değerlendirmesinde sahadaki veri belirleyicidir.

**Core Web Vitals Ne İşe Yarar**

Core Web Vitals, sitenizin gerçek ziyaretçiler için ne kadar hızlı, tepkili ve stabil olduğunu somut sayılarla gösterir. Sorunu "site yavaş" gibi belirsiz bir hisse bırakmaz, hangi alanın bozuk olduğunu işaret eder.

• Arama sıralamasında sayfa deneyimi sinyali olarak değerlendirilir; tek başına belirleyici değildir, içerik uygunluğu hâlâ önceliklidir.
• Dönüşüm kaybına yol açan yavaş formları, menüleri ve sepet butonlarını ortaya çıkarır.
• Teknik ekip için önceliklendirilebilir bir iş listesi sağlar.

Bilgi: İyi skor tek başına sıralama garantisi vermez. Ama kötü skor, özellikle rekabetin yoğun olduğu sorgularda dezavantaja dönüşebilir.

**Core Web Vitals Nasıl Çalışır**

Google, Chrome kullanıcılarından anonim performans verisi toplar ve sayfaları son 28 günlük verinin 75. yüzdelik dilimine göre değerlendirir. Yani ziyaretçilerinizin en az %75'i "iyi" deneyim yaşıyorsa metrik geçer.

Bu veri Search Console'daki Core Web Vitals raporunda ve PageSpeed Insights'ta görünür. Trafik azsa sayfa bazlı veri görünmeyebilir; bu durumda origin (alan adı) bazlı veri kullanılır.

Düzeltme yaptıktan sonra sonuçların yansıması yaklaşık 28 gün sürer. Bu yüzden değişiklikleri not alıp sabırla izlemek gerekir.

**Core Web Vitals Metrikleri**

Güncel Core Web Vitals seti üç metrikten oluşur: LCP, INP ve CLS. FID, Mart 2024'te INP ile değiştirildi.

**Core Web Vitals Metrics: Eşik Değerleri**

INP için "iyi" eşik 200 milisaniye ve altıdır; 500 ms üzeri ise "kötü" kabul edilir. Değerler Google'ın web.dev dokümantasyonundaki yayımlanmış sınırlardır.

**Core Web Vitals Nasıl Kullanılır**

Önce gerçek kullanıcı verisini okuyun, sonra laboratuvar araçlarıyla sorunun nedenini bulun. Sıra tersine çevrilirse yanlış yerde zaman kaybedersiniz.

1. Search Console: Core Web Vitals raporunda sorunlu URL gruplarını görün.
2. PageSpeed Insights: Sayfanın saha (field) verisini inceleyin.
3. Chrome DevTools Performance paneli: Yavaş etkileşimi kaydedip uzun görevleri bulun.
4. web-vitals JavaScript kütüphanesi: Kendi sitenizde gerçek kullanıcı INP verisi toplayın.

İpucu: Lighthouse laboratuvarda INP ölçmez; yerine Total Blocking Time (TBT) gösterir. INP için gerçek etkileşim gerekir.

**Core Web Vitals Optimization: INP Nasıl Düzeltilir**

INP'yi düzeltmenin özü, ana iş parçacığını (main thread) meşgul eden uzun görevleri küçültmektir. 50 ms üzerindeki her görev, tarayıcının kullanıcıya yanıt vermesini geciktirebilir.

JavaScript yükünü azaltın

Kullanılmayan kodu temizleyin, üçüncü taraf betikleri (chat widget, sosyal medya eklentileri, reklam kodları) sorgulayın. Gerekmeyen betiği kaldırmak çoğu zaman en etkili iyileştirmedir.

Uzun görevleri bölün

Ağır işlemleri küçük parçalara ayırıp aralarında tarayıcıya nefes aldırın. setTimeout ya da destekleyen tarayıcılarda scheduler.yield() bu iş için kullanılabilir.

DOM boyutunu küçültün

Çok büyük DOM ağacı, her güncellemede stil ve yerleşim hesabını yavaşlatır. Gereksiz iç içe elemanları sadeleştirin.

Olay yöneticilerini hafif tutun

Tıklamada yapılması zorunlu olmayan işleri (analitik gönderimi gibi) sonraya erteleyin. Kullanıcıya önce görsel geri bildirim verin.

Sunucu ve hosting tarafını unutmayın

INP büyük ölçüde istemci tarafı bir metrik olsa da yavaş sunucu yanıtı, geç yüklenen betikler nedeniyle etkileşim anında hâlâ meşgul olan sayfaya yol açabilir. Güncel PHP sürümü, önbellekleme ve yeterli kaynak sunan bir hosting altyapısı bu yükü azaltır. WordPress kullanıyorsanız eklenti sayısını da gözden geçirin.

**Sonraki Adım**

INP, sitenizin kullanıcıya ne kadar hızlı karşılık verdiğini gösteren, ölçülebilir ve düzeltilebilir bir metriktir. Önce Search Console'dan sorunlu sayfaları belirleyin, sonra uzun görevleri tek tek azaltın.

Altyapı tarafında performansı etkileyen sunucu ve hosting seçenekleri için netlen.com.tr üzerindeki hizmetleri inceleyebilir, teknik sorularınız için destek ekibiyle iletişime geçebilirsiniz.