malas Memuat

Lazy loading menunda pemuatan sumber daya hingga dibutuhkan, paling umum dengan menunda gambar, iframe, dan komponen hingga mendekati area yang terlihat di layar. Tujuannya adalah untuk mengurangi pekerjaan yang diperlukan untuk merender tampilan awal, sehingga konten yang langsung dilihat pengunjung tidak bersaing untuk mendapatkan bandwidth dan pemrosesan dengan konten yang jauh di bawah lipatan layar yang mungkin tidak pernah dilihat sama sekali.

Teknik ini menjadi mudah diterapkan untuk gambar dan iframe, di mana atribut browser bawaan menanganinya tanpa JavaScript apa pun, dengan browser memutuskan kapan harus mulai memuat berdasarkan kedekatan dengan viewport dan kondisi koneksi. Untuk komponen dan rute, pemisahan kode mencapai hal yang setara dengan menunda bundel JavaScript hingga rute dikunjungi atau fitur digunakan, yang dapat secara substansial mengurangi jumlah skrip yang harus diunduh dan dieksekusi sebelum halaman menjadi interaktif.

Kesalahan yang paling umum dan merusak adalah menerapkannya secara sembarangan, termasuk pada konten di tampilan awal. Lazy loading gambar hero menunda elemen yang menentukan ukuran contentful paint terbesar, dan menghasilkan hasil yang lebih buruk daripada tidak menerapkan teknik tersebut sama sekali. Pola yang benar adalah memuat konten di bagian atas halaman dengan cepat, idealnya dengan petunjuk prioritas, dan hanya menunda konten yang benar-benar berada di bawah halaman. Penerapan secara menyeluruh melalui plugin atau pengaturan global adalah bagaimana situs web akhirnya memiliki metrik pemuatan yang lebih buruk setelah menerapkan optimasi kinerja.

Stabilitas tata letak adalah pertimbangan kedua. Gambar yang ditunda dan tiba tanpa ruang yang dipesan menyebabkan konten bergeser saat dimuat, yang mengubah peningkatan kecepatan pemuatan menjadi masalah ketidakstabilan visual. Dimensi atau rasio aspek eksplisit pada setiap elemen yang ditunda bukanlah pilihan, dan placeholder yang menempati ruang yang tepat adalah yang membuat penundaan tidak terlihat oleh pengguna, bukan hanya lebih cepat.

Ada beberapa kasus di mana teknik ini tidak tepat. Konten yang harus ada agar mesin pencari dapat mengindeksnya dengan andal, halaman yang dapat dicetak di mana semuanya harus ditampilkan, dan antarmuka di mana pengguna secara rutin menggulir dengan cepat melalui daftar panjang, semuanya akan terpengaruh oleh penundaan pemuatan yang agresif. Dalam kasus terakhir, gambar yang hanya dimuat saat mendekati area pandang tiba terlalu lambat untuk pengguna yang menggulir dengan cepat, menghasilkan serangkaian placeholder kosong, dan diperlukan margin pemuatan yang lebih besar atau strategi yang berbeda.

Pertimbangan terkait lainnya adalah apa yang terjadi ketika penundaan pemuatan gagal. Jika gambar hanya dimuat melalui JavaScript yang tidak dieksekusi, karena kesalahan, skrip yang diblokir, atau browser tanpa dukungan, halaman akan ditampilkan tanpa gambar dan tidak ada mekanisme cadangan. Penundaan pemuatan bawaan browser sepenuhnya menghindari hal ini, yang merupakan salah satu alasan mengapa hal ini harus lebih disukai daripada implementasi berbasis skrip di mana pun hal itu mencukupi. Di mana pendekatan berbasis skrip benar-benar diperlukan, menyediakan mekanisme cadangan yang memuat konten ketika mekanisme tersebut tidak tersedia adalah pekerjaan kecil yang mencegah kategori kegagalan yang tidak terlihat dalam pengujian normal dan memengaruhi sebagian kecil tetapi nyata dari pengunjung.

Jika diterapkan dengan bijak, penundaan pemuatan (deferral) adalah salah satu teknik yang paling efektif untuk halaman dengan konten yang cukup banyak di bagian bawah halaman (below-the-fold), yang mencakup sebagian besar daftar produk, artikel, dan halaman pemasaran yang panjang. Dalam praktiknya, ini adalah salah satu komponen dari strategi pemuatan yang lebih luas yang dibahas dalam kinerja web pekerjaan, bersamaan dengan format dan ukuran gambar, prioritas sumber daya, dan struktur bundel, dan dampaknya paling besar pada e-commerce konteks di mana halaman kategori memuat puluhan gambar dan pengunjung seluler menanggung beban penuh untuk memuat semuanya sekaligus.