Progresif Membiarkan Anda Lazy Muat Imej Dengan Vanilla JS

Setiap laman web moden perlu cepat. Walaupun terdapat banyak teknik dan plugin untuk meningkatkan kelajuan halaman, namun, anda mungkin tidak tahu di mana untuk bermula.

Skrip Progresif adalah a sumber yang hebat untuk meningkatkan kelajuan halaman. Ia berfungsi sebagai skrip imej memuatkan malas yang memuatkan gambar secara progresif sebagai pengguna menatal ke bawah halaman.

Ia adalah projek sumber terbuka percuma supaya anda boleh memuat turun dan menjalankannya di mana-mana laman web. Plus itu berjalan pada 100% vanila JS jadi ia mempunyai sifar kebergantungan yang boleh menembusi anda.

Anda boleh melihat demo langsung di laman web Progresif.

Ini sedikit berbeza daripada skrip beban malas lain kerana ia menyimpan saiz imej tetap untuk keseluruhan halaman. Ini menghalang lompat halaman yang sentiasa menjengkelkan sehingga anda melihat apabila imej dengan cepat dimuatkan dan meningkatkan ketinggian kandungan.

Dan ruang letak imej sebenarnya kelihatan seperti imej yang anda muatkan. Awesome!

Teknik kemas ini memberi peluang kepada pelawat pratonton imej yang kelihatan seperti sebelum dimuatkan. Ini semua ditangani melalui JavaScript yang memeriksa lokasi pengguna pada halaman dan memuatkan imej sebelum mereka melihatnya.

Secara progresif mempunyai a API yang agak luas jadi itu adalah pilihan yang hebat untuk pemaju web. Persediaan boleh mendapatkan teknikal supaya ia dapat membantu jika anda mengetahui cara anda mengelilingi pengekalan asas asas.

Tetapi anda boleh mengetahui lebih lanjut mengenai halaman utama GitHub yang termasuk dokumentasi API penuh, arahan persediaan dan potongan kod sampel yang anda boleh salin / tampal untuk projek anda.

Sekiranya anda memerlukan skrip imej malas yang boleh dipercayai, tanpa kebergantungan yang buruk, kemudian memberikan Pukulan secara Progresif. Ia benar-benar percuma dan menawarkan banyak penyesuaian untuk pemaju.

Juga lihat pada Progresif GitHub untuk mengetahui lebih lanjut dan menangkap kod sumber yang boleh dimuat turun.