Chrome Geliştirici Zirvesi’nde Paul Irish ve ben, Lighthouse’a yönelik güncellemeleri duyurduk—Lighthouse CI, yeni performans puanı formülü ve daha fazlası. Büyük Lighthouse haberlerinin yanı sıra, yeni performans ölçümleri, PageSpeed Insights ve Chrome Kullanıcı Deneyimi Raporu (CrUX) güncellemeleri ve Web Almanac’ın web ekosistemi analizinden elde edilen bilgiler dahil olmak üzere heyecan verici performans araçları geliştirmeleri sunduk.
Yeni performans metrikleri #
Bir kullanıcının deneyimindeki nüansları ölçmek, bunun kârlılığınız üzerindeki etkisini ölçmenin ve iyileştirmeleri ve gerilemeleri izlemenin anahtarıdır. Zamanla, bu nüansları yakalamak ve kullanıcı deneyimini ölçmedeki boşlukları doldurmak için yeni ölçümler geliştirildi. Metrik hikayesine en yeni ekleme, W3C Web Performance Working Group’ta kuluçkalanmakta olan iki alan metriği (Largest Contentful Paint (LCP) ve Kümülatif Düzen Kayması (CLS)) ve yeni bir laboratuvar metriği olan Toplam Engelleme Süresidir (TBT).
En Büyük İçerikli Boya (LCP) #
En Büyük İçerikli Boyama (LCP), en büyük içerik öğesinin görüntü alanında görünür hale geldiği zamanı bildirir.
En Büyük İçerikli Boya Öncesi, İlk Anlamlı Boya (FMP) Ve Hız Endeksi (SI) ilk boyamadan sonraki yükleme deneyimini yakalamaya hizmet etti, ancak bu ölçümler karmaşıktır ve genellikle sayfanın ana içeriğinin ne zaman yüklendiğini belirlemez. Araştırmalar, sayfadaki en büyük öğenin ne zaman işlendiğine bakmanın, bir sayfanın ana içeriğinin ne zaman yüklendiğini daha iyi temsil ettiğini göstermiştir.
Yeni En Büyük İçerikli Boyama metriği yakında Lighthouse raporlarında kullanıma sunulacak ve bu arada JavaScript’te LCP’yi ölçebilirsiniz.
Toplam Engelleme Süresi (TBT) #
Toplam Engelleme Süresi (TBT) metriği, Birinci İçerikli Boyama (FCP) ile ana iş parçacığının giriş yanıt verme hızını önleyecek kadar uzun süre bloke edildiği Etkileşim Süresi (TTI) arasındaki toplam süreyi ölçer.
Bir görev, ana iş parçacığında 50 milisaniyeden fazla çalışıyorsa uzun kabul edilir. Bunun üzerindeki herhangi bir milisaniye, o görevin engelleme süresine sayılır.
Bir sayfa için Toplam Engelleme Süresi, FCP ve TTI arasında gerçekleşen tüm uzun görevlerin engelleme sürelerinin toplamıdır.
Etkileşim Süresi, ana iş parçacığının yükte daha sonra ne zaman sakinleştiğini belirleme konusunda iyi bir iş çıkarsa da, Toplam Engelleme Süresi, ana iş parçacığının yük boyunca ne kadar gergin olduğunu ölçmeyi amaçlar. Bu sayede TTI ve TBT birbirini tamamlar ve denge sağlar.
Kümülatif Düzen Kayması (CLS) #
Kümülatif Düzen Kayması (CLS), bir sayfanın görsel kararlılığını ölçer ve kullanıcıların ne sıklıkta beklenmeyen düzen kaymaları yaşadığını ölçer. Beklenmeyen içerik hareketi çok sinir bozucu olabilir ve bu yeni ölçüm, bunun kullanıcılarınız için ne sıklıkta meydana geldiğini ölçerek bu sorunu çözmenize yardımcı olur.
Nasıl hesaplandığını ve nasıl ölçüleceğini öğrenmek için Ayrıntılı Kümülatif Düzen Kaydırma kılavuzuna göz atın.
Yeni Lighthouse performans puanı formülü, yakında FMP ve FCI’nın önemini kaldıracak ve bir sayfa kullanılabilir göründüğünde daha iyi yakaladıkları için üç yeni metriği (LCP, TBT ve CLS) içerecek.
Çıkış yapmak Deniz feneri performans puanlaması ve daha fazlasını öğrenmek için yeni web.dev metrik koleksiyonu.
PageSpeed Insights’ta ayarlanan saha verileri (CrUX) eşikleri #
Geçen yıl boyunca, web performansını sahadan analiz ediyoruz. Chrome Kullanıcı Deneyimi (CrUX) verileri. Bu verilerden elde edilen bilgilerle, saha performansında bir web sitesini “yavaş”, “orta” veya “hızlı” olarak etiketlemek için kullandığımız eşikleri yeniden değerlendirdik.
Bir site için genel bir değerlendirme elde etmek için, Sayfa Hızı Analizleri (PSI) saha verilerinin toplam dağılımının belirli bir yüzdelik dilimini o site için altın sayı olarak kullanır; kullanılan önceki eşikler, İlk Kapsamlı Boyama için 90. yüzdelik dilim ve İlk Giriş Gecikmesi (FID) için 95. yüzdelik dilimdi.
Örneğin, bir sitenin FCP dağılımı %50 hızlı, %30 orta, %20 yavaş ise, 90. yüzdelik FCP yavaş bölümdedir ve sitenin genel alan puanını yavaş yapar.
Bu, web siteleri arasında daha iyi bir genel dağılıma sahip olacak şekilde ayarlandı ve yeni döküm şu şekilde:
| Metrik | Genel Yüzdelik | Hızlı (ms) | orta (ms) | Yavaş (ms) |
| FCP | 75. yüzdelik dilim | 1000 | 1000-3000 | 3000+ |
| FID | 95. yüzdelik dilim | 100 | 100-300 | 300+ |
Örneğin, şimdi bir sitenin FCP dağılımı %50 hızlı, %30 orta, %20 yavaş ise, 75. yüzdelik FCP orta bölümdedir ve sitenin genel alan puanını orta düzeyde yapar.
PageSpeed Insights’ta kanonik URL yönlendirmeleri #
Kullanıcı deneyimini olabildiğince doğru bir şekilde ölçebilmeniz için PageSpeed Insights ekibi, PSI’a bir yeniden analiz istemi ekledi. Yeni bir URL’ye yönlendirilen sitelerde, gerçek performansınızın daha eksiksiz bir resmini elde etmek için açılış URL’sine ilişkin raporu yeniden çalıştırmanız istenir.
Yeni Search Console Hız raporunda CrUX #
Search Console, yeni Hız raporu Chrome Dev Summit’ten bir hafta önce. Site sahiplerinin olası kullanıcı deneyimi sorunlarını keşfetmesine yardımcı olmak için Chrome Kullanıcı Deneyimi Raporundaki verileri kullanır. Hız raporu, benzer URL gruplarını otomatik olarak “Hızlı”, “Orta” ve “Yavaş” gruplara atar ve belirli sorunlar için performans iyileştirmelerine öncelik verilmesine yardımcı olur.
Web Almanak #
Açılış konuşmasında, Web Almanak, web topluluğunun uzmanlığıyla web’in durumu hakkındaki istatistikleri ve eğilimleri eşleştiren yıllık bir proje. Chrome geliştiricilerinden ve web topluluğundan oluşan 85 katılımcı, sitelerin nasıl oluşturulduğunu, sunulduğunu ve deneyimlendiğini ele alan web ile ilgili 20 temel yönü analiz eden proje üzerinde çalışmak için gönüllü oldu. Durumu hakkında daha fazla bilgi edinmek için Web Almanac’ı keşfetmeye başlayın. verim, JavaScriptVe üçüncü şahıs web’deki kod.
Daha fazla bilgi edin #
Chrome Geliştirici Zirvesi’ndeki performans araçları güncellemeleri hakkında daha fazla ayrıntı için Hız araçlarının evrimi konuşmasını izleyin: