Cara Meringankan CSS dan Javascript pada Blogger - Seberapa banyak dan efektifnya CSS dan Javascript yang kamu gunakan untuk menghias tampilan Blog atau website-mu? Saran saya, guankan CSS dan Javascript seperlunya saja. Buang CSS dan Javascript yang tidak digunakan. Karena, perbedaan bebearapa Byte saja sangat berpengaruh bagi kecepatan loading blog atau website.
Selain menghapus CSS dan Javascript yang sekiranya tidak diperlukan, ada cara lain untuk meningkatkan kecepatan loading blog atau website. Yakni dengan meminimalisasi CSS dan Javascript tanpa menguranginya atau tanpa menghapusnya.
Untuk meminimalisasinya sebenarnya cukup mudah. Kamu hanya perlu menghapus perintah ENTER pada CSS tersebut. Contoh hasilnya jika ENTER sudah dihilangkan seperti berikut ini.
CSS diatas menjadi satu baris saja bukan? Itulah yang dinamakan dengan Minify. Namun masalahnya, bagaimanan jika CSS atau Javascript yang akan diminimalisasi berjumlah banyak? Saya yakin kamu tidak akan melakukan tindakan bodoh dengan cara menghilangkan ENTER secara manual bukan?
Ada satu cara untuk meminimalisasi CSS hanya dengan satu kali klik saja. Kamu cukup menyalin CSS atau Javascript yang akan diminimalisasi ke website Minify.org.
Berikut ini contoh tampilannya.
Kamu hanya perlu copy-paste CSS atau Javascript yang ingin diminimalisasi ke kotak pada gambar diatas lalu klik tombol Minify.
Jika kamu sudah melakukan hal diatas, silahkan cek kecepatan loading blog atau situsmu di Pagespeed Insight.
Selain menghapus CSS dan Javascript yang sekiranya tidak diperlukan, ada cara lain untuk meningkatkan kecepatan loading blog atau website. Yakni dengan meminimalisasi CSS dan Javascript tanpa menguranginya atau tanpa menghapusnya.
Cara Meringankan CSS dan Javascript pada Blogger
Cara untuk meminimalisasi CSS biasa disebut dengan istilah Minify. Bukan hanya CSS, cara ini juga berlaku bagi Javascript.
Berikut ini cara untuk meminimalisasi CSS. Dibawah ini adalah contoh CSS yang ingin saya minimalisasi.
.post-body blockquote p{display:inline}
.post-body ol,.post-body ul{margin:0 0 0 30px;padding:0;line-height:1.8;list-style:square}
.post-body ol{counter-reset:li;list-style:none;padding:0;margin:0;}
.post-body ol ol {margin:0 0 0 2em;} .post-body ol li{position:relative;display:block;padding:0;margin:.5em 0 .5em 1.5em} .post-body ol li:before{content:counter(li);counter-increment:li;position:absolute;left:-2.5em;height:2em;width:3em;text-align:center}
Untuk meminimalisasinya sebenarnya cukup mudah. Kamu hanya perlu menghapus perintah ENTER pada CSS tersebut. Contoh hasilnya jika ENTER sudah dihilangkan seperti berikut ini.
.post-body blockquote p{display:inline}.post-body ol,.post-body ul{margin:0 0 0 30px;padding:0;line-height:1.8;list-style:square}.post-body ol{counter-reset:li;list-style:none;padding:0;margin:0;}.post-body ol ol {margin:0 0 0 2em;} .post-body ol li{position:relative;display:block;padding:0;margin:.5em 0 .5em 1.5em}.post-body ol li:before{content:counter(li);counter-increment:li;position:absolute;left:-2.5em;height:2em;width:3em;text-align:center}
CSS diatas menjadi satu baris saja bukan? Itulah yang dinamakan dengan Minify. Namun masalahnya, bagaimanan jika CSS atau Javascript yang akan diminimalisasi berjumlah banyak? Saya yakin kamu tidak akan melakukan tindakan bodoh dengan cara menghilangkan ENTER secara manual bukan?
Ada satu cara untuk meminimalisasi CSS hanya dengan satu kali klik saja. Kamu cukup menyalin CSS atau Javascript yang akan diminimalisasi ke website Minify.org.
Berikut ini contoh tampilannya.
Kamu hanya perlu copy-paste CSS atau Javascript yang ingin diminimalisasi ke kotak pada gambar diatas lalu klik tombol Minify.
Jika kamu sudah melakukan hal diatas, silahkan cek kecepatan loading blog atau situsmu di Pagespeed Insight.