VIX

Tuesday, May 5, 2009

Tutorial singkat AJAX untuk mempercepat akses situs

Free Website Hosting

Apakah AJAX itu ?. AJAX merupakan teknologi yang menggabungkan engine _javascript

dan XML. Jadi, teknik AJAX sangat berguna bagi anda yang suka meng-update isi

berita mengunakan XML. Peng-update-an dilakukan secara real-time atau ditentukan

dalam selang waktu tertentu. File apa sih yang diupdate ?? terserah ?? ntah itu format

html biasa, txt, js, vbs, rss, yang penting bisa dibaca via-http. Jadi, nggak harus XML.

Bingung ?? Yeah, aku juga pertama kali kenal AJAX rada2 bingung, tapi k’lo udah

ngeliat contoh ini pasti kamu ngerti deh.

Pertama-tama kita tambahkan script ini sebagai _javascript.

function createRequestObject() {

var ro;

var browser = navigator.appName;

if(browser == “Microsoft Internet Explorer”){

ro = new ActiveXObject(“Microsoft.XMLHTTP”);

}else{

ro = new XMLHttpRequest();

}

return ro;

}

var http = createRequestObject();

function sndReq(param) {

����������������������������������������������������������������������������������������

������������������������������������������������������������������

http.send(null);

}

function handleResponse() {if(http.readyState == 4){

var response = http.responseText;

alert(response)

}

}

��������������������������������������������������������������������������������������������������������������������������������������������

Fungsi createRequestObject() digunakan untuk memanggil object / activeX yang

mendukung kelangsungan teknik AJAX ini. Disana terlihat diciptakan objectnya dengan

variabel penampungnya adalah http. Lalu, ada fungsi sndReq(param) dengan tambahan

input kepada fungsi ini yaitu param. Param artinya parameter yang nantinya digunakan

oleh halaman proses sebagai input yang akan diolah untuk menghasilkan output yang

����������������������������������������������������������������������������������������������������������������������������������������������������������. Untuk

parameter standar untuk semua http digunakan aturan arg1=val1&arg2=val2...&arg

N=valN, dimana tiap-tiap argN dibaca sebagai variabel nantinya oleh web server yang

memiliki nilai valN. Nah, setelah proses selesai kita ingin melihat hasil prosesnya.

Untuk itu kita panggil fungsi peng-handel proses yang terjadi yaitu handleResponse().

Pada fungsi ini setiap status proses yang terjadi akan selalu diberitahukan kepada

browser. Hingga kamu lihat ketika readyState = 4 maka proses selesai output siap

ditampung. Terlihat variabel response menampung hasil outputnya. Output ini terserah

mau kamu apakan. Dalam contoh diatas terlihat bahwa scriptnya menampilkan otuput

dalam bentuk popup message. Oke biar tambah pinter cobain aja contoh berikut :

1. Nama File : Test.Html











Klik tombol ini, input akan diproses diserver


����������������������������������������������������������������������������������������������������������������������������������������������������������������������



����������������������������������������������������������

����

$nil1=$HTTP_GET_VARS[‘nil1’];

$nil2=$HTTP_GET_VARS[‘nil2’];

$operator=$HTTP_GET_VARS[‘opr’];

echo _eval($nil1.$operator.$nil2);

����

������������������������������������������������������������������������������������������������������������������������������������������������������������������������

PHP lho... maklum aku cuma bisa PHP kawan. Lagian untuk ngormatin Bapak Rasmus.

Trus..trus apa hubungannya dengan mempercepat situs ?? Pertanyaan bagus kawan...

������������������������������������������������������������������������������������������������������������������������������������������������������������������������������

apalah itu... tidak diambil jadi, tentunya mempercepat akses situs. Gini, aja... masa kita

hanya untuk menghitung 1 + 1 = 2 harus me-load ulang halaman ??, nggak mau lagi!!!.

Kita dipaksa nge-load gambar, activex, bla..bla..bla hanya untuk menghasilkan nilai 2!!.

Udah yach semoga sukses. K’lo dikembangin bisa buat yang aneh2 deh. Termasuk untuk

ngisengin temen2.

No comments:

Post a Comment