Lewati ke konten
Web & Digital

Lazy loading

Teknik yang menunda pemuatan gambar dan konten di luar layar sampai pengguna menggulir mendekatinya, sehingga waktu muat awal halaman berkurang.

Lazy loading meningkatkan performa dengan memuat hanya konten yang terlihat di viewport saat halaman pertama kali dibuka. Gambar di bawah lipatan pertama tetap berupa placeholder ringan sampai pengguna menggulir ke arahnya, lalu unduhan gambar asli dimulai. Lazy loading native melalui atribut HTML loading='lazy' didukung oleh browser modern dan tidak membutuhkan JavaScript. Intersection Observer API memberi kontrol lebih besar untuk implementasi khusus. Untuk gambar hero yang terlihat di bagian atas halaman, lazy loading sebaiknya dinonaktifkan karena gambar tersebut perlu dimuat segera agar Largest Contentful Paint optimal. Lazy loading yang terlalu agresif dan menunda konten yang sudah terlihat akan merusak persepsi performa. Keseimbangan yang tepat adalah memuat konten yang terlihat secara langsung dan menunda sisanya.