Üçüncü taraf kaynakları, genellikle reklam ya da video göstermek ve sosyal medyayla entegrasyon sağlamak amacıyla kullanılır. Varsayılan yaklaşım, üçüncü taraf kaynaklarını sayfa yüklenir yüklenmez yüklemektir, ancak bu durum sayfa yüklemesini gereksiz şekilde yavaşlatabilir. Üçüncü taraf içeriği kritik değilse bu performans maliyeti, içeriğin geç yüklenmesi ile azaltılabilir.
Bu denetim, etkileşimde geç yüklenen üçüncü taraf yerleştirmelerini vurgular. Bu durumda, kullanıcı etkileşimde bulununcaya kadar üçüncü taraf içeriği yerine bir cephe kullanılır.
Lighthouse, ertelenebilir üçüncü taraf yerleştirmelerini nasıl algılar?
Lighthouse, sosyal medya düğmesi widget'ları veya video yerleştirmeleri (ör. yerleşik YouTube oynatıcısı) gibi ertelenebilen üçüncü taraf ürünleri arar.
Ertelenen ürünler ve kullanılabilir cephelerle ilgili veriler üçüncü taraf web'de tutulur.
Sayfa, bu üçüncü taraf yerleştirmelerinden birine ait kaynakları yüklüyorsa denetim başarısız olur.
Üçüncü taraflar hafif bileşenle nasıl ertelenir?
Doğrudan HTML'nize üçüncü taraf yerleştirme eklemek yerine sayfayı gerçek yerleşik üçüncü tarafa benzeyen statik bir öğeyle yükleyin. Etkileşim kalıbı aşağıdaki gibi görünmelidir:
Yüklemede: Sayfaya hafif bileşen ekleyin.
Fare üzerine getirildiğinde: Cephe üçüncü taraf kaynaklarına önceden bağlanır.
Tıklandığında: Dış cephe kendini üçüncü taraf ürünle değiştirir.
Önerilen cephe seçenekleri
Genel olarak, video yerleştirmeleri, sosyal düğme widget'ları ve sohbet widget'larının tümü dış cephe desenini kullanabilir. Aşağıdaki listede açık kaynaklı cepheler için önerilerimiz bulunmaktadır. Dış cephe seçerken boyut ve özellik grubu arasındaki dengeyi göz önünde bulundurun. vb/lazyframe gibi bir geç iframe yükleyicisi de kullanabilirsiniz.
Yerleştirilmiş YouTube oynatıcısı
Vimeo yerleştirilmiş oynatıcı
Canlı sohbet (Intercom, Drift, Help Scout, Facebook Messenger)
Kendi cephenizi yazma
Yukarıda belirtilen etkileşim kalıbını kullanan özel bir dış görünüm çözümü oluşturmayı seçebilirsiniz. Dış cephe, ertelenen üçüncü taraf ürününe kıyasla önemli ölçüde daha küçük olmalı ve yalnızca ürünün görünümünü taklit edecek kadar kod içermelidir.
Çözümünüzün yukarıdaki listeye dahil edilmesini istiyorsanız gönderim sürecine göz atın.
Kaynaklar
Üçüncü taraf kaynaklarını hafif bileşen denetimiyle geç yükleme kaynak kodu.