Selasa, 28 Agustus 2012

Menggabungkan javascript agar loading lebih cepat

Assalamu'alaikum wr wb

Menggabungkan javascript agar loading lebih cepat, maksudnya yaitu menggabungkan beberapa jenis javascript yang dihosting menjadi satu file javascript dengan tujuan agar pada saat mengakses/me-load file tersebut menjadi ringan karena hanya dalam satu kali.
Dalam penggabungan ini mungkin diperlukan beberapa kali percobaan karena mungkin saja dalam penggabungan tersebut ada javascript yang tidak bisa digabungkan. ini berdasarkan pengalaman yang sudah saya coba, bagi sobat yang mau mencoba mungkin ada baiknya sebelum menggabungkan javascriptnya disimpan dulu di notepad agar apabila terjadi kegagalan bisa dipasang kembali javascrip aslinya.
Agar kita bisa tau apa javascript tersebut berhasil digabungkan atau tidak, maka kita harus tau dulu fungsi dari javascript tersebut dan setelah digabungkan apakah javascript tersebut berjalan atau tidak fungsinya. kalau ternyata dari penggabungan tersebut ada yang tidak berjalan fungsinya maka kita ulangi lagi penggabungan dengan membuang javascript yang tidak berfungsi tersebut dan memasang javascript tersebut dengan yang aslinya. mungkin sampai disini sobat mengerti maksudnya, jadi itulah yang dimaksud dengan harus dengan beberapa kali percobaan.
Ok. kita berlanjut ke pembahasan Menggabungan javascript, mungkin sobat sudah pada tau kode javascriptnya kan? oh iya, dalam penggabungan javascript disini kita bisa menggabungkan beberapa javascript baik itu yang sudah dihosting maupun yang belum/javascript langsung diblog.
Sebagai contoh kita menggabungkan 4 javascript dalam 1 hostingan.
  1. <script language='javascript' src='http://torinfo.googlecode.com/files/rainbow.js' type='text/javascript'/>
  2. <script src='http://my-project-favicon.googlecode.com/files/relatedposts.js' type='text/javascript'/>
  3. <script src='https://sites.google.com/site/pemancinglokal/cilayung/recencoment.js' type='text/javascript'/>
  4. <script src='https://sites.google.com/site/pemancinglokal/cilayung/Labelthumbnail.js' type='text/javascript'/>
Cara penggabungannya ada 2 cara yang pernah saya coba;
  1. Dengan cara menggabungkan menggunakan notepad
  2. yang kedua dengan menggunakan fasilitas yang disediakan google developer yaitu Closure Compiler.
Pada kesempatan ini saya mau berbagi cara yang kedua saja karena dengan cara yang kedua ini sangat mudah penggabungannya.
Caranya:
  • Pertama-tama sobat seperti biasa disaat mau edit HTML template.
  • Apabila halaman edit HTML sobat sudah terbuka sobat cari kode javascriptnya. biasanya javascript yang bisa digabungkan berada diantara kode </b:skin> dan </head>
  • Setelah ketemu javacsriptnya sobat copy-paste dulu ke notepad.
  • Kemudian sobat buka halaman Closure Compiler
menggabungkan javascript agar loading lebih cepat
  • Apabila halamannya sudah terbuka seperti gambar sobat hapus tulisan yang ada dibagian bawah semuanya.
  • Kemudian sobat masukan URL javascript pada kotak Add a URL dan klik Add
contoh alamat URL javascript lihat pada keempat contoh javascript diatas yang berwarna merah.
  • Silahkan sobat masukan semua URL javascript satu persatu kedalam Add a URL dan klik Add.
  • Setelah semua javascript dimasukan maka halaman yang ada dibawahnya akan seperti ini.
menggabungkan javascript agar loading lebih cepat gambar 2
  • Setelah itu tandai radio button Simple dan klik Compile.
  • Lihat deretan kode javascript yang berada dikotak sebelah kanan, dan itulah hasil penggabungan ke 4 javascript tersebut.
menggabungkan javascript agar loading lebih cepat gambar 3
  • Gambar diatas menunjukan penggabungan yang sukses atau berhasil, maka selanjutnya sobat blok kode yang berada dikotak bawah dan copy paste kode tersebut pada notepad dan simpan dengan file js. contoh; Gabungan.js
  • setelah itu hosting javascript tersebut menggunakan hostingan sobat, mau menggunakan yang gratisan maupun berbayar. kalau yang gratisan bisa di google-code atau di google-site.
  • kalau sudah dihosting maka silahkan sobat pasang pada template sobat dang menghilangkan semua javascript yang tadi digabungkan.
Sekali lagi apabila ada javascript yang tidak berfungsi setelah digabungkan silahkan ulangi kembali cara diatas dengan tidak mengikut sertakan javascript yang tidak berfungsi tersebut.
Dengan cara ini saya menggabungkan 4 javascript dengan hasil yang baik, dan itupun setelah beberapa kali penggatian karena ada javascript yang ga bisa digabungkan.
Tambahan:
Kalau di template sobat ada javascript yang belum dihosting maka sobat tinggal memasukannya langsung pada kotak sebelah kiri bawah jadi memasukannya bukan pada Add a URL. dan ini bisa digabung dengan yang memakai hosting.
 
Demikian postingan ane tentang  Menggabungkan javascript agar loading lebih cepat,semoga bermanfaat!!!!

 
sumber/copas from:  azzam10.blogspot.com

Ditulis Oleh : annash mobilepc // 17.10
Kategori:

1 komentar:

  1. . . berarti selain di head dan skin itu gak bisa digabungin ya?!? . .

    BalasHapus

-Silahkan tinggalkan komentar agar admin dapat berkunjung balik

-Jika anda follow blog ini,maka blog anda akan segera saya follow

-Blog ini DOFOLLOW jadi silahkan gunakan fasilitas name/URL untuk mendapatkan backlink

-Blog ini tidak menggunakan Kode Verifikasi dan Moderasi

-Silahkan Berkomentar Sesuai isi artikel dengan bahasa yang sopan

:) :( ;) :D ;;-) :-/ :x :P :-* =(( :-O X( :7 B-) :-S #:-S 7:) :(( :)) :| /:) =)) O:-) :-B =; :-c :)] ~X( :-h :-t 8-7 I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ ;-;; #-o =D7 :-SS @-) :^o :-w 7:P 2):) X_X :!! \m/ :-q :-bd ^#(^ :ar!

 
annash mobilepc. Diberdayakan oleh Blogger.