Home
blogger
Tutorial

√ Cara Menambahkan Kode Lazy Load JavaScript Script di blogger

Dalam posting ini kita telah melihat bagaimana cara menambahkan kode javascript lazy load di blogger yang dapat meningkatkan kecepatan halaman Anda

 Best Koding.com | Cara Menambahkan Kode Lazy Load JavaScript Script di blogger - Salah satu cara terbaik untuk mempercepat waktu pemuatan halaman web adalah dengan malas memuat kode javascript yang dibutuhkan halaman Anda. Biasanya sebagian besar HTML dimuat ke halaman web untuk memuat gambar dan konten lain yang disematkan di halaman itu. Lazy loading kode javascript memungkinkan Anda memuat kode pada saat dibutuhkan alih-alih langsung memuatnya. 

Ini adalah panduan untuk menambahkan kode javascript lazy loading ke blogger Anda. Tutorial di sini menjelaskan cara memuat dan menampilkan hanya sebagian halaman, teknik yang dikenal sebagai pemuatan lambat atau pemuatan sesuai permintaan. Ini akan meningkatkan kinerja situs web Anda dengan mengurangi jumlah data yang ditransfer melalui jaringan sekaligus meningkatkan pengalaman pengguna.

Kecepatan halaman adalah faktor terpenting di blogger , jadi kami akan menambahkan javascript lazy load untuk meningkatkan kecepatan halaman di blogger.

Cara Menambahkan Kode Lazy Load JavaScript Script di blogger
Cara Menambahkan Kode Lazy Load JavaScript Script di blogger

Apa itu Lazy Loading?

Lazy loading adalah teknik untuk mengoptimalkan kecepatan memuat halaman Anda dengan membatasi unduhan awal sesuai kebutuhan pengguna di layar. Jika Anda memiliki banyak konten atau mengalami lalu lintas, ini dapat meningkatkan daya tanggap dan membuat halaman Anda dirender lebih cepat.

Lazy load dikembangkan pada September 2010 oleh Julian Shapiro demi Google. Sebagian besar situs yang menggunakan metode ini meletakkan kode boilerplate di situs web mereka yang tidak dapat dibaca Google untuk memuat sumber daya saat dibutuhkan. Akibatnya, sumber daya dimuat di browser lebih cepat dan menyelamatkan pengguna dari kerepotan menunggu situs web lambat dengan penggunaan bandwidth dalam jumlah besar.

Bagaimana Cara Menambahkan Kode Javascript Lazy Load di blogger?

Anda harus mengikuti proses langkah demi langkah untuk menambahkan kode javascript lazy load ke blog blogger Anda.

  • Langkah 1 : Masuk ke akun blogger Anda
  • Langkah 2 : Sekarang buka bagian tema
  • Langkah 3 : Di bagian Tema, buka Kustomisasi dan sesuaikan, buka Edit HTML
  • Langkah 4 : Sekarang Di Bagian Edit Anda harus mengganti javascript eksternal Anda dengan kode javascript beban malas
Silakan buat cadangan file Anda terlebih dahulu dan kemudian masukkan kode berikut di bawah ini.

 Kode lama File Javascript: 

<script src="https://example.com/script.js"></script>

Kode Javascript Lazy Load Baru untuk file javascript tunggal: 

<script>
  var resource = document.createElement('script'); 
  resource.async = "true";
  resource.src = "https://example.com/script.js";
  var script = document.getElementsByTagName('script')[0];
  script.parentNode.insertBefore(resource, script);
</script>

Kode ini hanya berlaku bila Anda memiliki satu file eksternal javascript.

Kode ini hanya berlaku bila Anda memiliki satu file eksternal javascript.  

<script type="text/javascript">
function script(url) {
    var s = document.createElement('script');
    s.type = 'text/javascript';
    s.async = true;
    s.src = url;
    var x = document.getElementsByTagName('head')[0];
    x.appendChild(s);
}
</script>

<script>
script('https://yoursite.com/your-script.js');
script('https://yoursite.com/my-script.js');
script('https://yoursite.com/third-party-script.js');
</script>

Kode ini berlaku ketika Anda memiliki beberapa file skrip javascript eksternal atau beberapa file javascript dinamis.

Mengapa kita harus Menggunakan Kode Javascript Lazy Load di blogger?

 Alasan dibalik penggunaan kode javascript loading lambat adalah untuk memuat konten minimum pada awalnya dan kemudian ketika pengguna menggulir ke bawah halaman, lebih banyak konten akan dimuat. Fitur ini akan berguna untuk blog kita dimana kita memiliki banyak teks dengan jumlah gambar yang banyak. Dengan menggunakan kode lazy load ini situs blogger dapat memuat halaman lebih cepat dan juga menghemat bandwidth.

Manfaat Menggunakan Kode Javascript Lazy Load di blogger

  • Manfaat besar menggunakan kode Javascript Lazy Load di blogger adalah mengurangi waktu pemuatan halaman.
  • Hemat bandwidth, waktu muat lebih cepat, tampilan halaman blog lebih sering.
  • Pemuatan malas meningkatkan waktu pemuatan blog. Pengunjung dapat melihat konten dengan cepat setelah mengklik halaman. Ini juga meminimalkan kemungkinan situs web Anda mogok karena lalu lintas tinggi. Para pengguna akan menyukainya.
  • Itu bisa meningkatkan kecepatan loading blog Anda hingga 80%
  • Situs web Anda akan mengalami peningkatan besar dalam kecepatan muat, terutama di perangkat seluler.

Penutup

Jadi jika Anda harus meningkatkan kecepatan halaman situs web Anda maka saya harus merekomendasikan menggunakan kode javascript pemuatan lambat ini secara drastis akan meningkatkan kecepatan halaman Anda hingga 80%. 

Semoga bermanfaat.

Post a Comment