Optimasi Gambar Dengan CDN Staticaly di Blogger

Daftar isi [Tampil]
Tutorial Belajar Membuat Icon
Optimasi Gambar Dengan CDN Staticaly ini ada solusi agar blog kita bisa kenceng pada saat di akses, kebanyakan pengaruh lambat blog berpengaruh pada gambar oleh karena itu harus di optimal kan.

Sebenarnya artikel ini sudah lama ada namun saya mencoba untuk menulis kembali di blog saya mungkin artikel ini sejak ada tahun 2018 yang lalu yang dimana ditulis oleh Kompi Ajaib.

Apabila menggunakan Blogger tentu untuk hosting tersebut akan menggunakan untuk gambarnya. Akan tetapi itu harus tambahan optimasi agar gambar bisa di lebih cepat lagi, ini adalah gambar yang sudah di optimasi dengan CDN Staticaly dan belum di optimasi.

Kedua gambar di atas adalah sudah dioptimasi dengan CDN Staticaly dan yang belum di optimasi. Sebelum ke tutorial apa sih yang disebut dengan CDN Staticaly?

Apa Itu CDN?

CDN adalah kumpulan server global yang ada di seluruh dunia yang terletak di beberapa data center yang tersebar di seluruh dunia. Tujuan dari data center ini adalah untuk mengirim content ke suatu website, yang dilakukan oleh CDN ini sendiri mengirimkan data sangat cepat kepada visitor dari lokasi terdekat dengan lokasi paling memungkinkan.

Contoh nya aja jika visitor kalian dari Indonesia terus data kalian dari Amerika tentu akan membutuhkan waktu yang lama untuk mengirim data. Dengan adanya CDN maka data akan dikirim maka data akan dikirim melalui data terdekat misalnya aja di Singapura.


Optimasi Gambar Dengan CDN Staticaly di Blogger

Untuk menggunakan CDN Staticaly di Blogger ini sangat lah mudah ini adalah cara manual apabila ingin menggunakan CDN Staticaly.

https://2.bp.blogspot.com/-pB5sVdkn88o/W6rkzskMGYI/AAAAAAAAEC8/sGWln4I5jhc1GL-p1JXYXus-hc8xUVIZwCLcBGAs/s1600/cdn-staticaly.png

Kalian cukup mengganti https:// dengan https://cdn.statically.io/img/ sehingga menjadi seperti berikut.

<img border="0" data-original-height="815" data-original-width="1280" src="https://cdn.statically.io/img/4.bp.blogspot.com/-huIADrjEcTY/W6nUEm9nqSI/AAAAAAAAzM0/PhzkECo_SZYX0bL1ILxfNW11pOx-X2TUACLcBGAs/s1600/gambar-blogger.png" />

Gimana mudah kan. 

Apabila tidak ingin ribet dengan cara yang diatas bisa langsung aja gunakan script di bawah ini maka akan otomatis CDN Staticaly pada gambar, tempatkan kode di bawah ini di atas </body>

<script>
//<![CDATA[
var images = document.getElementsByTagName('img');
  for (var i = 0; i < images.length; i++) {
    images[i].src = images[i].src.replace(/.*?:\/\//g ,
"https://cdn.statically.io/img/");
  };
//]]>
</script>

Saya sendiri juga sudah pasang script diatas untuk optimasi blog saya ini, apa disini kalian masih bingung dengan cara ini. Jika masih bingung bisa langsung tanyakan di kolam komentar. 

Sudar