|
Cara Pasang Lazy Load Google Analytics di Blog - Mempercepat loading blog merupakan langkah optimasi yang baik untuk memberikan kenyamanan pengunjung saat memuat halaman situs baik melalui desktop atau smartphone.
Penyebab blog lemot saat diakses bisa disebabkan oleh berbagai hal, salah satunya adalah kode pelacakan Google analytics yang berdampak besar pada loading blog.
Dalam postingan kali ini kita akan membahas tentang cara memasang Lazy Load pada kode Google Analytics untuk mempercepat loading blog. Tapi sebelum masuk tahap tutorial kita akan bahas sedikit tentang Google Analytics.
Table of Contents
Apa itu Google Analytics?
Google Analytics merupakan tools online pelacak lalu lintas gratis milik Google yang banyak digunakan oleh blog atau website untuk menganalisis atau mendapatkan informasi lengkap secara akurat keadaan pengunjung blog.
Nah untuk bisa mendapatkan informasi lengkap tersebut bahkan memonitor pengunjung secara real time kita perlu mengaitkan Google Analystics ke blog dan menerapkan sebuah tag situs global gtag.js seperti di bawah kedalam html blog atau website.
<script async='async' src='https://www.googletagmanager.com/gtag/js?id=UA-xxxxxxx-x'/>
<script>
//<![CDATA[
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxxxx-x');
//]]>
</script>
Namun tidak jarang para blogger atau pemilik website mengeluhkan masalah yang sebagian mereka anggap besar yaitu kode pelacakan yang diberikan oleh Google analytics berdampak pada loading blog yang menjadi lambat.
Solusi untuk masalah ini cara paling mudah adalah menunda pemuatan kode javascript google analystics dengan cara memasang Lazy Load Google Analytics. Lalu bagaimana caranya?
Cara Memasang Lazy Load Google Analytics di Blog
- Buka Dasbhoard Blogger
- Masuk ke Tema > Edit HTML
- Cari dan hapus Kode Google Analytics sebelumnya (contoh kode seperti diatas tadi)
- Lalu salin dan paste kode di bawah ini tepat di atas tag </body>
- Jika sudah kemudian Simpan
<!-- Global site tag (gtag.js) - Google Analytics -->
<script>
var lazyanalisis=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyanalisis||0!=document.body.scrollTop&&!1===lazyanalisis)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-X";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyanalisis=!0)},!0)
</script>
<script>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments)}
gtag("js",new Date());
gtag("config","UA-XXXXXXXXX-X")
</script>
Jangan lupa ganti bagian yang disorot dengan ID pelacakan Analytics kamu.
Lazy Load Google Analytics 4
Jika blog atau website kamu sudah upgrade ID Google Analytics 4, kamu bisa menggunakan script lazy load GA4 berikut :
<script type="text/javascript">//<![CDATA[
var LazyAnalytics=false;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&false===LazyAnalytics||0!=document.body.scrollTop&&false===LazyAnalytics)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=true,e.src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),LazyAnalytics=true)},true);
//]]></script>
<script type="text/javascript">//<![CDATA[
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXXX');
//]]></script>
Cara Cek Kecepatan Blog atau Website
Kamu bisa memeriksa perubahan skor kecepatan blog atau website menggunakan tools pagespeed.web.dev atau GTmetrix yang bisa kamu manfaatkan secara gratis.
Penutup
Nah itu tadi Cara Pasang Lazy Load Google Analytics di Blog untuk mempercepat loading blog atau website. Jika artikel ini bermanfaat bisa kamu share dan rekomendasikan ke teman-teman yang membutuhkan, jika ada pertanyaan lain bisa bertanya melalui komentar.