Beranda » Toolkit » Secara progresif membuat Anda malas memuat gambar dengan Vanilla JS

    Secara progresif membuat Anda malas memuat gambar dengan Vanilla JS

    Setiap situs web modern harus cepat. Meskipun ada banyak teknik dan plugin untuk meningkatkan kecepatan halaman, Anda mungkin tidak tahu harus mulai dari mana.

    Skrip Progresif adalah a sumber yang bagus untuk meningkatkan kecepatan halaman. Ia berfungsi sebagai skrip pemuatan gambar yang malas yang memuat gambar secara progresif saat pengguna menggulir ke bawah halaman.

    Ini adalah proyek open source gratis sehingga Anda dapat mengunduh dan menjalankannya di situs web apa pun. Ditambah lagi beroperasi pada 100% vanilla JS sehingga tidak ada ketergantungan yang dapat membebani Anda.

    Anda dapat melihat demo langsung di beranda Progresif.

    Ini sedikit berbeda dari skrip lazy lainnya karena skrip ini menjaga ukuran gambar tetap untuk seluruh halaman. Ini mencegah lompatan halaman yang sangat menyebalkan yang Anda lihat setiap kali gambar dimuat dengan cepat dan menambah tinggi konten.

    Dan placeholder gambar benar-benar terlihat seperti gambar yang Anda muat. Luar biasa!

    Teknik yang rapi ini memberi pengunjung kesempatan untuk pratinjau seperti apa gambar itu sebelum dimuat. Semuanya ditangani melalui JavaScript yang memeriksa lokasi pengguna di halaman tersebut dan melakukan pramuat gambar saat mulai terlihat.

    Secara progresif memang memiliki a API yang cukup luas jadi itu pilihan yang bagus untuk pengembang web. Pengaturan ini bisa bersifat teknis sehingga sangat membantu jika Anda mengetahui cara Anda menggunakan kode dasar frontend.

    Tetapi Anda dapat mempelajari lebih lanjut di halaman utama GitHub yang mencakup dokumentasi API lengkap, instruksi pengaturan, dan cuplikan kode sampel yang dapat Anda salin / tempel untuk proyek Anda.

    Jika Anda memerlukan skrip gambar pemuatan malas yang tepercaya tanpa dependensi jahat, maka coba coba Progresif. Ini benar-benar gratis dan menawarkan banyak penyesuaian untuk pengembang.

    Coba juga intip GitHub Progresif untuk mempelajari lebih lanjut dan menemukan kode sumber yang dapat diunduh.