inp metrigi nedir? INP Ölçüm ve İyileştirme Rehberi
inp metrigi nedir sorusunun kısa yanıtı şudur: INP, bir web sayfasının kullanıcı etkileşimlerine ne kadar hızlı yanıt verdiğini ölçen bir performans metriğidir. Tıklama, dokunma veya klavye girişinden sonra tarayıcının bir sonraki ekran karesini boyamasına kadar geçen gecikmeyi değerlendirir.
INP, özellikle butonların geç tepki vermesi, menülerin gecikmeli açılması veya formların kullanıcı girişinden sonra donmuş gibi görünmesi gibi sorunları görünür hâle getirir. Bu nedenle yalnızca teknik bir skor değil, kullanıcı deneyiminin etkileşim boyutunu değerlendiren önemli bir ölçüttür.
Önemli Noktalar
- INP, sayfanın genel yanıt verebilirliğini ölçer.
- Tıklama, dokunma ve klavye etkileşimlerini dikkate alır.
- Değerlendirme, sayfa ziyaretinin tamamındaki etkileşimler üzerinden yapılır.
- 200 milisaniye veya daha düşük değer iyi kabul edilir.
- 200–500 milisaniye arası değerler geliştirme gerektirir.
- 500 milisaniyenin üzerindeki değerler zayıf yanıt verebilirliğine işaret eder.
- Gerçek kullanıcı verileri, laboratuvar testlerinden farklı sonuçlar gösterebilir.
INP neyi ölçer?
INP, kullanıcının bir etkileşim başlatması ile tarayıcının bu etkileşimin sonucunu ekranda göstermesi arasındaki toplam gecikmeyi ölçer. Bu süreç; giriş gecikmesini, olay işleyicisinin çalışmasını ve tarayıcının sonraki görüntüyü oluşturmasını kapsar.
Örneğin kullanıcı bir e-ticaret sitesinde “Sepete ekle” düğmesine bastığında, düğmenin görsel olarak tepki vermesi, sepet sayısının güncellenmesi veya bilgilendirme mesajının görünmesi gerekir. JavaScript ana iş parçacığını uzun süre meşgul ederse kullanıcı tıklamanın algılanmadığını düşünebilir.
Chrome UX Report, INP’yi sayfanın yaşam döngüsü boyunca gerçekleşen etkileşimlerin gecikmesini izleyen bir alan metriği olarak tanımlar. Sayfadaki en yavaş etkileşim veya çok sayıda etkileşim bulunan sayfalarda buna yakın yüksek değer, sayfanın INP sonucunu belirler.
INP ile FID arasındaki fark nedir?
INP, FID’den daha kapsamlı bir etkileşim metriğidir. FID yalnızca sayfadaki ilk etkileşimin giriş gecikmesini ölçerken INP, ziyaret süresince gerçekleşen etkileşimleri ve sonraki ekranın boyanmasına kadar geçen süreci değerlendirir.
Bu fark, INP’nin gerçek kullanıcı deneyimini daha geniş biçimde yansıtmasını sağlar. Bir sayfa ilk tıklamaya hızlı yanıt verse bile sonraki menü, filtre veya form etkileşimlerinde gecikiyorsa INP bu sorunu ortaya çıkarabilir.
İyi INP değeri kaç olmalıdır?
İyi INP değeri 200 milisaniye veya daha düşüktür. 200 milisaniyenin üzerinde ve 500 milisaniyeye kadar olan değerler geliştirme gerektirir; 500 milisaniyenin üzerindeki değerler ise zayıf kabul edilir. Bu eşikler, gerçek kullanıcı deneyimlerinin 75. yüzdelik dilimi üzerinden değerlendirilir.
| INP değeri | Değerlendirme | Anlamı |
|---|---|---|
| 200 ms veya daha düşük | İyi | Etkileşimler hızlı algılanır |
| 200–500 ms | Geliştirme gerekli | Bazı etkileşimlerde hissedilir gecikme olabilir |
| 500 ms üzeri | Zayıf | Kullanıcı, sayfanın yanıt vermediğini düşünebilir |
- yüzdelik dilim, ölçümlerin en az yüzde 75’inin ilgili değere eşit veya daha hızlı olduğunu ifade eder. Bu nedenle tek bir cihazda alınan başarılı skor, tüm kullanıcıların iyi deneyim yaşadığı anlamına gelmez. Mobil ve masaüstü sonuçlarını ayrıca incelemek daha sağlıklı bir değerlendirme sağlar.
INP nasıl ölçülür?
INP ölçümü için laboratuvar testleri ve gerçek kullanıcı verileri birlikte kullanılmalıdır. Laboratuvar araçları sorunların olası nedenlerini bulmaya yardımcı olurken alan verileri, ziyaretçilerin gerçek cihaz, bağlantı ve kullanım koşullarındaki deneyimini gösterir.
Ölçüm süreci şu şekilde ilerleyebilir:
- PageSpeed Insights raporunu inceleyin. Alan verileri mevcutsa INP sonucunu ve değerlendirme sınıfını kontrol edin.
- Mobil ve masaüstünü ayırın. Cihaz, işlemci gücü ve bağlantı koşulları etkileşim gecikmesini değiştirebilir.
- Sorunlu URL’leri belirleyin. Ana sayfa, ürün sayfası, ödeme akışı ve yoğun JavaScript kullanan sayfaları ayrı değerlendirin.
- Laboratuvar testleri yapın. Lighthouse gibi araçlarla uzun görevleri, JavaScript yükünü ve ana iş parçacığı kullanımını inceleyin.
- Gerçek etkileşimleri izleyin. Kullanıcıların hangi buton, menü, filtre veya form alanında beklediğini tespit edin.
- Değişiklik sonrası tekrar ölçün. Optimizasyonun yalnızca laboratuvar skoruna değil, alan verilerine de yansıyıp yansımadığını kontrol edin.
PageSpeed Insights, gerçek kullanıcı deneyimlerinden oluşturulan CrUX verilerini ve kontrollü laboratuvar testlerini aynı raporda sunabilir. Ancak bir sayfa için yeterli alan verisi bulunmayabilir; bu durumda rapor, mevcut metriklere göre değerlendirme yapar.
INP neden yükselir?
Yüksek INP genellikle tarayıcının kullanıcı etkileşimine zamanında yanıt verememesinden kaynaklanır. Bunun temel nedeni çoğu zaman ana iş parçacığında çalışan JavaScript görevlerinin fazla uzun sürmesidir.
En yaygın nedenler şunlardır:
- Uzun süren JavaScript görevleri
- Gereksiz üçüncü taraf komut dosyaları
- Büyük ve karmaşık olay işleyicileri
- Etkileşim sonrasında tüm sayfanın yeniden oluşturulması
- Büyük DOM yapısı
- Kullanılmayan JavaScript’in yüklenmesi
- Ağır filtreleme, arama ve sıralama işlemleri
- Etkileşim sırasında senkron çalışan hesaplamalar
- Animasyonların ana iş parçacığını zorlaması
- Düşük donanımlı mobil cihazların yeterince dikkate alınmaması
Bir etkileşim sırasında hem hesaplama yapılıyor hem de geniş bir arayüz bölümü yeniden çiziliyorsa gecikme artabilir. Bu nedenle yalnızca dosya boyutlarını küçültmek yeterli olmayabilir; etkileşim mantığının nasıl çalıştığı da analiz edilmelidir.
INP nasıl iyileştirilir?
INP iyileştirmesi, gecikmeye neden olan etkileşimi bulup o etkileşimin her aşamasını sadeleştirmeyi gerektirir. En iyi sonuç, ölçüm, teşhis, uygulama ve yeniden ölçüm döngüsüyle alınır.
1. Uzun görevleri bölün
Tarayıcının ana iş parçacığında uzun süre çalışan görevler, kullanıcı girişinin işlenmesini geciktirir. Büyük işlemleri daha küçük parçalara ayırmak, tarayıcıya araya girip kullanıcı etkileşimini işlemesi için zaman kazandırır.
Özellikle büyük veri filtreleme, karmaşık hesaplama ve kapsamlı DOM güncellemeleri bölümlere ayrılmalıdır. Her parçanın tamamlanması beklenmeden kullanıcı etkileşiminin işlenebilmesi, algılanan yanıt hızını artırır.
2. Olay işleyicilerini sadeleştirin
Bir butonun `click` veya bir alanın `input` olayında gereksiz işlemler çalıştırılmamalıdır. Kullanıcı etkileşimiyle doğrudan ilgili olmayan görevleri ertelemek, yalnızca gerekli arayüz bölümünü güncellemek ve tekrar eden hesaplamaları önlemek INP üzerinde olumlu etki yaratabilir.
Formlarda her karakter girişinde ağır doğrulama yapmak yerine uygun durumlarda gecikmeli veya toplu doğrulama uygulanabilir. Arama kutuları, filtreler ve otomatik tamamlama bileşenleri bu açıdan dikkatle incelenmelidir.
3. Gereksiz JavaScript’i azaltın
Kullanılmayan kodları kaldırmak, sayfa için gerekli olmayan özellikleri koşullu yüklemek ve üçüncü taraf betiklerini sınırlamak ana iş parçacığındaki baskıyı azaltır. Kod bölme ve gecikmeli yükleme, özelliklerin yalnızca ihtiyaç duyulduğunda çalıştırılmasına yardımcı olur.
Her eklenti veya izleme betiği, kullanıcı etkileşimleriyle aynı kaynakları kullanabilir. Bu nedenle işlevsel fayda ile performans maliyeti birlikte değerlendirilmelidir.
4. Görsel güncellemeleri küçültün
Bir etkileşim sonrasında tüm sayfayı yeniden oluşturmak yerine yalnızca değişen bileşeni güncellemek daha verimlidir. Büyük DOM ağaçlarında gereksiz stil hesaplamaları ve yerleşim değişiklikleri de azaltılmalıdır.
Menü, modal pencere, sepet bildirimi ve sekme geçişleri gibi bileşenlerde yalnızca gerekli sınıfları değiştirmek; pahalı düzen hesaplamalarından kaçınmak önemlidir.
5. Kritik etkileşimleri önceliklendirin
Kullanıcının temel hedefe ulaşmasını sağlayan etkileşimler öncelikli olmalıdır. Örneğin ödeme adımındaki devam düğmesi, ürün filtresi veya içerik navigasyonu; ikincil animasyonlardan ve arka plan işlemlerinden önce ele alınmalıdır.
Bu yaklaşım, her kod parçasını aynı anda hızlandırmak yerine kullanıcı yolculuğunun en kritik noktalarına odaklanır.
INP, diğer Core Web Vitals metriklerinden nasıl ayrılır?
INP, Core Web Vitals grubundaki diğer metriklerden farklı olarak etkileşim sonrası yanıtı ölçer. LCP ana içeriğin yüklenme hızını, CLS görsel düzenin kararlılığını, INP ise kullanıcı eylemlerine verilen tepkinin hızını değerlendirir.
| Metrik | Ölçtüğü konu | Kullanıcı sorusu |
|---|---|---|
| LCP | Ana içeriğin görünme süresi | “Sayfa ne kadar hızlı açıldı?” |
| CLS | Görsel düzenin kararlılığı | “İçerik neden yer değiştiriyor?” |
| INP | Etkileşim yanıt süresi | “Tıkladığımda neden hemen tepki vermedi?” |
Bu metrikler birbirini tamamlar. Hızlı yüklenen ancak tıklamalara geç yanıt veren bir sayfa iyi bir deneyim sunmaz. Benzer şekilde hızlı yanıt veren fakat içerikleri sürekli kayan bir arayüz de kullanıcı güvenini olumsuz etkileyebilir.
Core Web Vitals çalışmalarını birlikte planlamak için kullanıcı deneyimi ve SEO için Core Web Vitals uygulama rehberini inceleyebilirsiniz.
INP analizinde hangi veriler dikkate alınmalı?
INP değerlendirmesinde yalnızca ortalama değere bakmak doğru değildir. Ortalama, küçük bir kullanıcı grubundaki ciddi gecikmeleri gizleyebilir. 75. yüzdelik dilim, geniş kullanıcı kitlesinin deneyimini daha anlamlı biçimde gösterir.
Analiz sırasında şu ayrımları inceleyin:
- Mobil ve masaüstü cihazlar
- Farklı işletim sistemleri ve tarayıcılar
- Yavaş ve hızlı bağlantı koşulları
- Sayfa türleri
- Kullanıcıların gerçekleştirdiği etkileşim türleri
- Etkileşimin giriş, işlem ve boyama aşamaları
- Optimizasyon öncesi ve sonrası dönemler
CrUX verileri gerçek kullanıcı deneyimlerinden oluşur ve metrikler yüzdelik değerler ile dağılımlar üzerinden raporlanır. CrUX Dashboard’da gösterilen 75. yüzdelik değer, deneyimlerin yüzde 75’inin bu değerden daha iyi olduğunu ifade eder.
Uygulama için karar kriterleri
INP üzerinde çalışmaya başlamadan önce aşağıdaki kriterleri değerlendirin:
- Sorun tüm sayfalarda mı, belirli şablonlarda mı görülüyor?
- Gecikme mobil cihazlarda daha mı belirgin?
- Sorun tek bir etkileşimde mi, birçok etkileşimde mi oluşuyor?
- Ana neden JavaScript mi, DOM güncellemesi mi?
- Üçüncü taraf betikleri kritik kullanıcı yolculuğunu etkiliyor mu?
- Değişiklik, erişilebilirlik veya işlevsellikten ödün veriyor mu?
- Alan verilerinde iyileşme gözleniyor mu?
Bu kriterler, yalnızca skor yükseltmeye odaklanmak yerine iş sonucunu koruyan bir optimizasyon planı oluşturmayı sağlar.
Sonuç
inp metrigi nedir sorusunun temel yanıtı, web sayfasının kullanıcı etkileşimlerine verdiği tepkinin ölçümüdür. INP; tıklama, dokunma ve klavye işlemlerinin ardından tarayıcının sonraki ekranı ne kadar hızlı güncellediğini değerlendirir.
İyi bir INP için hedef 200 milisaniye veya daha düşük değerdir. Ancak gerçek başarı, tek bir laboratuvar skorundan çok gerçek kullanıcı verilerinde, özellikle 75. yüzdelik dilimde sürdürülebilir iyileşme sağlamaktır. Uzun JavaScript görevlerini bölmek, olay işleyicilerini sadeleştirmek, gereksiz kodu azaltmak ve kritik etkileşimleri önceliklendirmek en etkili başlangıç adımlarıdır.
Teknik uygulama ayrıntıları için INP optimizasyonu rehberine ve genel sayfa performansı için sayfa hızını artırma rehberine göz atabilirsiniz.