Kumpulan Kode Lazyload Adsense dan Image

RYANID.MY.ID - Ada beragam jenis kode Lazyload Adsense yang tersebar diinternet, kebanyakan yang pernah aku temui semuanya rata-rata sama. Kok bisa? Iya karena kode ini yang sifatnya terbuka atau open source jadi kebanyakan blogger memposting ulang topiknya, semakin hari semakin banyak blogger yang memposting topik terkait.

Lazyload adsense adalah serangkaian kode javascript untuk membuat penundaan sementara terhadap pemuatan skrip eksternal ads.js, skrip ini jika dimuat bersamaan dengan loading halaman ia akan langsung bekerja. ads.js akan bekerja dengan mengisi semua slot iklan Adsense dengan iframe, javascript, serta css. Itulah sebabnya kode iklan adsense bisa menyebabkan performa buruk dari segi penilaian Page Speed Insight.

Namun disini kamu punya masalah lain, menunda pemuatan iklan selama beberapa mili detik bisa mengurangi viewable iklan dan juga pendapatan. Mau pilih yang mana, Penghasilan besar atau kecepatan halaman bagus? Semuanya tergantung kebutuhan kamu.

Kalau penulis lihat, blog Mbak igniel menggunakan lazyload mode scrolling yang artinya bila tidak ada aktifitas gulir halaman iklan tidak akan ditampilkan. Kemudian blog Mastimon.com menggunakan lazyload mode penundaan selama 3 detik (3000ms). Cuma lazyload mode penundaan baik tunda setelah halaman dimuat maupun tunda 3 detik punya sisi kelemahan. Metode ini tetap akan berkontribusi membuat loading lama, hal ini disebabkan ketika artikel kamu rame dan butuh waktu 3 detik lebih untuk memuat maka skrip iklan akan ikutan di eksekusi juga hasilnya pemuatan halaman jadi tambah lama.

Pada blog ryanjhr350.blogspot.com menggunakan metode dua arah, pertama menggunakan Lazyload setelah halaman dimuat, dan kedua menggunakan metode onscrolling. Penulis melakukanya untuk meningkatkan pendapatan dibanding kecepatan, kenapa? Karena sebelum iklan dimuat, visitor sudah buru-buru menggulir ke arah konten. Jadi dalam waktu kurang dari 2 menit visitor sudah kabur, sementara iklan baru saja dimuat (ini artinya pendapatan jadi berkurang).

Berikut ini adalah beberapa kode lazyload untuk blog yang bisa kamu terapkan, silakan pilih saja mana yang paling cocok dan sesuai untukmu. Pasang kode ini, dan lakukan tes di Page Speed Insight untuk mengetahui hasilnya. Jangan cuma di halaman home, tapi tes juga untuk halaman lain halaman artikel, pages, dan lain-lain.

Kode Lazyload Dengan menggunakan Skrip deferjs

Deferjs adalah library javascript yang fungsinya untuk membuat serangkaian penundaan terhadap gambar, javascript, iframe, dan css eksternal. Library ini bahkan bisa diintegrasikan dengan css, sehingga tampilanya lebih bagus. Kamu bisa pakai css animatios sebagai pengganti loading buat iframe, dan gambar. Untuk menggunakan deferjs kamu wajib memasang library nya pada halaman, ukuran minify dari deferjs ini sangat kecil. Kode library idealnya dipasang pada di dalam tag head. Letakan kode ini dalam tag

Menunda skrip selama 3000ms dengan setTimeOut

Cara penundaan ini digunakan oleh mastimon.com dan kerap kali digunakan oleh penyedia jasa optimasi. Mereka mengumpulkan banyak skrip eksternal yang tidak di utamakan untuk dimuat belakangan. Caranya deengan setTimeOut, ini bukan timer namun akan mengeksekusi statemen dalam waktu jedah tertentu. Namun metode ini kurang cocok buat website yang punya loading di atas 2000ms, pastinya halaman tetap akan dibaca lambat oleh pengujian Pege Speed Google.

