HOTLINE

(0275) 2974 127

CHAT WA 24/7
0859-60000-390 (Sales)
0852-8969-9009 (Support)
Blog

Cara Mempercepat Loading Gambar Pada Website WordPress dengan Lazy Load

Lazy Loading adalah teknik optimasi gambar yang yang bekerja dengan cara menunda (delay) gambar sampai munncul di layar pembaca, dengan artian setelah konten bagian atas sepenuhnya sudah dimuat, maka gambar tidak akan dimuat. Jika pengguna tidak melakukan scroll sepenuhnya, maka gambar yang di bagian bawah halaman tidak akan dimuat. Jadi, Browser tidak akan memuat gambar jika pengguna tidak melakukan scroll ke gambar.

Lazy Loading bekerja hanya memuat gambar jika pengguna menggulir ke lokasi di mana gambar akan terlihat di dalam viewport. Jika tidak, maka gambar tidak akan dimuat.

Keuntungan Lazy Loading

  1. Mempercepat loading gambar
  2. Menghemat bandwidth dan Resource server, Lazy loading akan mengurangi beban server baik dari segi resource maupun bandwidth. Dengan begitu performa website akan menjadi lebih baik
  3. Pengunjung tidak perlu membuang banyak waktu hanya untuk menunggu gambar yang bahkan tidak akan mereka lihat.
  4. Meningkatkan User Experience, Dengan Lazy loading pengalaman pelanggan semakin baik. Terutama untuk mereka yang memiliki koneksi yang cukup buruk.

Plugin Lazy Loading untuk WordPress Terbaik

Menggunakan plugin lazy loading maka menerapkan fitur lazy loading semakin mudah walaupun untuk menambahkan Lazy Loading ke WordPress secara manual. Meski ada plugin khusus untuk menambahkan lazy loading di blog WordPress, fitur ini umumnya tersedia pada plugin caching, plugin kompresi gambar, dan plugin optimasi WordPress lainnya. jika memakai plugin semacam itu harus cek apakah settingan lazy load pada plugin tersebutatau tidak.

Jika tidak ada, beberapa plugin lazy load terbaik berikut ini bisa dijadikan rekomendasi plugin Lazy loading WordPress terbaik, yaitu :

1. WordPress Infinite Scroll – Ajax Load More

 WordPress Infinite Scroll – Ajax Load More digunakan untuk menerapkan lazy load pada scroll postingan, single post, page, komentar, dan elemen halaman lainnya dengan membangun shortcode custom yang diinginkan.

Dengan bantuan query berbasis Ajax, plugin ini dapat dengan mudah diintegrasikan dalam website e-commerce yang menggunakan WooCommerce dan Easy Digital.

2. WP Rocket

WP Rocket merupakan salah satu plugin All in One, plugin ini memiliki banyak fitur seperti caching, minify file, terutama pligin caching dan salah satu fitur yang dimiliki yaitu Lazy Load. Fitur lazy load digunakan pada gambar atau iframe termasuk thumbnail, konten widget, avatar, dan emoji.

Plugin ini merupakan plugin premium dan dapat menggunakan versi gratisnya dengan cara menginstall Lazy Load by WP Rocket. Plugin ini tidak menggunakan library JavaScript, Sehingga memiliki ukuran 10KB.

3. BJ Lazy Load

BJ Lazy load adalah plugin lazy load gratis terbaik yang sederhana, Plugin ini telah memiliki lebih dari 60.000 pemasangan.

BJ Lazy load untuk menerapkan lazy load pada website, Cukup dengan menginstall plugin ini dan mengaktifkannya maka fitur lazy load akan diterapkan secara otomatis. Plugin ini menggantikan semua gambar dan iframe (termasuk video YouTube dan Vimeo) di konten dengan placeholder hingga dilihat.

4. A3 Lazy Load

A3 Lazy Load adalah plugin lazy load gratis untuk menerapkan lazy load pada gambar, video, dan iframe dalam postingan, halaman, widget, thumbnail, dan avatar. Bahkan berfungsi untuk menyematkan postingan dan kompatibel dengan WooCommerce.

A3 Lazy Load mengklaim “Plugin lazy load dengan berfitur paling lengkap, Dan sangat mudah untuk mengatur plugin ini”. Plugin ini untuk memilih apakah akan memuat skripnya di header atau footer dan mengabaikan gambar atau video.

