Kadang website terasa lambat bukan karena JavaScript yang terlalu berat, tetapi karena gambar yang digunakan terlalu besar.
Misalnya sebuah gambar hanya ditampilkan dengan ukuran 500px di website, tetapi file aslinya memiliki ukuran 5000px. Browser tetap harus mengunduh file yang besar tersebut.
Gunakan Format yang Tepat
Untuk gambar di website, kita bisa menggunakan format seperti WebP atau AVIF agar ukuran file lebih kecil.
Contohnya:
<img
src="/images/profile.webp"
alt="Profile"
loading="lazy"
/>loading="lazy" juga bisa membantu karena gambar baru dimuat ketika sudah mendekati area yang terlihat oleh user.
Jangan Hanya Fokus ke Tampilan
Gambar yang bagus memang penting, tetapi performa juga perlu diperhatikan.
Beberapa hal sederhana yang bisa dilakukan:
* Kompres gambar sebelum digunakan
* Gunakan WebP atau AVIF
* Gunakan ukuran gambar sesuai kebutuhan
* Gunakan lazy loading
* Hindari gambar berukuran terlalu besar
Hal-hal kecil seperti ini cukup berpengaruh ketika website sudah memiliki banyak gambar.