Lighthouse, sayfanız yüklenirken kaç ağ isteğinin yapıldığını ve ne kadar veri aktarıldığını raporlar:
- Toplam satırı için İstekler ve Aktarım Boyutu değerleri, Image, Script, Font, Stylesheet, Other, Document ve Media satırlarının değerleri eklenerek hesaplanır.
- Üçüncü taraf sütunu, Toplam satırının değerlerini hesaba katmaz. Bu özelliğin amacı, toplam isteklerin kaçının ve toplam aktarım boyutunun ne kadarının üçüncü taraf alanlarından geldiğini öğrenmenizi sağlamaktır. Üçüncü taraf istekleri, diğer kaynak türlerinden herhangi birinin kombinasyonu olabilir.
Kaynak sayılarını ve aktarım boyutlarını azaltma
Yüksek kaynak sayılarının veya büyük aktarım boyutlarının yük performansı üzerindeki etkisi, istenen kaynak türüne bağlıdır.
CSS ve JavaScript
CSS ve JavaScript dosyaları için yapılan istekler varsayılan olarak oluşturma işlemini engeller. Diğer bir deyişle, tarayıcılar tüm CSS ve JavaScript istekleri tamamlanana kadar ekranda içerik oluşturamaz. Bu dosyalardan herhangi biri yavaş bir sunucuda barındırılıyorsa bu tek yavaş sunucu, oluşturma işleminin tamamını geciktirebilir. Yalnızca gerçekten ihtiyacınız olan kodu nasıl göndereceğinizi öğrenmek için JavaScript'inizi optimize etme, Üçüncü taraf kaynaklarınızı optimize etme ve CSS'nizi optimize etme konularına bakın.
Etkilenen metrikler: Tümü
Resimler
Resim istekleri, CSS ve JavaScript gibi oluşturmayı engellemez ancak yine de yükleme performansını olumsuz yönde etkileyebilir. Mobil kullanıcının bir sayfayı yüklediğinde resimlerin yüklenmeye başladığını, ancak işlemin tamamlanmasının biraz zaman alacağını görmesi yaygın olarak karşılaşılan bir sorundur. Resimleri nasıl daha hızlı yükleyeceğinizi öğrenmek için Resimlerinizi optimize etme bölümüne bakın.
Etkilenen metrikler: İlk Zengin İçerikli Boyama, İlk Anlamlı Boyama, Hız Endeksi
Yazı tipleri
Yazı tipi dosyalarının verimsiz yüklenmesi, sayfa yükleme sırasında metnin görünmemesine neden olabilir. Kullanıcının cihazında mevcut olan bir yazı tipinin varsayılan olarak nasıl ayarlanacağını öğrenmek ve indirme işlemi tamamlandığında özel yazı tipinize geçmek için yazı tiplerinizi optimize etme konusuna bakın.
Etkilenen metrikler: İlk Zengin İçerikli Boyama
Dokümanlar
HTML dosyanız büyükse tarayıcının HTML'yi ayrıştırmak ve ayrıştırılan HTML'den DOM ağacını oluşturmak için daha fazla zaman harcaması gerekir.
Etkilenen metrikler: İlk Zengin İçerikli Boyama
Medya
Animasyonlu GIF dosyaları genellikle çok büyüktür. Animasyonların nasıl daha hızlı yükleneceğini öğrenmek için GIF'leri videolarla değiştirme konusuna bakın.
Etkilenen metrikler: İlk Zengin İçerikli Boyama
Regresyonları önlemek için performans bütçelerini kullanın
İstek sayılarını ve aktarım boyutlarını azaltmak üzere kodunuzu optimize ettikten sonra, regresyonları nasıl önleyeceğinizi öğrenmek için Performans bütçeleri belirleme bölümüne bakın.
Kaynaklar
İstek sayısını düşük tut ve boyutları küçük aktar denetiminin kaynak kodu