INP (Interaction to Next Paint) nedir, nasıl iyileştirilir?

Kullanıcı “Sepete ekle”ye dokunuyor ve bir an hiçbir şey olmuyor. Tekrar dokunuyor, sonra iki kez eklendiğini görüyor. Bu gecikme, INP metriğinin ölçtüğü şeydir.

KTYAPTECH SEO Analyzer bu sorunu CWV-FIELD-INP-POOR-001 koduyla, “Gerçek ziyaretçilerde INP kötü” başlığı altında ve yüksek önem derecesiyle raporlar (Core Web Vitals). Bu rehber, bulgunun ne anlama geldiğini, neden önemli olduğunu ve adım adım nasıl düzeltileceğini anlatıyor.

Kötü INP nedir?

Interaction to Next Paint, sayfa ziyareti boyunca yapılan tıklama, dokunma ve tuş basma etkileşimlerinin, bir sonraki görsel güncellemeye kadar geçen süresini ölçer ve en kötülerden birini raporlar. İyi değer 200 milisaniye veya altıdır.

INP, 2024'te First Input Delay'in (FID) yerini aldı ve yalnızca ilk etkileşimi değil, tüm ziyaret boyunca yaşanan etkileşimleri kapsar.

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

Yavaş tepki veren bir arayüz, kullanıcıya sitenin bozuk olduğu hissini verir; çift tıklamalara, form hatalarına ve terk edilen işlemlere yol açar. INP, Core Web Vitals değerlendirmesinin parçasıdır.

Sorun nasıl tespit edilir?

• SEO Analyzer raporundaki “Gerçek ziyaretçilerde INP kötü” bulgusunu inceleyin.
• Chrome DevTools Performans panelinde etkileşimleri kaydedip uzun görevleri bulun.
• web-vitals kütüphanesinin attribution sürümüyle hangi etkileşimin ve hangi betiğin yavaş olduğunu toplayın.

Adım adım çözüm

1. En yavaş etkileşimleri ve onlara neden olan betikleri belirleyin.
2. Uzun JavaScript görevlerini daha küçük parçalara bölün ve ana iş parçacığına düzenli olarak nefes aldırın (ör. scheduler.yield veya setTimeout ile).
3. Olay işleyicisinde önce görsel geri bildirimi (buton durumu, yükleniyor göstergesi) verin, ağır işi sonraya bırakın.
4. Gereksiz üçüncü taraf betikleri kaldırın veya geciktirin.
5. DOM boyutunu küçültün; büyük DOM stil hesaplama ve düzen işlerini yavaşlatır.
6. Ağır hesaplamaları Web Worker'lara taşıyın.

Etkileşimin üç aşaması

INP; giriş gecikmesi (ana iş parçacığı başka işle meşgulken bekleme), işleme süresi (olay işleyicilerin çalışması) ve sunum gecikmesi (tarayıcının bir sonraki kareyi çizmesi) toplamından oluşur. Her aşamanın farklı bir çözümü vardır.

Sık yapılan hatalar

• Yalnızca sayfa yüklenme hızına odaklanıp etkileşimleri ölçmemek.
• Tüm üçüncü taraf betikleri sayfa açılışında yüklemek.

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

• DevTools'ta yavaş etkileşimlerin süresinin düştüğünü görün.
• Saha verisini birkaç hafta sonra kontrol edin.
• SEO Analyzer'ı yeniden çalıştırın.

Sık sorulan sorular

INP ile FID arasındaki fark nedir?

FID yalnızca ilk etkileşimin giriş gecikmesini ölçerdi; INP tüm etkileşimlerin toplam tepki süresini ölçer ve daha kapsamlıdır.

Lighthouse INP ölçer mi?

Lighthouse etkileşim yapmadığı için INP ölçemez; Total Blocking Time (TBT) iyi bir laboratuvar göstergesidir.

Özet

INP, arayüzün kullanıcı etkileşimlerine ne kadar hızlı tepki verdiğini ölçer. Uzun görevleri bölün, önce görsel geri bildirim verin, üçüncü taraf betikleri azaltın ve ağır işleri ana iş parçacığından uzaklaştırı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.