Minggu, 21 September 2014

Cara Meringankan Loading Blog Dengan Cara Compress Javascript

Cara Meringankan Loading Blog Dengan Cara Compress Javascript - Hai sobat blogger, ternyata Javascript sangat mempengaruhi pada loading blog. Dengan menambahkan banyak JS pada template blog, akan membuat loading blog semakin lelet.

Javascript Logo

Untungnya kini sudah ada cara untuk mempercepat loading blog tanpa menghilangkan JSnya dan tanpa mengurangi fungsi utama dari JS tersebut.

Sebelum melakukan cara ini alangkah baiknya anda mengecek kecepatan loading blog anda di https://developers.google.com/speed/pagespeed/insights/

Cara :

1. Pada Dashboard blogger klik Template > Edit HTML

2. Cari Javascript yang ingin anda Kompres, sebagai contoh lihat gambar dibawah.

Javascript

Disitu saya akan mengompres 
<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>

Saya akan men-cut dulu JS yang berwarna merah dengan cara menekan Ctrl+x pada keyboard dan menyimpannya pada notepad, sedangkan sisanya yang berwarna biru saya hapus.

3. Sekarang Copy Script dibawah ini.
<script type="text/javascript">
 (function() {
 var css = document.createElement('link');
 css.href = '//LinkJavascriptAnda.js';
 css.rel = 'stylesheet';
 css.type = 'javascript'; document.getElementsByTagName('head')[0].appendChild(javascript);
 })();
</script>
Ganti Script yang berwarna hijau dengan JS berwarna merah, seperti yang saya simpan tadi.

4. Taruh Scriptnya diatas kode </body>

Kurang lebih hasilnya akan seperti ini.

Javascript Compressed

Sekarang coba cek lagi loading blog anda di https://developers.google.com/speed/pagespeed/insights/. Apabila loading blog anda bertambah cepat dari sebelumnya, itu berarti anda sudah mempraktekkan dengan baik cara yang saya berikan.

Artikel Terkait

Cara Meringankan Loading Blog Dengan Cara Compress Javascript
4/ 5
Oleh

8 komentar

21 September 2014 18.16 delete

Izin coba mastah :D
Blog ane juga berat :3

Reply
avatar
21 September 2014 21.44 delete

Semoga work di blognya. Suhu -/\-

Reply
avatar
22 September 2014 15.11 delete

itu css, ya tinggal ditaruh aja mas di templatenya
<link href='//netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css' rel='stylesheet'/>
buka //netdna.bootstrapcdn.com/font-awesome/3.1.1/css/font-awesome.min.css copy semuanya pastekan di css template :D jauh lebih cepet

Reply
avatar
22 September 2014 16.21 delete

Makasih tipsnya Mas Arif, bisa buat pelajaran bagi saya ^_^

Reply
avatar
28 Januari 2015 14.37 delete

terimakasih banyak sob buat tutorialnya, sangat membantu.. mantab

Reply
avatar
3 Juni 2015 19.46 delete

COPAS Dari Seowaps.com pake sumber bang

Reply
avatar

Mohon masukkan saran / kritikan Anda. Atau tanyakan sesuatu yang tidak Anda pahami. Free promosi asal sopan.