Lighthouse, web uygulamalarınızın kalitesini iyileştirmek için kullanılan otomatik bir açık kaynak aracıdır. Bu uzantıyı Chrome Uzantısı olarak yükleyebilir veya Düğüm komut satırı aracı olarak çalıştırabilirsiniz. Lighthouse'a bir URL verdiğinizde, sayfa üzerinde bir dizi test çalıştırır ve ardından, sayfanın ne kadar iyi performans gösterdiğini açıklayan ve iyileştirilmesi gereken alanları belirten bir rapor oluşturur.
Bugün, devasa bir sürüm olan ve 128'den fazla PR ile Lighthouse'un 1.5 sürümünü duyurmaktan mutluluk duyuyoruz. Lighthouse 1.5, bir dizi büyük yeni özellik, denetim ve her zamanki hata düzeltmelerini içerir. Uzantıyı npm (npm i -g lighthouse) adresinden veya Chrome Web Mağazası'ndan indirebilirsiniz.
Yeni Denetimler
CSS Kullanım Denetimi, sayfanızdaki kullanılmayan stil kurallarının sayısını ve bunları kaldırmanın sağladığı maliyet/zaman tasarrufunu bildirir:
Optimize Edilmiş Resim Denetimi, optimize edilmemiş resimleri ve bu resimlerin optimizasyonuyla elde edilen maliyet/zaman tasarrufunu raporlar:
Duyarlı Resim Denetimi, çok büyük resimleri ve ilgili cihazda doğru şekilde boyutlandırıldığında maliyet/zamandan tasarruf edileceğini bildirir:
Sayfanızda kullanımdan kaldırılan API'ler veya müdahaleler içeren özellikler kullanılıyorsa Kullanımdan Kaldırma ve Müdahale Denetimi'nde Chrome konsol uyarıları listelenir:
Değişiklikleri bildirin
Gördüğünüz gibi, tablo biçiminde veriler ekleyerek, konuyla ilgisi olmayan yardım metinlerini gizleyerek ve verilerde gezinmeyi kolaylaştıracak yeni özellikler ekleyerek raporu görsel açıdan daha az karmaşık hale getirmeye odaklandık.
Emülasyon ayarları
Belirli bir Lighthouse çalıştırması için hangi kısıtlama ve emülasyon ayarlarının kullanıldığı kolayca unutulabilir. Lighthouse raporları artık raporu oluşturmak için kullanılan çalışma zamanı emülasyon ayarlarını ve uzun süreli bir özellik isteği içeriyor:
Daha yararlı iz verileri
"İlk anlamlı boyama", "Etkileşime Hazır Olma Süresi" gibi Lighthouse metrikleri, Kullanıcı Zamanlaması ölçümlerinde modellenir ve --save-assets işaretiyle kaydedilen iz verilerine tekrar eklenir.
--save-assets işaretini kullanırsanız izlemeyi Geliştirici Araçları'na bırakabilir veya DevTools Zaman Çizelgesi Görüntüleyicisi'nde açabilirsiniz.
Temel metriklerinizi, sayfa yüklemesinin tam iziniyle bağlam içinde görebilirsiniz.
Lighthouse Görüntüleyici
HTML raporlarında, raporu farklı biçimlerde dışa aktarmaya ilişkin seçenekler içeren yeni bir düğme fark edersiniz. Bu seçeneklerden biri "Görüntüleyen'de aç"tır. Bu düğme tıklandığında rapor çevrimiçi Görüntüleyen'e gönderilir. Burada raporu GitHub kullanıcılarıyla daha ayrıntılı olarak paylaşabilirsiniz.
Perde arkasında, Viewer bir GitHub gizli gist oluşturmak üzere OAuth aracılığıyla izninizi alır ve raporu oraya kaydeder. Genel bilginiz gibi yapıldığı için raporun paylaşımı üzerinde tam kontrole sahip olursunuz ve raporu istediğiniz zaman silebilirsiniz. GitHub ayarlarınızın altında Görüntüleyenin gist oluşturma iznini iptal edebilirsiniz.
Performans Denemesi
Performans Denemesi projesinin ilk sürümü 1.5.0 sürümünde kullanıma sunulmuştur. Bu, sayfa yükleme performansınızla denemeler yapmanıza, geliştirme sırasında kritik yolunuzdaki öğeleri engellemenin veya geciktirmenin etkilerini etkileşimli olarak test etmenize olanak tanır.
Lighthouse, --interactive işaretiyle çalıştırıldığında maliyetli sayfa kaynaklarının etkileşimli olarak seçilmesine olanak tanıyan özel bir rapor oluşturulur. Daha sonra deneme sunucusu, bu kaynaklar engellenmiş şekilde söz konusu sayfada Lighthouse'u yeniden çalıştırır.
Lighthouse'daki Performans Denemesi hakkında daha fazla bilgi edinin.
Yeni Belgeler
Son olarak, developers.google.com/web/tools/lighthouse/ adresindeki dokümanları modernleştirdik ve yeni denetim referansları ekledik.
Şimdilik bu kadar!
Lighthouse'daki en yeni güncellemelerle ilgili tüm ayrıntılar için GitHub'daki sürüm notlarının tamamına göz atın. Her zaman olduğu gibi, hataları bildirmek, özellik istekleri bildirmek veya bundan sonra ne görmek istediğiniz konusunda fikirler hakkında beyin fırtınası yapmak için bize ulaşın.