Beberapa fitur yang ada di plugin a3 lazy load antara lain :

  1. Mengaktifkan lazy load pada konten, widget, pot thumbnail, atau gravatar saja
  2. Exclude image berdasarkan class CSS atau URL tertentu
  3. Lazy load pada inframe
  4. Menambahkan lazy load pada horizontal scrolling
  5. Mengaktifkan lazy load hanya pada home page, pos, halaman, halaman kategori dll
  6. Mengatur letak script lazy load, di footer atau header
  7. Kompatibel dengan layanan Photon dari jetpack

5. Autoptimize

Autoptimes adalah salah satu plugin optimasi terbaik WordPress yang bisa dipakai untuk meningkatkan kecepatan loading blog WordPress. Fitur-fitur yang terdapat di plugin ini mulai dari mengoptimalkan CSS, Javascript, dan HTML, hingga lazy loading image.

Untuk mengaktifkan fitur ini mmasuk ke menu SETTING → AUTOPTIMIZE → IMAGES, lalu centang opsi Lazy-Load Images. Namun, di plugin ini menunya sedikit terbatas meski bisa mengatur gambar man saja yang akan diabaikan.

Sealain menu Autoptimize, plugin optimasi WordPress lain yang memiliki fitur lazy loading adalah Hummingbird, JCH Optimize, dan WP-Optimize.

6. Smush – Compress, Optimize and Lazy Load Images

Smush dari WPMUDEV  adalah salah satu plugin kompresi gambar terbaik untuk wordpress. Plugin ini bisa mengoptimalkan gambar dan membuat ukuran gambar lebih kecil. Dengan begitu gambar bisa di load lebih cepat tanpa banyak mempengaruhi kualitas gambar. Plugin ini tidak memiliki batasan berapa banyak gambar yang bisa dioptimasi, tidak seperti kebanyakan plugin optimasi gambbar yang memiliki pemakaian terbatas.

Smush juga memiliki fitur lazy loading yang diaktifkan dengan satu langkah mudah. Cukup dengan masuk menu SMUSH → DASHBOARD → LAZY LOAD, lalu klik ACTIVATE untuk mulai menambahkan lazy loading di blog WordPress.

Meski Smush masih di tahap Beta namun fiturnya berjalan dengan baik. Beberapa di antaranya adalah mengatur format gambar di load dengan lazy load, mengaktifkan lazy load di beberapa tempat saja (konten, widget, thumbnail dan gravatar), mengatur image placeholder, mengatur letak script lazy load (footer atau header).

Selain Smush plugin gambar WordPress lain yang memiliki fitur lazy loading images adalah Images Optimization & Lazy Load by Optimole, EWWW Image Optimizer dan Imagify.

Jadilah yang pertama untuk memberi nilai
Risa Y

Recent Posts

Mengenal Lebih Luas Apa Itu Digital Native

Digital native adalah istilah yang sering dibahas di kalangan para profesional bisnis dan aktivis teknologi,…

7 days ago

Cari Tahu Bagaimana Penerapan Data Science Serta Peluang Profesi

Perkembangan zaman yang semakin pesat diiringi dengan pemanfaatan data untuk pengembangan bisnis. Tahukah Anda bahwa…

7 days ago

Perbedaan Managed dan Unmanaged dalam Web Hosting

Karena adanya persaingan harga dalam layanan web hosting yang jelas antara satu layanan dengan yang…

7 days ago

Tutorial Cara Mendapatkan SSL Gratis

Membangun suasana yang dapat dipercaya saat melakukan transaksi adalah aspek krusial dalam perdagangan daring. Oleh…

1 week ago

Perbedaan VPS OpenVZ dengan VPS KVM

Saat Anda memutuskan untuk menggunakan hosting VPS, Anda mungkin akan dihadapkan pada berbagai pilihan yang…

1 week ago

Manajemen Memori Sistem Operasi: Pengertian, Fungsi, Serta Teknik Dasar

Halo, Sobat Teko! Apakah Anda pernah merenungkan bagaimana komputer atau perangkatmu mampu menjalankan berbagai aplikasi…

1 week ago