Lighthouse 10, npm ile komut satırından ve Chrome Canary'de hemen kullanılabilir. Önümüzdeki haftalarda bu özellik, Chrome 112'de Chrome kararlı kanalında ve PageSpeed Insights'ta gösterilecek.
Puan değişiklikleri
Saygın Etkileşime Kalan Süre (TTI) metriği, Lighthouse 8'de başlatılan kullanımdan kaldırma süreci sonuçlanarak Lighthouse 10'dan kaldırılıyor. TTI'nin% 10 puan ağırlığı, artık genel performans puanının% 25'ini oluşturan Cumulative Layout Shift (CLS) yöntemine kayıyor.
TTI, bir zamanı işaretler, ancak tanımlanma şekli onu aykırı ağ isteklerine ve uzun görevlere karşı aşırı hassas hale getirir. Largest Contentful Paint (LCP) ve Hız İndeksi, genellikle etkin ağ isteği sayısından daha iyi bulgusal yöntemlerdir. Toplam Engelleme Süresi (TBT), uzun görevleri ve ana iş parçacığı kullanılabilirliğini daha etkili bir şekilde işler. Doğrudan proxy olmasa da alanda ölçülen Core Web Vitals ile daha iyi ilişki vardır.
CLS'nin artan ağırlığı TTI'nin kaldırılması için tesadüfi olur, ancak bunun Core Web Vitals olarak önemini daha iyi yansıtır ve ideal olarak düzende gereksiz değişiklikler yapmaya devam eden sitelere odaklanmayı artırır.
Bu değişikliğin, çoğu sayfanın daha iyi hale zira çoğu sayfa CLS'de TTI'ye göre daha iyi puan verme eğilimindedir. En son HTTP Arşivi çalıştırmasında yapılan 13 milyon sayfa yüklemesinin analizi, bu sayfaların% 90'ının Lighthouse performans puanında ve% 50'sinde 5 puanın üzerinde bir performans artışı olduğunu göstermektedir.
![Toplam puanı oluşturan metriklere (FCP, SI, LCP, TBT ve CLS) göre ayrılmış bir Lighthouse puan göstergesi](https://developer.chrome.google.cn/static/blog/lighthouse-10-0/image/a-lighthouse-score-gauge-af1b4e727c113.png?authuser=2&hl=tr)
Herhangi bir nedenle Lighthouse TTI değerine ihtiyacınız olursa (örneğin, bir CI onayında) bu değer Lighthouse JSON çıkışında değişmeden kullanılabilir, sadece puan ağırlığı 0 ile HTML raporunda gizlidir. JSON değerinin komut dosyası erişimli erişimleri, değişiklikler olmadan çalışmaya devam eder.
Yeni denetimler
Lighthouse 10, yepyeni bir performans denetimi ve önemli bir değişikliği yeni bir sürüme getiriyor.
Geri-ileri önbellek
Geri-ileri önbellek (bfcache) gerçek kullanıcılar için bir sayfanın performansını iyileştirmek amacıyla sunulan en güçlü araçlardan biridir. Bfcache'den yüklenen bir sayfa, normal tarayıcı önbelleğinin ötesinde, sayfa düzenini ve yürütme durumunu neredeyse anında geri yükler. Böylece, tüm sayfa yükleme etkinlikleri büyük ölçüde atlanır ve kullanıcılar geçmişlerinde geri ve ileri giderlerken sayfanızı kullanıcılarınızın hemen karşısına çıkarırlar.
Bununla birlikte, bir sayfanın, tarayıcının bir sayfayı bfcache'den geri yüklemesini engelleyebileceği birkaç yol vardır. Bu yeni Lighthouse denetimi, bfcache için kullanılabilir olup olmadığını test etmek üzere test sayfasından çıkıp tekrar geri döner ve başarısız olmasının nedenlerini listeler.
![bfcache denetiminden örnek sonuç, açık IndexDB bağlantısından kaynaklanan hataları ve sayfadaki kaldırma işleyicileri listeleme](https://developer.chrome.google.cn/static/blog/lighthouse-10-0/image/an-example-result-the-bf-5819bf7710451.png?authuser=2&hl=tr)
Daha fazla bilgi için bfcache denetiminin belgelerine göz atın.
Yapıştırmayı engelleyen girişler
Eski En İyi Uygulamalar denetimi "Kullanıcıların şifre alanlarına yapıştırmasına izin verir" , herhangi bir (salt okunur olmayan) giriş alanına yapıştırmanın işe yarayıp yaramayacağını kontrol edecek şekilde genişletildi. Çoğu site için, yapıştırmanın engellenmesi net olumsuz bir kullanıcı deneyimidir ve meşru güvenlik ve erişilebilirlik iş akışlarını engeller.
Yeni denetim artık "Kullanıcıların giriş alanlarına yapıştırmasına izin verir" (paste-preventing-inputs
).
Düğüm kullanıcıları
Lighthouse'u düğüm kitaplığı olarak kullanıyorsanız bu sürümde dikkat etmeniz gereken birkaç programatik bozucu değişiklik olabilir. Tüm ayrıntılar için 10.0 değişiklik günlüğünü inceleyin.
Lighthouse 10, tam TypeScript türü beyanlarıyla birlikte gönderilir. lighthouse
öğesinden içe aktarılan her şeyi şimdi yazmanız gerekir. Bu, Lighthouse kullanıcı akışları komut dosyası kullanıyorsanız özellikle yararlı olacaktır.
![Lighthouse'u işlev olarak içe aktaran ve işleve geçirilen seçenekler nesnesinin artık TypeScript tarafından tür denetimi yapıldığını gösteren bir Düğüm komut dosyası](https://developer.chrome.google.cn/static/blog/lighthouse-10-0/image/a-node-script-importing-l-94bd6d132bf88.png?authuser=2&hl=tr)
Türleri deneyin ve kullanırken sorun yaşarsanız bize bildirin.
Koşu Feneri
Lighthouse, Chrome Geliştirici Araçları'nda, npm'de (Düğüm modülü ve CLI aracı olarak) ve bir tarayıcı uzantısı olarak (Chrome ile Firefox'ta) kullanılabilir. Ayrıca, PageSpeed Insights gibi çeşitli Google hizmetlerini de destekler.
Lighthouse Düğümü KSA'yı denemek için aşağıdaki komutları kullanın:
npm install -g lighthouse
lighthouse https://www.example.com --view
Lighthouse ekibiyle iletişime geçin
Yeni özellikleri, Lighthouse 10 sürümündeki değişiklikleri veya Lighthouse ile ilgili diğer her şeyi tartışmak için:
- Lighthouse GitHub sorun izleyicisinde sorun bildirin veya geri bildirim gönderin.
- Lighthouse GitHub tartışma forumlarında soru sorun.
- @____lighthouse Twitter hesabı üzerinden Lighthouse ekibine ulaşın.