Categories

Manufacturers

  • Join Our Community
  • Follow us
  • Join Our Community
Home>Tips Optimalisasi Website

Berdasarkan artikel dari yahoo developer network yg berjudul “High performance websites”. Pada artikel ini disampaikan 13 hal yang dapat mempercepat halaman website kita. Pada kesempatan ini penulis mencoba untuk mebahasnya:

  1. Mengurangi jumlah HTTP Requests.
    Setiap file yang diminta ke server itu merupakan sebuah request .Artinya jumlah file yang di request ke webserver harus di kurangi. Selain mengurangi jumlah file kita juga bisa melakukan cache pada file sehingga secara tidak langsung kita dapat mengurangi HTTP rquest, karena file langsung didapat dari cache browser. Jika anda menggunakan apache maka dapat menggunakan module mod_expire untuk mencache file-file seperti image, swf atau contents website. Berikut ini adalah cara untuk menggaktifkan mod_expire.

    LoadModule expires_module modules/mod_expires.so

    Setelah diaktifkan maka kita tinggal membuat sebuah file .htaccess untuk mencache image, swf dan javascripts selama 1 bulan menggunakan mod_expire

    ExpiresActive On
    ExpiresByType image/gif A2592000
    ExpiresByType image/png A2592000
    ExpiresByType image/jpg A2592000
    ExpiresByType image/jpeg A2592000
    ExpiresByType application/x-javascript A2592000
    ExpiresByType application/x-Shockwave-Flash A2592000

    Jika anda memiliki beberapa file Javascript dan CSS sebaiknya file tersebut dijadikan satu file js dan css saja.

  2. Menggunakan Content Delivery Network
    Ya, penggunaan CDN memang dapat membantu mempercepat performa web kita. kita dapat menggunakan https://www.cloudflare.com/ jika ingin menggunakan CDN secara gratis :) .
  3. Menambahkan Expires Header
    Expiry tags akan membantu browser untuk mengenali mana content yang harus di cache dan tidak. Jangan sampai ketika kita melakukan update terapi tidak terbaca di client karena yang di load adalah yang tersimpan di cache. kita dapat menambahkan expories header di HTTP headers. adapun contohnya dalam php adalah 
    1
2
3
4

    < ?php
header("Expires: ".gmdate("D, d M Y H:i:s", time()+600)." GMT");
header("Cache-Control: max-age=600");
?>

    This will set the expiry time 600 seconds from the time of content delivered.

  4. Gzip Components
    Prinsip kerja Gzip Componen adalah dengan mengkompres output yang akan di kirim ke browser, sehingga ukuran data yang dikirim menjadi lebih kecil. Browser yang digunakan harus punya kemampuan untuk melakukan decompress. Sekarang rata-rata semua browser sudah mensupport fitur ini. Untuk mengaktifkan fitur ini kita harus menambah konfigurasi berikut di server kita


    LoadModule deflate_module modules/mod_deflate.so

    Setelah diaktifkan maka kita dapat menggunakan dengan menambah konfigurasi beriku di file .htaccess .

    AddOutputFilterByType DEFLATE text/html text/plain text/xml application/x-javascript

    atau bisa juga melakukannya di sisi PHP dengan menggunakan ob_start(“ob_gzhandler”) contoh :

    1
2
3
4
5
6
7
8
9
10
11
12

    < ?php
//gzipjs.php
ob_start("ob_gzhandler");
header("Content-type: text/javascript; charset: UTF-8");
header("Cache-Control: must-revalidate");
$offset = 60 * 60 * 24 * 3;
$ExpStr = "Expires: " .
gmdate("D, d M Y H:i:s",
time() + $offset) . " GMT";
header($ExpStr);
include(urldecode($_GET['js']));
?>

    penggunaannya adalah

    1

    <script type=”text/javascript” src=”gzipjs.php?js=prototype.js” ></script>

    *jangan gunakan code diatas untuk production.. sangat berbahaya.. harus dimodif dikit :P

  5. Meletakkan script CSS pada bagian atas
    Meletakkan code css pada bagian header dapat mempercepat loading website karena di css biasanya ada komponen lain seperti gambar yang akan di load, jadi dengan meletakkan disebelah atas dapat membuat website muncul secara progressive
  6. Memindahkan script javascript ke bawah
    Masalah yang muncul ketika javascript berada diatas mereka memblock download script lain sehingga semua script di download secara serial.
  7. Menghindari penggunaan CSS Expressions
    CSS expressions adalah salah satu cara untuk menampilkan css secara dinamis. contohnya 
          background-color: expression( (new Date()).getHours()%2 ? "#B8D4FF" : "#F08A00" );

    code diatas akan di eksekusi berulang2 kali sehingga akan menggangu performa dari website.

  8. Mengurangi DNS Lookups
    Mengurangi DNS lookup dapat mempercepat akses.. jadi caranya pergunakanlah nama domain yang sama untuk semua resource yang ada di web kita..
  9. Minify JavaScript and CSS
    Ide awalnya adalah dengan membuang semua karakter yang tidak berguna pada code sehingga ukurannya menjadi lebih kecil.
  10. Avoid Redirects
    Hindari penggunaan redirect karena akan terjadi request bolak-balik antara client dan server
  11. Buang Scripts yang sama
    Jika kita memiliki script yang sama, maka hilangkanlah karena script ini tersebut akan tetap di load oleh client jadi akan membebani client



HomeHome

Cart  

(empty)