Bir üçüncü taraf komut dosyası sayfa yüklemenizi yavaşlatıyorsa performansı iyileştirmek için iki seçeneğiniz vardır:
- Sitenize net bir değer katmıyorsa kaldırın.
- Yükleme işlemini optimize edin.
Bu yayında, aşağıdaki tekniklerle üçüncü taraf komut dosyalarının yükleme sürecinin nasıl optimize edileceği açıklanmaktadır:
<script>etiketlerindeasyncveyadeferözelliğini kullanma- Gerekli kaynaklara erken bağlantı kurma
- Geç yükleme
- Üçüncü taraf komut dosyalarını yayınlama şeklinizi optimize etme
async veya defer kullanın
Senkron komut dosyaları DOM oluşturma ve oluşturma işlemlerini geciktirdiğinden, sayfanın oluşturulabilmesi için komut dosyasının çalıştırılması gerekmediği sürece üçüncü taraf komut dosyalarını her zaman asenkron olarak yüklemeniz gerekir.
async ve defer özellikleri, tarayıcıya komut dosyasını arka planda yüklerken HTML'yi ayrıştırmaya devam edebileceğini ve ardından komut dosyasını yüklendikten sonra yürütebileceğini bildirir. Bu sayede, komut dosyası indirmeleri DOM oluşturmayı veya sayfa oluşturmayı engellemez. Böylece kullanıcı, tüm komut dosyaları yüklenmeden önce sayfayı görebilir.
<script async src="script.js">
<script defer src="script.js">
async ve defer özellikleri arasındaki fark, tarayıcı komut dosyalarını ne zaman yürüttüğüne bağlıdır.
async
async özelliğine sahip komut dosyaları, indirme işlemi tamamlandıktan sonra ve pencerenin yükleme etkinliğinden önce ilk fırsatta yürütülür. Bu, async komut dosyalarının HTML'de göründükleri sırayla çalışma olasılığının (ve olasılığının) yüksek olduğu anlamına gelir. Ayrıca, ayrıştırıcı hâlâ çalışırken indirme işlemini tamamlarlarsa DOM oluşturma işlemini kesintiye uğratabilirler.