Rabu, 02 Januari 2013

Cara Mempercepat Waktu Loading Pada Blog

Cara Mempercepat Waktu Loading Pada Blog

Untuk mempercepat waktu Loading (membuka halaman pada Blog), dapat anda ikuti cara optimasi halaman Blog cepat terbuka. Untuk menghindari kejenuhan pengunjung karena menunggu halaman terbuka yang cukup lama, tentu harus kita hindari demi kenyamanan dan hemat waktu. Kecepatan waktu loading sebenarnya dapat kita optimalkan dengan beberapa trik cara mempercepat waktu Loading pada Blog seperti langkah berikut ini. Bagaimana caranya? mari kita simak cara membuat halaman Blog cepat terbuka.




Tips mempercepat waktu Loading

Dengan mengaktifkan Kompresi GZIP
Menurut ahlinya melakukan kompresi pada file HTML, CSS dan Javascript sangat dianjurkan, karena browser terbaru/modern saat ini biasanya mendukung kompresi untuk HTML, CSS dan Javascript. Dengan Kompresi format GZIP, akan mempermudah dalam membaca, menghemat waktu loading halaman dan tentu akan mengurangi waktu download. Anda dapat mencari tutorialnya di mesin pencari (search) google. Namun untuk pengguna Blogspot, tidak perlu cara ini, karena secara default blogspot sudah support teknik ini. Bagi pengguna Wordpress memang perlu menggunakan Kompresi Gzip atau bisa juga menggunakan plugin WP Super Cache. Silakan dicari tutorialnya.
 .

Hilangkan (buang) spasi kosong pada kode HTML
Cara ini adalah untuk memadatkan kode HTML, XML atau PHP yakni dengan cara membuang spasi kosong yang kita anggap tidak perlu. Termasuk juga dalam Inline untuk kode Javascript dan CSS. Menghapus ruang kosong akan menyimpan banyak byte data dan akan berdampak pada kecepatan waktu proses download. Anda dapat membuang spasi dengan menggunakan Tools Editor seperti Notepat++ dengan cara blok semua kode yang ingin anda buang spasinya kemudian pilih menu TextFX , lalu  TextFX Edit, kemudian pilih Delete Blank Lines atau Delete Surplus Blank Lines. Silakan cari/pelajari tutorialnya.


Melakukan Kompresi CSS (Stylesheet)
Hampir sama dengan cara membuang ruang spasi yang tidak dipenting, sehingga memadatkan pengkodean CSS, hemat waktu loading, Parsing dan waktu eksekusi untuk membaca. Anda dapat melakukan kompresi pada CSS, dengan menggunakan tools gratis seperti YUI Kompresor dan cssmin.js. Silakan dicari di internet.


Meletakkan CSS - Stylesheet di Atas (header)
Para webmaster merekomendasikan untuk menggunakan/memanggil semua kode CSS pada halaman HEAD baik itu CSS Internal juga CSS External. Semuanya dijadikan satu pemanggilan dalam Header.


Membuang CSS (Stylesheet) yang tidak diperlukan
Browser dalam membaca (akses) suatu halaman, akan menganalisa setiap baris kode dalam CSS (stylesheet) terlebih dahulu atau juga melalui proses download. Jika banyak kode CSS yang tidak penting harus diverifikasi (analisa) oleh Browser tanpa hasil, akan mengganggu dan menghambat proses rendering yang berjalan.


Pastikan Validasi CSS (Stylesheet) anda benar
Lakukan cek validasi CSS (Stylesheet) anda, bisa dengan menggunakan tools online  W3C CSS Validations. Kesalahan yang terjadi dalam menulis kode CSS, tidak akan menampilkan pesan error oleh broser, jadi pastikan Validasi CSS (Stylesheet) anda sudah benar.


Melakukan kombinasi CSS (Stylesheet) dengan file External
Untuk blogger, teknik ini tidak perlu karena lebih bagus dengan pemanggilan internal. CSS Internal memiliki kekurangan yaitu terjadi pembengkakan kapasitas (size) pada ukuran halaman dan sebaiknya anda melakukan pemanggilan kode CSS melalui akses file external, atau akan lebih bagus lagi jika memungkinkan melakukan kombinasi semua kode CSS hanya dalam satu file saja. Silakan anda cari tutorialnya.


Jalankan Kompresi Javascript
Cara ini juga hampir sama dengan CSS (dengan cara membuang spasi yang tidak diperlukan) sehingga akan memadatkan pengkodean Javacript. Anda dapat melakukan kompresi javascrip dengan menggunakan tools gratis seperti YUI Kompresor, Closure Compiler dan JSMin , silakan cari di google.


Membuang Javascript yang tidak perlu
Javascript terkadang membuat loading halaman semakin berat dan waktu tambah lama. Browser akan mengakses suatu halaman mungkin harus melalui proses download, kemudian menganalisa kode dalam Javascript terlebih dahulu untuk dapat membukanya,  jika terlalu banyak pemanggilan Javascript JS yang harus diproses tetapi tidak dieksekusi oleh browser tentu hanya akan menghambat proses loading. Cek kembali kode Javascript anda yang tidak perlu dan hapus.


Melakukan kombinasi Javascript dalam file External
Untuk blogger sebaiknya gunakan kode panggil melalui file internal saja ( jika memungkinkan). Javascript Internal juga memiliki kekurangan yakni terjadinya pembengkakan size/kapasitas ukuran pada besarnya halaman. Sebaiknya melakukan pemanggilan melalui akses external, dan akan bagus lagi jika memungkinkan, dengan melakukan kombinasi semua koding Javascript hanya dalam satu file saja.


Mengoptimasi Gambar
Ada baiknya kita mengurangi gambar yang tidak perlu disertakan, terutama ukuran yang besar. Jika harus menyertakannya,  optimasi dulu gambar tersebut dengan cara melakukan kompresi gambar. Bisa dengan menggunakan Yahoo! Smush.it Silakan cari di mesin search.


Hindari penggunakan gambar dalam skala HTML secara paksa
Sebaiknya gunakan gambar sesuai dengan ukuran gambar aslinya (jangan mengecilkan dengan mengatur ulang gambar). Kita memang dapat mengatur ulang dalam HMTL, melalui CSS atau dengan kode tag <Img> seperti kode html berikut ini misalnya <img width="110" height="80" src="gambar.jpg"/> dengan merubah angka 110 dan 80 sebenarnya kurang tepat.


Jangan pasang Gambar SRC kosong
Gambar bisa dipanggil tag SRC melalui HTML <img scr="">  atau juga melalui Javascript var img = new Image(); img.src = "" jika kode gambar tidak ada (kosong), sebaiknya hilangkan saja karena akan mengganggu proses rendering.


Hapus Broken link
Silakan cek kembali Link yang telah Broken (mati) di blog anda. Bisa menggunakan tools dari W3C Checklink


Gunakan Widget atau plugin seperlunya
Buang Widget yang anda rasa tidak perlu digunakan, karena terlalu banyak Widget yang terpasang tentu hanya akan membebani loading blog anda.

Demikian info tips yang bisa saya sampaikan, semoga bisa bermanfaat untuk kita semua, salam sukses!

1 komentar:

venom mengatakan...

thanks gan, lebih bagus dikasih solusinya juga :)