tips meningkatkan kecepatan website

Benar adanya jika kecepatan internet dan routing ISP aser jauh di luar kendali kita jika menyangkut kecepatan website. Namun selain itu ada variabel-variabel lain yang juga mempengaruhi waktu respon sebuah website.
Berikut adalah 10 point untuk meningkatkan kecepatan website.
 

1. Minimalkan HTTP Requests

80% waktu respon sebuah website di habiskan pada front-end. Kebanyakan untuk mendownload semua komponen yang akan di tampilkan di halaman anda. Misalnya gambar, Flash, Javascript, CSS, PHP, HTML, dsb. Dengan mengurangi jumlah komponen yang harus di sownload browser, anda mengurangi jumlah HTTP Requests yang di perlukan oleh website anda. Salah satunya dengan menyederhanakan desain halaman anda. Selain itu anda juga bisa mencoba metode berikut: '=>Menggabungkan file' Misalnya dengan menyatuhkan semua CSS anda kedalam sebuah single stylesheet. Dengan demikian setiap proses HTTP, Browser hanya perlu merequest satu CSS saja. '=> Teknik CSS sprites. Yaitu menggabungkan semua background image anda ke dalam sebuah single image yang penggunaannya di definisikan melalui proferty CSS background image dan background position.

 

2. Optimasi CSS Sprites

Anda bisa mengoptimasi CSS Sprite agar ukurannya lebih kecil. salah satunya dengan menyusun image di dalamnya secara horizontal. Kemudian anda bisa juga menggabungkan warna-warna yang sama dalam satu CSS sprite untuk menjaga perhitungan warna tetap rendah. Idealnya di bawah 256 warna agar bisa pas dengan format PNG8. Terakhir jangan tinggalkan gab yang terlalu lebar antara image-image di CSS sprite anda agar bisa lebih mobile friendly. Hal ini akan mengurangi memory yang di perlukan sebuah user-agent untuk melakukan dekompresi gambar ke dalam pixel. 

 

3. Optimasi Gambar

Setelah desainer selesai membuat gambar untuk halaman anda, ada beberapa hal yang bisa anda lakukan sebelum mengirim gambar tersebut ke server melalui FTP. Di antaranya: => Konfersi GIF ke PNG (PNG8) dan lihatlah apakah ukuran filenya bisa di hemat. Gunakan imagemagick atau klik di sini untuk optimasi. =>Gunakan tool optimasi, silahkan anda klik disini pada semua file PNG anda. =>Jalankan jpegtran (perintah UNIX) pada semua JPG anda. Perintah ini bisa melakukan optimasi ukuran JPEG anda dengan membuang semua atribut dan informasi yang tidak di perlukan.

 

4. Hindari Scale Gambar Di HTML

Jangan upload gambar yang lebih besar dari yang anda butuhkan meskipun anda bisa mengatur atributnya lewat HTML. jika anda butuh sebuah gambar dengan atribut <img width="100" src="abc.jpg"alt="ABC"/> maka lebih baik jadikan gambar anda (abc.jpg) berukuran 100x100 pixel dulu daripada memaksa user agent untuk melakukan scale down dari gambar yang berukuran 500x500 pixel. 

 

5. Jadikan favicon.ico Anda Kecil

Gambar favicon.ico pasti letaknya di root server anda, meskipun kecil dan sering kali di abaikan, favicon ternyata bisa mengganggu urutan download anda. Contohnya di IE. Ketika user agent anda meminta komponen tambahan pada proses loading, favicon akan di download dulu sebelum komponen tambahan tersebut. Untuk meredam efek negatif menggunakan favicon, pastikan favicon anda berukuran di bawah 1K. Gunakan imagemagick.

 

6. Definisikan Stylesheets di Bagian HEAD Script Anda

Memindahkan stylesheets agar di definisikan pada bagian HEAD dari script anda bisa membuat halaman anda nampak lebih cepat di tampilkan. Sebab hal ini memungkinkan user agent melakukan render halaman secara paraler. Ketika browser menampilkan halaman secara paralel, maka header, navigation bar, logo, dsb, semuanya akan berperan sebagai respon yang bisa menjaga agar user mau menunggu halaman anda tampil sepenuhnya. Strategi ini pas di terapkan pada halaman yang banyak konten, dan untuk user dengan koneksi internet yang lambat.

 

7. Pasang Javascript di Bagian Bawah Script Anda

Problem yang di sebabkan oleh javascript adalah mereka memblog download secara paralel. Makanya ketika sebuah javascript sedang di download, browser tidak akan mulai mendownload konten yang lain. Maka pindahkan javascript anda ke bagian bawah halaman jika nytanya javascript anda kurang responsif.

 

8. Pasang Javascript dan CSS Terpisah Dari Script Anda

Javascript dan CSS yang di letakan jadi satu (inline) dengan script HTML akan di download berulangkali setiap dokumen HTML di tampilkan. Dengan cara ini jumlah HTTP Requests memang bisa di kurangi. Namun ukuran dokumen HTML anda akan bertambah. Dilain pihak jika javscript dan CSS di taruh pada file yang terpisah dari dokumen HTML, anda memang akan menambah jumlah HTTP Requests. Namun file eksternal yang berisi javascript/CSS ini bisa di cache oleh browser sehingga tidak perlu di download untuk kedua kalinya jika halaman tersebut ingin di tampilkan.

 

9. Hindari Penggunaan CSS Expressions

CSS Expressions adalah salah satu cara yang ampuh (dan berbahaya) agar property CSS bisa tampil dengan dinamis. Misalnya dengan CSS Expressions berikut, warna background bisa di set berubah-ubah setiap jam.

background-color:expressions((newDate()).getHours()%2 ? "#B8D4FF":"#F08A00"); 

Metode CSS expressions di atas memanfaatkan javascript. Property CSS di atur dengan mengepaluasi ekspresi javascript yang di definisikan. Masalahnya adalah CSS expressions tersebut akan di evaluasi lebih sering daripada yang bisa di bayangkan.

 

10. Optimasi Javascript dan CSS

Proses optimasi javascript dan CSS berhun=bungan dengan praktek penghapusan karakter, kode, comment, spasi, baris baru, tab margin, dsb yang tidak di perlukan oleh javascript/CSS anda. Tujuannya agar ukuran filenya bisa lebih kecil, hal ini bisa meningkatkan waktu respon sebab ukuran file yang harus di download jadi berkurang. Untuk melakukan optimasi, anda bisa menggunakan software seperti JSMIN untuk menunjukan letak-letak optimasi yang memungkinkan pada javascript anda, dan YUI Compressor untuk CSS anda.

Sumber : http://www.infojadul.info/2012/05/tips-meningkatkan-kecepatan-website.html#ixzz1zuPXGjy1