Resource pihak ketiga sering digunakan untuk menampilkan iklan atau video dan berintegrasi dengan media sosial. Pendekatan default adalah memuat resource pihak ketiga segera setelah halaman dimuat, tetapi hal ini dapat memperlambat pemuatan halaman secara tidak perlu. Jika konten pihak ketiga tidak penting, biaya performa ini dapat dikurangi dengan pemuatan lambat.
Audit ini menyoroti sematan pihak ketiga yang dapat dimuat secara lambat saat terjadi interaksi. Dalam hal ini, fasad digunakan sebagai pengganti konten pihak ketiga hingga pengguna berinteraksi dengannya.
Cara Lighthouse mendeteksi sematan pihak ketiga yang dapat ditunda
Lighthouse mencari produk pihak ketiga yang dapat ditangguhkan, seperti widget tombol media sosial atau sematan video (misalnya, pemutar tersemat YouTube).
Data tentang produk yang dapat ditangguhkan dan fasad yang tersedia dikelola di third-party-web.
Audit akan gagal jika halaman memuat resource milik salah satu sematan pihak ketiga ini.
Menunda pihak ketiga dengan facade
Daripada menambahkan sematan pihak ketiga langsung ke HTML, muat halaman dengan elemen statis yang terlihat mirip dengan pihak ketiga yang disematkan sebenarnya. Pola interaksi akan terlihat seperti ini:
- Saat dimuat: Tambahkan fasad ke halaman.
- Saat kursor diarahkan ke atasnya: Fasad melakukan pra-koneksi ke resource pihak ketiga.
- Saat diklik: Facade menggantikan dirinya sendiri dengan produk pihak ketiga.
Fasad yang direkomendasikan
Secara umum, sematan video, widget tombol media sosial, dan widget chat dapat menggunakan pola fasad. Saat memilih fasad, perhatikan keseimbangan antara ukuran dan set fitur.
Daftar berikut berisi rekomendasi fasad open source kami. Anda juga dapat menggunakan pemuat iframe lambat, seperti vb/lazyframe.
Pemutar tersemat YouTube
Pemutar tersemat Vimeo
Live chat (Intercom, Drift, Help Scout, Facebook Messenger)
Menulis fasad Anda sendiri
Anda dapat memilih untuk membangun solusi fasad kustom yang menggunakan pola interaksi yang diuraikan sebelumnya. Fasad harus jauh lebih kecil dibandingkan dengan produk pihak ketiga yang ditangguhkan dan hanya menyertakan kode yang cukup untuk meniru tampilan produk.
Jika Anda ingin solusi Anda disertakan dalam daftar, lihat proses pengiriman.
Resource
Kode sumber untuk Audit muat lambat resource pihak ketiga dengan fasad.