Kullanılmayan JavaScript sayfanızın yükleme hızını yavaşlatabilir:
- JavaScript oluşturmayı engelliyorsa tarayıcının, sayfayı oluşturmak için gereken diğer tüm çalışmalarla devam edebilmesi için komut dosyasını indirmesi, ayrıştırması, derlemesi ve değerlendirmesi gerekir.
- JavaScript eşzamansız olsa (oluşturmayı engellemese) bile kod, indirme sırasında diğer kaynaklarla bant genişliği için rekabet eder. Bu da performans üzerinde önemli sonuçlara yol açar. Kullanılmayan kodları ağ üzerinden göndermek de sınırsız veri planı olmayan mobil kullanıcılar için israf yaratır.
Kullanılmayan JavaScript denetimi nasıl başarısız oluyor?
Lighthouse, 20 kibibayttan fazla kullanılmayan kod bulunan her JavaScript dosyasını işaretler:
![Denetimin ekran görüntüsü.](https://developer.chrome.com/static/docs/lighthouse/performance/unused-javascript/image/a-screenshot-the-audit-5e55ec7ebbacf.jpg?authuser=5&hl=tr)
Kullanılmayan JavaScript kodları kaldırma
Kullanılmayan JavaScript kodları tespit edin
Chrome Geliştirici Araçları'ndaki Kapsam sekmesi, kullanılmayan kodların satır satır dökümünü sağlayabilir.
Puppeteer'daki Coverage
sınıfı, kullanılmayan kodları tespit etme ve kullanılan kodları ayıklama sürecini otomatikleştirmenize yardımcı olabilir.
Kullanılmayan kodları kaldırma desteği için geliştirme aracı
Paketleyicinizin kullanılmayan kodları önlemeyi veya kaldırmayı kolaylaştıran özellikleri destekleyip desteklemediğini öğrenmek için aşağıdaki Tooling.Report testlerine göz atın:
Yığına özel rehberlik
Angular
Angular KSA kullanıyorsanız paketlerinizi incelemek için üretim derlemenize kaynak eşlemelerini ekleyin.
Drupal
Kullanılmayan JavaScript öğelerini kaldırmayı ve gerekli Drupal kitaplıklarını yalnızca alakalı sayfaya veya bir sayfadaki alakalı bileşene eklemeyi düşünün. Ayrıntılar için Kitaplık tanımlama bölümüne bakın.
Joomla
Sayfanızda kullanılmayan JavaScript'ler yükleyen Joomla uzantılarının sayısını azaltmayı veya bu uzantıları değiştirmeyi düşünün.
Magento
Magento'nun yerleşik JavaScript paketlemesini devre dışı bırakın.
Tepki ver
Sunucu tarafında oluşturmuyorsanız JavaScript paketlerinizi React.lazy()
ile bölün.
Aksi halde, loadable-components gibi bir üçüncü taraf kitaplığı kullanarak kodu bölün.
Vue
Sunucu tarafında oluşturmuyor ve Vue yönlendirici kullanmıyorsanız paketleri geç yükleme rotalarına göre bölün.
WordPress
Sayfanızda kullanılmayan JavaScript'ler yükleyen WordPress eklentilerinin sayısını azaltmayı veya değiştirmeyi düşünün.