Google Lighthouse Nedir?
Single Page Application (SPA), Progressive Web App (PWA) ve PageSpeed Insights ile web sayfası / uygulaması geliştirme sürecine dair temel bilgilerle başladığım yazı serisine Google Lighthouse ile devam edelim ve geliştirdiğimiz uygulamamız ve/veya web sayfamız ile ilgili durumu (sorunlar, olası geliştirme olanaları vb.) nasıl edebileceğimize bakalım. Bu amaçla kullanabileceğimiz uygulamalardan biri olan Google Lighthouse’a yakından bakalım.
Google Lighthouse
Lighthouse, Google öncülüğünde açık kaynaklı bir proje olarak geliştirilen, web uygulamalarının ve web sayfalarının analiz edilmesi, geliştiriciler için bu analizlerin bir standart çerçevesinde sunulmasını sağlar. Bu bilgiler erişilebilirlik performansı, SEO (Arama Motoru Optimizasyonu), PWA özellikleri için denetim amacıyla kullanılabilir1.
Google Lighthouse, Chrome DevTools > Audit (Denetim) sekmesinden, Google eklentisi olarak, Node.js modülü olarak, WEB UI veya bir CLI ile erişilebilir2. Kullanım için bir URI gereklidir.
- Google Lighthouse analizleri sayfa bazında yapılmaktadır.
- Google Lighthouse Chrome DevTools > Audit ve Chrome eklentisi olarak kullanılabilir.
- Eklenti kullanımında analiz özet ve/veya detaylı çıktı, JSON kopyası, HTML ve/veya JSON dökümü olarak edinilebilirken, Audit üzerinden yapılan analiz sadece JSON olarak aktarılabilir.
- Lighthouse analizi diğer araçlara kıyasla daha fazla detaya sahiptir;
- Score Scale, PageSpeed Insights tarafından sunulan puanlama gerçek sayfa yükleme süresinin yanı sıra test edilen farklı faktörleri de içerir.
- Kullanılan ölçümler : Düşük sayfa yükleme sürelerine katkıda bulunan faktörlere odaklanarak; sayfanın boyutu, sunucuya gönderilen istek sayısı, ilk Byte Süresi, sunucudan alınan ilk yanıt ile oluşturulan sayfa görüntüsü ve toplam yükleme süresi gibi çok sayıda faydalı performans metriğini dikkate alır.
- Güncel öneriler: Analiz sonucunda görüntülenen tavsiyeler son gelişmelerle doğru orantılıdır.
Daha detaylı bilgi için Google Developers Lighthouse sayfası incelenebilir2.
Lighthouse işlemi için robots.txt dosyasının taramaya uygun olacak şekilde düzenlenmiş olması gerekmektedir.
Google Lighthouse Kullanımı
Her ne şekilde olursa olsun, analiz aşaması belirli seçenekler aktifleştirilerek gerçekleştirilir. Device (Cihaz) için Mobile (Mobil) ve Desktop (Masaüstü), Audit (Denetim) için Performance, Accessibility, Best Practices, SEO ve Progressive Web App seçenekleri değerlendirilebilir ve raporlanabilir. Puanlama ile ilgili olarak PageSpeed Insights yazısına göz atabilirsiniz1.
Lighthouse Analiz ve Ölçüm Kriterleri
Lighthouse açıklaması içerisinde SEO’nun denetim amacıyla kullanılabileceğinden bahsetmiştim. Bu ifadenin altını çizmek gerekli. Çünkü, ölçüm kriterlerinin tamamı bütün olarak değerlendirilmelidir. Bir web sayfası için yapılan analiz içerisinde PWA (örneğin; caching) da bir performans kriteri olarak değerlendirilebilir. Ancak PWA ayrı bir başlık olarak sunulmaktadır.
Ayrıca, web sayfalarının ve uygulamalarının Lighthouse skorunu 100 yapabilmek teknik geliştirmeleri bir zorunluluk olarak ele almayı sağlamakta. Bu anlamda, değerlendirmeleri Google PageSpeed Insights ile karıştırmamak uygun olacaktır. Google değerlendirmeleri çerçevesinde kullanıcı deneyiminin daha öncelikli olduğunun altını çizmek gerekli. How to create a PWA a scoring 90+ score in Google Lighthouse using Ionic 23 başlıklı yazı örnek olarak değerlendirilebilir.