Cara compress/kompres css dan javascript, Mempercepat loading blog, mengurangi berat blog dengan cara meng-compress CSS/Javascript.
Blog tanpa javascript bagaikan cewek cantik yang auranya terpendam sehingga dipandangnya pun kurang menarik. Tapi, setelah cewek itu membuka auranya dengan hiasan serta perawatan yang baik pasti ketika melihatnya langsung berdiri tegang.
Oops...jangan negatif dulu. Bukan auratnya lho yang dibuka tapi auranya...beda-kan? Jika cewek cantik tersebut ramah, rapi, santun, terawat, dan lain-lainnya dah maka lelaki manapun tak akan bosan-bosan untuk memandang dan menghampirinya. Bener gak sih? Gak juga dech....
Nah, begitu juga dengan blog yang kurang di dandani dengan pernak-pernik widget sepertinya kurang menarik untuk dipandang dan membuat orang betah dalam melakukan kunjungan.
Pernak-pernik yang digunakan untuk mempercantik tampilan blog pasti tidak lepas dari yang namanya javascript, karena javascript-lah yang akan membuat tampilan blog terasa lebih enak dipandang, tetapi sayang loading blog jadi semakin berat jika terlalu banyak memasang javascript.
Semua masalah pasti ada solusi jalan keluarnya. Jika manusia yang memiliki badan gemuk atau gendut serta auranya yang masih terpendam buram, maka mereka akan mencari cara untuk menjadikan badan mereka langsing dan memiliki aura yang memancar diwajah dan gaya tingkah lakunya. Misalnya, untuk melangsingkan badan mereka mengkonsumsi obat atau vitamin yang dapat membantu mengurangi berat badan mereka. Begitu juga dengan berat badan blog karena adanya hiasan yang dijalankan melalui perintah javascript maka loading blog akan terasa lebih berat jika kita tidak memperdulikannya dan hanya ingin memakainya saja.
Pada kali ini adalah mengenai cara mempercepat loading blog dengan meng-compress file CSS/Javascript menggunakan Online YUI CSS/Javascript Compressor, caranya kunjungi YUI CSS/Javascript Compressor, maka akan terlihat form seperti dibawah ini:
Copy javascript atau CSS code Anda dan letakkan pada kolom kosong text area tersebut.
Penting! kode script yang Anda masukkan jangan menyertakan kode <script type='text/javascript'>diakhiri</script> untuk jenis javascript, dan kode //<![CDATA[ diakhiri //]]> untuk jenis css code, tapi isinya saja yang terletak diantara kode pembuka dan penutup tersebut, demikian juga dengan CSS Code. CSS Code yang di compress hanya isinya saja yaitu semua kode yang berada diantara kode pembuka .....
Contoh:
Javascript code;
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
CSS Code;
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
Yang perlu Anda compress hanyalah kode yang ditandai warna merah saja, setelah kode tersebut Anda letakan pada kotak text area kosong YUI Compressor, pilih JS untuk javascript dan CSS untuk kode css, klik Compress dan hasil compress akan muncul didalam kotak text area dibawah tulisan: Compressed. Copy Compressed File tersebut dan ganti CSS Code atau Javascript sebelumnya didalam template Anda yaitu dari menu "Edit HTML" dengan CSS dan Javascript Code yang telah di compress kemudian Save template.
Mudah-mudahan setelah melakukan compress pada CSS dan Javascript Code akan mengurangi berat loading blog Anda.