Kullanılan resimler ve video gibi içerikler bir web sitesinin tipik yükü önemli olabilir. Ne yazık ki proje paydaşları mevcut ellerindeki medya kaynaklarını kesmek istemeyebilirler. izin verir. Bu tür çıkmazlar sinir bozucu, Özellikle projeye dahil olan tüm taraflar site performansını artırmak istediğinde, oraya nasıl ulaşacağım konusunda anlaşamıyorum. Neyse ki geç yükleme, ilk sayfa yükünü azaltan ve ancak içerikten atlanmıyor.
Geç yükleme nedir?
Geç yükleme, kritik olmayan kaynakların sayfadaki yüklenmesini erteleyen bir tekniktir yükleme süresidir. Bunun yerine, bu kritik olmayan kaynaklar gerekiyor. Resimler söz konusu olduğunda "kritik olmayan" genellikle eş anlamlıdır "ekran dışı" olarak ayarlayın. Lighthouse’u kullandıysanız ve bu alanda birtakım yönlendirmeler ve değerlendirmeler gibi Ekran dışındaki resimler denetimini erteleyin:
Tembel yüklemeyi zaten görmüşsünüzdür. bu:
- Bir sayfaya ulaşıyorsunuz ve içeriği okurken sayfayı kaydırmaya başlıyorsunuz.
- Bir noktada, yer tutucu resmi görüntü alanına kaydırırsınız.
- Yer tutucu resim aniden son resimle değiştirilir.
Görüntü geç yüklemenin bir örneğini popüler yayıncılık platformunda bulabilirsiniz Orta, hafif yer tutucu resimleri şurada yükler: sayfayı kaydırılırken sayfayı geç yüklenen resimlerle değiştirir görüntü alanını değiştirebilirsiniz.
Geç yükleme konusuna aşina değilseniz, bu uygulamanın ne kadar faydalı tekniği ve faydalarını öğreneceksiniz. Öğrenmek için okumaya devam edin.
Resimleri veya videoları yalnızca yüklemek yerine neden geç yüklemelisiniz?
Çünkü kullanıcının hiçbir zaman görmeyebileceği öğeler yüklüyorsunuz. Bu birkaç nedene dayanır:
- Veri israfına neden olur. Sayaçsız bağlantılarda, bu, ekibinizin (ancak indirme işlemi için değerli bant genişliğinizi diğer kaynaklar). Sınırlı veride Ancak kullanıcının hiç görmediği öğelerin yüklenmesi elde edebiliyorlar.
- İşlem süresini, pili ve diğer sistem kaynaklarını boşa harcar. Bir medyadan sonra indirildiğinde, tarayıcının kodu çözmesi ve içeriğini görünüm.
Resimlerin ve videoların geç yüklenmesi, ilk sayfa yükleme süresini kısaltır. sayfa ağırlığı ve sistem kaynağı kullanımını etkiler. Bu faktörlerin tümü, bazı yolları da görmüştük.
Geç yüklemeyi uygulama
Geç yüklemeyi uygulamanın birkaç yolu vardır. Çözüm seçiminizde, desteklediğiniz tarayıcılar ve ve aynı zamanda geç yüklemeye çalıştığınız şeylerdir.
Modern tarayıcılar tarayıcı düzeyinde geç yüklemeyi uygular,
Bu ayar, resimlerde ve iframe'lerde loading özelliği kullanılarak etkinleştirilebilir.
Eski tarayıcılarla uyumluluk sağlamak için
yerleşik geç yükleme olmadan öğelerde geç yükleme
kendi JavaScript'inizle bir çözüm uygulayabilirsiniz.
Ayrıca, bunu yapmanıza yardımcı olacak çeşitli kitaplıklar da vardır.
Bu yaklaşımların tüm ayrıntıları için bu sitedeki yayınlara bakın:
Ayrıca, geç yüklemeyle ilgili olası sorunların bir listesini derledik. ve uygulamanızda dikkat etmeniz gereken noktalar hakkında bilgi verelim.
Sonuç
Dikkatli bir şekilde kullanıldığında, resimlerin ve videoların geç yüklenmesi başlangıç hızını önemli ölçüde düşürebilir Core Web Vitals dahil olmak üzere sitenizdeki yükleme süresini ve sayfa yüklerini. Kullanıcılar gereksiz ağa tabi tutulmaz etkinliği (yavaş bağlantılardaki ağ çakışması dahil) ve hiçbir zaman görmeyebilecekleri medya kaynaklarının işleme maliyetleri yine de bu kaynakları görüntüleyebilir.
Performans iyileştirme teknikleri olduğu sürece geç yükleme, tartışmalı değildir. Sitenizde çok sayıda satır içi resim varsa gereksiz indirmeleri azaltmanın mükemmel bir yoludur. Sitenizin kullanıcıları ve Bunu takdir ederler.