Penulis pernah mencobanya, hasil tes bisa menunjukan 99% bagus dalam skor penilaian kecepatan menurut speed insight google. Tapi begitu penulis menambah dokumen pada artikel, jumlah gambar dan media dalam halaman tersebut tampaknya speed load jadi lambat. Halaman dimuat selesai dalam waktu 2000ms lebih sampai pada akhirnya kode skrip js di eksekusi bersamaan oleh browser. Proses di bawah ini kita membuat sebuah function khusus untuk menambahkan tag script pada head, kode dibawah ini idealnya ditempatkan sebelum tag

Menunda Pemuatan sampai halaman 100% dimuat (Loaded)

Ada skrip lain yang dimana dia akan menjakankan stetemen fungsi ketika halaman 100% sukses dimuat sepenuhnya. Cara ini kurang efektif untuk menghindari pengukuran Page Speed Google. Sebab prinsip kerjanya ini mirip dengan paralel process, begitu proses muat page selesai maka proses kedua dilanjutkan dengan memuat skrip eksternal.

Untuk yang ini penulis mengambil kode sampel nya dari blog KompiAjaib.com, salah satu blog yang sering membahas seputar kode tentang blogger. Kode ini mungkin berbeda dari yang dibagikan kompiajaib, sebab ini adalah kode yang penulis gunakan dari tahun 2019-2020. Sudah melewati beberapa modifikasi sedikit. Penulis membuat function khusus agar bisa digunakan untuk multiple skrip. Catatan, kamu tidak wajib mengganti skrip yang bergaris bawah kalau menggunakan Adsense. Kecuali kamu menggunakan iklan lain.

Memuat Skrip Eksternal saat halaman discroll (gulir aktif)

Metode ini adalah yang paling efektif, sebab dia bisa 100% menghindari pengukuran buruk oleh Page Speed google. Kenapa? Karena tidak ada interaksi berupa gulir halaman, sehingga skrip js iklan tidak akan dimuat. Kamu akan melihat iklan kotak atau blank, bahkan tidak ada iklan sama sekali ketika menggunakan snapshoot pengukuran page insight. Ini artinya iklan benar-benar tidak dimuat ketika bot crawler datang ke website kita.

Kelemahan dari metode ini adalah tidak bisa memasang iklan pada area above fold. Apa itu above fold? Dalam bahasa indonesianya above fold adalah halaman terlihat atau halaman website bagian atas yang tampil pada layar. Jika kamu menempatkan iklan pada area ini iklan tersebut tidak akan tampil sampai pengunjung menggulir halaman. Dan ketika halaman di gulir ke atas, otomatis iklan ada di posisi above fold akan berada pada pada bagian yang tidak nampak dilayar. Peluang keterlihatan iklan nya kecil banget!.

Hal ini bisa mengurangi pendapatan karena viewable nya kecil. Kamu mungkin tidak menyadari kalau Google Adsense juga mengukur seberapa lama iklan tampil dalam halaman terlihat oleh pembaca. Cara ini digunakan google untuk mengukur keefektifan iklan, jadi situs web yang paling bagus viewable nya paling banyak dikejar oleh advertiser. Pendapatanpun bisa gede, jadi jangan heran kalau kamu bisa dapet iklan dengan cpc rendah. Baca halaman google tentang tampilan terlihat.

Kode Skrip dibawah ini idealnya diletakan sebelum tag penutup , silakan langsung copy paste skrip kalau mau diganti saja javascript eksternal nya. Sesuain aja sama keinginan kamu.

Pilihan ada di tangan kamu mana yang paling mudah dan paling cocok digunakan. Pada dasarnya kita tidak ingin mengurangi pendapatan iklan, tapi karena kebijakan Google banyak orang yang ikut-ikutan peraturan google. Padahal semua website yang ada diinternet itu lambat semua, kecuali halaman cache Google dan halaman yang di optimalisasi.

Algoritma Page Speed google sekarang tidak hanya mengukur kecepatan muat halaman dari sisi dokumen saja. Tapi ada juga pengukuran LCP, FCP, TBT dan CLS. Mereka berperan dalam pemblokiran dom yang membuat halaman jadi lambat dirender oleh browser. Begitu juga javasrcript eksternal iklan, selain menyebabkan penundaan render sementara juga berkontribusi dalam LCP, FCP, TBT, dan CLS. Faktanya skrip Adsense saat dimuat dia akan langsung mengisi semua slot iklan, baik dengan iframe, css, maupun javascript.