Dalam terminologi pemrograman web, Ajax adalah akronim dari “Asynchronous JavaScript and XML”. Ajax bukanlah suatu bahasa pemrograman, melainkan sebuah pendekatan yang relatif baru untuk memanfaatkan standar yang telah ada dalam membangun aplikasi berbasis web yang interaktif. Ajax juga bukan suatu teknologi tunggal. Lebih tepatnya, Ajax adalah gabungan dari beberapa teknologi terpisah yang dengan perannya masing-masing bersama-sama membangun sebuah aplikasi web.
Ajax menggabungkan pesentasi web standar yang menggunakan HTML, CSS, tampilan dinamis dan interaksi memanfaatkan Document Object Model, pertukaran dan manipulasi data menggunakan XML dab XSLT, dan akses data asinkron memanfaatkan objek XMLHttpRequest, yang kesemuanya itu disatukan oleh JavaScript.
Tujuan pemanfaatan Ajax adalah untuk membuat suatu halaman web yang lebih responsif melalui pertukaran data yang sekecil mungkin dengan server di belakang layar, sehingga seluruh halaman web tidak perlu dipanggil kembali setiap kali pengguna meminta perubahan.
Model aplikasi web klasik bekerja seperti ini: aksi pengguna pada browser akan memicu request HTTP ke web server. Server lantas melakukan beberapa proses tertentu — mengakses data, melakukan query database, berkomunikasi dengan berbagai legacy system — dan kemudian mengirimkan halaman HTML kepada browser pengguna. Ini adalah model yang diadaptasi dari kegunaan awal web sebagai medium hiperteks. Tapi setiap programmer tahu bahwa walaupun web cukup memadai untuk menampilkan data hiperteks, namun tidak ideal sebagai basis software aplikasi.
Perhatikan diagram diatas. Pada pendekatan klasik (sisi sebelah kiri), saat server sedang melakukan tugasnya, apa yang sedang dikerjakan di sisi pengguna (user)? Betul, menunggu. Dan dalam setiap langkah dalam proses ini, pengguna lagi-lagi juga harus menunggu. Seadainya web didesain sejak awal untuk aplikasi, kita tidak harus membuat si pengguna menunggu dan menunggu lagi. Sekali interface dijalankan, kenapa interaksi dengan pengguna harus terhenti setiap aplikasi membutuhkan sesuatu dari server?
Pemakaian Ajax mengeliminasi sifat start-stop-start-stop dalam interaksi dengan web dengan memperkenalkan sebuah perantara: engine Ajax, yang berada diantara pengguna dan server. Sepintas menempatkan suatu layer (lapisan) diantara aplikasi akan membuatnya semakin kurang responsif, tapi dalam kasus ini justeru sebaliknya.
Alih-alih memanggil sebuah halaman web, pada sesi start dan stop, browser menjalankan sebuah engine Ajax — yang ditulis dalam JavaScript, dan biasannya terselip dalam sebuah frame tersembunyi dalam halaman web. Engine ini bertanggung jawab, baik untuk merender tampilan yang dilihat oleh pengguna di browsernya, dan berkomunikasi dengan server atasnama pengguna. Engine Ajax mengijinkan interaksi antara pengguna dengan aplikasi secara asinkron — tidak bergantung pada interaksi dengan server. Dengan demikian, pengguna tidak perlu lagi-lagi menjumpai layar kosong dengan ikon jam pasir, menunggu server melakukan sesuatu, sebagaimana diperlihatkan oleh gambar dibawah.
Setiap aksi dari pengguna yang normalnya akan menghasilkan request HTTP akan memicu panggilan (call) JavaScript kepada engine Ajax. Setiap respon dari pengguna yang tidak memerlukan campur tangan server — seperti validasi data sederhana atau editing data di memory — dapat diolah sendiri oleh engine Ajax. Apabila engine membutuhkan sesuatu dari server untuk merespon permintaan pengguna — seperti mengirimkan data untuk diproses atau mengakses data baru di server — maka engine akan mengirimkan request secara asinkron, biasanya melalui XML, tanpa menutup interaksi pengguna dengan aplikasi.istilah “Ajax” pertama kali dipublikasikan oleh Jesse James Garrett pada Februari 2005. Istilah ini terlintas di benak Garrett saat ia memikirkan sebuah terminologi sederhana untuk merepresentasikan sekumpulan teknologi yang ia usulkan pada seorang kliennya.
Sekalipun istilah “Ajax” telah muncul sejak 2005, sebagian besar teknologi yang membangun Ajax telah dikembangkan satu dekade lebih awal oleh Microsoft melalui teknik Remote Scripting untuk melakukan pemanggilan (loading) suatu halaman secara asinkron tanpa harus memanggil ulang seluruh data, antara lain dengan memanfaatkan elemen IFRAME (diperkenalkan pada browser Internet Explorer 3 pada 1996) dan LAYER (diperkenalkan pada Netscape 4 pada 1997, dan kemudian ditinggalkan pada tahap awal pengembangan browser Mozilla). Kedua tipe elemen tersebut memiliki atribut SRC yang dapat memanggil suatu URL eksternal dan dengan menjalankan suatu halaman yang mengandung JavaScript yang memanipulasi halaman induk, menghasilkan efek yang mirip penggunaan teknologi Ajax. Set teknologi client-side ini biasanya dikelompokkan dalam terminologi generik DHTML. Sementara itu, Macromedia Flash, mulai dari versi 4, telah menjalankan file XML dan CSV dari remote server tanpa perlu memanggil ulang (reloading) halaman web.
Microsoft Remote Scripting (MSRS) yang diperkenalkan pada 1998 adalah pengganti yang lebih elegan terhadap teknik-teknik yang disebut diatas, dengan data diakses oleh suatu JavaApplet, dimana sisi client dapat berkomunikasi memanfaatkan JavaScript. Teknik ini bekerja baik pada browser Internet Explorer versi 4 maupun pesaingnya saat itu, Netscape Navigator versi 4. Microsoft lantas mengembangkan objek XMLHttpRequest pada Internet Explorer 4 dan untuk pertama kalinya memanfaatkan teknik ini melalui XMLHttpRequest pada Outlook Web Access yang disertakan pada perangkat lunak Microsoft Exchange Server 2000. Selanjutnya, Remote Scripting Framework seperti ARSCIF muncul pada 2003, tidak lama sebelum Microsot memperkenalkan Callback pada ASP.NET.
Sebagai tambahan, Konsorsium World Wide Web mengeluarkan beberapa rekomendasi yang juga mengijinkan komunikasi dinamis antara server dan user agent, walaupun hanya sedikit diantaranya yang mendapatkan dukungan, diantaranya adalah elemen object pada HTML 4 untuk merekatkan (embed) konten dinamis pada dokumen (menggantikan frame inline pada XHTML 1.1) serta spesifikasi Load and Save pada Document Object Model (DOM) Level 3.
Alasan paling jelas untuk memanfaatkan Ajax adalah meningkatkan pengalaman browsing pengguna. Halaman yang memanfaatkan teknologi Ajax lebih berlaku sebagai aplikasi yang berdiri sendiri ketimbang sebagai sebuah halaman web. Mengklik suatu link pada halaman web berteknologi Ajax akan membuat halaman terbarui secara dinamis, sementara browser tidak perlu memanggil ulang seluruh halaman. Dengan demikian diperoleh peningkatan kecepatan respon.
Dengan meng-generate HTML secara lokal dalam browser, dan hanya melakukan panggilan JavaScript terhadap data di server, halaman web berbasis Ajax dapat dipanggil relatif cepat akibat kecilnya trafik antara server-client. Ini akan sangat bermanfaat pada halaman web dengan data berjumlah banyak dan harus ditampilkan dalam beberapa halaman. Keuntungan ini semakin terasa kalau kita mempertimbangkan penggunaan elemen-elemen HTML yang sering muncul berulangkali dalam satu halaman (seperti elemen TR dan TD untuk menampilkan tabel). Penggunaan teknologi Ajax dapat mengurangi load halaman karena elemen-elemen tersebut dapat di-generate secara lokal.
Sebagai bagian dari skema “dipanggil apabila dibutuhkan” (load on demand), beberapa aplikasi berbasis web menjalankan bagian dari “event handler” dan kemudian menjalankan fungsi-fungsi secara on the fly. Teknik ini secara signifikan mengurangi konsumsi bandwidth untuk aplikasi web yang memiliki alur logika dan fungsionalitas yang kompleks.
Namun demikian, penggunaan teknologi Ajax juga menyimpan sejumlah kelemahan. Diantaranya, halaman yang di-generate secara dinamis tidak teregister pada “history” browser sehingga penggunaan tombol back dan forward mungkin tidak akan bekerja semestinya. Para pengembang telah mengimplementasikan berbagai solusi terhadap permasalahan ini, diantaranya adalah penggunaan elemen IFRAME yang tersembunyi untuk meminta perubahan yang dapat dikenali oleh fungsi history pada browser yang kemudian dimanfaatkan oleh fungsi tombol back. Contoh penggunaan teknik ini bisa dilihat pada situs Google Maps, dimana perintah pencarian bekerja pada elemen IFRAME yang tak terlihat, namun hasil pencarian diarahkan pada elemen halaman yang terlihat. Sebagai catatan, Konsorsium World Wide Web (W3C) tidak memasukkan elemen IFRAME dalam standar XHTML 1.1 dan lebih merekomendasikan elemen OBJECT.
Berikutnya adalah kesulitan yang dihadapi pengguna saat mem-bookmark halaman yang di-generate secara otomatis oleh Ajax. Solusinya juga sudah ada, salah satunya dengan memanfaatkan URL fragment identifier (bagian dari URL setelah tanda ‘#’) untuk menyimpan jejak sehingga pengguna dapat kembali ke status yang telah ditandai. Hal ini dimungkinkan karena kebanyakan browser mengijinkan JavaScript untuk memperbarui fragment identifier suatu URL secara dinamis, dengan demikian, aplikasi Ajax dapat menyimpan sebuah kondisi saat pengguna melakukan perubahan pada status aplikasi. Solusi ini juga dapat meningkatkan dukungan terhadap penggunaaan tombol back. Namun demikian, ini masih bukan solusi yang komplit.
Isu lainnya menyangkut optimasi mesin pencari. Situs web yang memanfaatkan Ajax untuk memanggil data yang seharusnya diindeks oleh mesin pencari perlu bersikap hati-hati dengan menyediakan data yang ekuivalen pada URL-nya dalam format yang bisa dibaca oleh mesin pencari. Ini karena robot pada mesin pencari biasanya tidak menjalankan kode-kode JavaScript yang dibutuhkan dalam fungsionalitas Ajax. Ini bukan masalah yang spesifik untuk Ajax mengingat isu yang sama juga dialami situs yang menyediakan data dinamis yang membutuhkan page refresh oleh pengguna, misalnya penekanan tombol submit pada akhir pengisian formulir (secara umum, masalah ini kadang-kadang dirujuk sebagai hidden web).
Ketergantungan pada JavaScript juga menjadi isu tersendiri. JavaScript sering diimplementasikan secara berbeda di tiap browser. Karena itu, situs yang menggunakan JavaScript perlu diuji pada sejumlah browser yang berbeda untuk meyakinkan kompatibilitasnya. Tidak jarang kode JavaScript harus ditulis dua kali, satu bagian untuk browser IE dan bagian lain untuk Mozilla. Masalah juga kerap muncul apabila pengguna tidak mengaktifkan dukungan JavaScript pada browsernya.
Ajax menggabungkan pesentasi web standar yang menggunakan HTML, CSS, tampilan dinamis dan interaksi memanfaatkan Document Object Model, pertukaran dan manipulasi data menggunakan XML dab XSLT, dan akses data asinkron memanfaatkan objek XMLHttpRequest, yang kesemuanya itu disatukan oleh JavaScript.
Tujuan pemanfaatan Ajax adalah untuk membuat suatu halaman web yang lebih responsif melalui pertukaran data yang sekecil mungkin dengan server di belakang layar, sehingga seluruh halaman web tidak perlu dipanggil kembali setiap kali pengguna meminta perubahan.
Model aplikasi web klasik bekerja seperti ini: aksi pengguna pada browser akan memicu request HTTP ke web server. Server lantas melakukan beberapa proses tertentu — mengakses data, melakukan query database, berkomunikasi dengan berbagai legacy system — dan kemudian mengirimkan halaman HTML kepada browser pengguna. Ini adalah model yang diadaptasi dari kegunaan awal web sebagai medium hiperteks. Tapi setiap programmer tahu bahwa walaupun web cukup memadai untuk menampilkan data hiperteks, namun tidak ideal sebagai basis software aplikasi.
Perhatikan diagram diatas. Pada pendekatan klasik (sisi sebelah kiri), saat server sedang melakukan tugasnya, apa yang sedang dikerjakan di sisi pengguna (user)? Betul, menunggu. Dan dalam setiap langkah dalam proses ini, pengguna lagi-lagi juga harus menunggu. Seadainya web didesain sejak awal untuk aplikasi, kita tidak harus membuat si pengguna menunggu dan menunggu lagi. Sekali interface dijalankan, kenapa interaksi dengan pengguna harus terhenti setiap aplikasi membutuhkan sesuatu dari server?
Pemakaian Ajax mengeliminasi sifat start-stop-start-stop dalam interaksi dengan web dengan memperkenalkan sebuah perantara: engine Ajax, yang berada diantara pengguna dan server. Sepintas menempatkan suatu layer (lapisan) diantara aplikasi akan membuatnya semakin kurang responsif, tapi dalam kasus ini justeru sebaliknya.
Alih-alih memanggil sebuah halaman web, pada sesi start dan stop, browser menjalankan sebuah engine Ajax — yang ditulis dalam JavaScript, dan biasannya terselip dalam sebuah frame tersembunyi dalam halaman web. Engine ini bertanggung jawab, baik untuk merender tampilan yang dilihat oleh pengguna di browsernya, dan berkomunikasi dengan server atasnama pengguna. Engine Ajax mengijinkan interaksi antara pengguna dengan aplikasi secara asinkron — tidak bergantung pada interaksi dengan server. Dengan demikian, pengguna tidak perlu lagi-lagi menjumpai layar kosong dengan ikon jam pasir, menunggu server melakukan sesuatu, sebagaimana diperlihatkan oleh gambar dibawah.
Setiap aksi dari pengguna yang normalnya akan menghasilkan request HTTP akan memicu panggilan (call) JavaScript kepada engine Ajax. Setiap respon dari pengguna yang tidak memerlukan campur tangan server — seperti validasi data sederhana atau editing data di memory — dapat diolah sendiri oleh engine Ajax. Apabila engine membutuhkan sesuatu dari server untuk merespon permintaan pengguna — seperti mengirimkan data untuk diproses atau mengakses data baru di server — maka engine akan mengirimkan request secara asinkron, biasanya melalui XML, tanpa menutup interaksi pengguna dengan aplikasi.istilah “Ajax” pertama kali dipublikasikan oleh Jesse James Garrett pada Februari 2005. Istilah ini terlintas di benak Garrett saat ia memikirkan sebuah terminologi sederhana untuk merepresentasikan sekumpulan teknologi yang ia usulkan pada seorang kliennya.
Sekalipun istilah “Ajax” telah muncul sejak 2005, sebagian besar teknologi yang membangun Ajax telah dikembangkan satu dekade lebih awal oleh Microsoft melalui teknik Remote Scripting untuk melakukan pemanggilan (loading) suatu halaman secara asinkron tanpa harus memanggil ulang seluruh data, antara lain dengan memanfaatkan elemen IFRAME (diperkenalkan pada browser Internet Explorer 3 pada 1996) dan LAYER (diperkenalkan pada Netscape 4 pada 1997, dan kemudian ditinggalkan pada tahap awal pengembangan browser Mozilla). Kedua tipe elemen tersebut memiliki atribut SRC yang dapat memanggil suatu URL eksternal dan dengan menjalankan suatu halaman yang mengandung JavaScript yang memanipulasi halaman induk, menghasilkan efek yang mirip penggunaan teknologi Ajax. Set teknologi client-side ini biasanya dikelompokkan dalam terminologi generik DHTML. Sementara itu, Macromedia Flash, mulai dari versi 4, telah menjalankan file XML dan CSV dari remote server tanpa perlu memanggil ulang (reloading) halaman web.
Microsoft Remote Scripting (MSRS) yang diperkenalkan pada 1998 adalah pengganti yang lebih elegan terhadap teknik-teknik yang disebut diatas, dengan data diakses oleh suatu JavaApplet, dimana sisi client dapat berkomunikasi memanfaatkan JavaScript. Teknik ini bekerja baik pada browser Internet Explorer versi 4 maupun pesaingnya saat itu, Netscape Navigator versi 4. Microsoft lantas mengembangkan objek XMLHttpRequest pada Internet Explorer 4 dan untuk pertama kalinya memanfaatkan teknik ini melalui XMLHttpRequest pada Outlook Web Access yang disertakan pada perangkat lunak Microsoft Exchange Server 2000. Selanjutnya, Remote Scripting Framework seperti ARSCIF muncul pada 2003, tidak lama sebelum Microsot memperkenalkan Callback pada ASP.NET.
Sebagai tambahan, Konsorsium World Wide Web mengeluarkan beberapa rekomendasi yang juga mengijinkan komunikasi dinamis antara server dan user agent, walaupun hanya sedikit diantaranya yang mendapatkan dukungan, diantaranya adalah elemen object pada HTML 4 untuk merekatkan (embed) konten dinamis pada dokumen (menggantikan frame inline pada XHTML 1.1) serta spesifikasi Load and Save pada Document Object Model (DOM) Level 3.
Alasan paling jelas untuk memanfaatkan Ajax adalah meningkatkan pengalaman browsing pengguna. Halaman yang memanfaatkan teknologi Ajax lebih berlaku sebagai aplikasi yang berdiri sendiri ketimbang sebagai sebuah halaman web. Mengklik suatu link pada halaman web berteknologi Ajax akan membuat halaman terbarui secara dinamis, sementara browser tidak perlu memanggil ulang seluruh halaman. Dengan demikian diperoleh peningkatan kecepatan respon.
Dengan meng-generate HTML secara lokal dalam browser, dan hanya melakukan panggilan JavaScript terhadap data di server, halaman web berbasis Ajax dapat dipanggil relatif cepat akibat kecilnya trafik antara server-client. Ini akan sangat bermanfaat pada halaman web dengan data berjumlah banyak dan harus ditampilkan dalam beberapa halaman. Keuntungan ini semakin terasa kalau kita mempertimbangkan penggunaan elemen-elemen HTML yang sering muncul berulangkali dalam satu halaman (seperti elemen TR dan TD untuk menampilkan tabel). Penggunaan teknologi Ajax dapat mengurangi load halaman karena elemen-elemen tersebut dapat di-generate secara lokal.
Sebagai bagian dari skema “dipanggil apabila dibutuhkan” (load on demand), beberapa aplikasi berbasis web menjalankan bagian dari “event handler” dan kemudian menjalankan fungsi-fungsi secara on the fly. Teknik ini secara signifikan mengurangi konsumsi bandwidth untuk aplikasi web yang memiliki alur logika dan fungsionalitas yang kompleks.
Namun demikian, penggunaan teknologi Ajax juga menyimpan sejumlah kelemahan. Diantaranya, halaman yang di-generate secara dinamis tidak teregister pada “history” browser sehingga penggunaan tombol back dan forward mungkin tidak akan bekerja semestinya. Para pengembang telah mengimplementasikan berbagai solusi terhadap permasalahan ini, diantaranya adalah penggunaan elemen IFRAME yang tersembunyi untuk meminta perubahan yang dapat dikenali oleh fungsi history pada browser yang kemudian dimanfaatkan oleh fungsi tombol back. Contoh penggunaan teknik ini bisa dilihat pada situs Google Maps, dimana perintah pencarian bekerja pada elemen IFRAME yang tak terlihat, namun hasil pencarian diarahkan pada elemen halaman yang terlihat. Sebagai catatan, Konsorsium World Wide Web (W3C) tidak memasukkan elemen IFRAME dalam standar XHTML 1.1 dan lebih merekomendasikan elemen OBJECT.
Berikutnya adalah kesulitan yang dihadapi pengguna saat mem-bookmark halaman yang di-generate secara otomatis oleh Ajax. Solusinya juga sudah ada, salah satunya dengan memanfaatkan URL fragment identifier (bagian dari URL setelah tanda ‘#’) untuk menyimpan jejak sehingga pengguna dapat kembali ke status yang telah ditandai. Hal ini dimungkinkan karena kebanyakan browser mengijinkan JavaScript untuk memperbarui fragment identifier suatu URL secara dinamis, dengan demikian, aplikasi Ajax dapat menyimpan sebuah kondisi saat pengguna melakukan perubahan pada status aplikasi. Solusi ini juga dapat meningkatkan dukungan terhadap penggunaaan tombol back. Namun demikian, ini masih bukan solusi yang komplit.
Isu lainnya menyangkut optimasi mesin pencari. Situs web yang memanfaatkan Ajax untuk memanggil data yang seharusnya diindeks oleh mesin pencari perlu bersikap hati-hati dengan menyediakan data yang ekuivalen pada URL-nya dalam format yang bisa dibaca oleh mesin pencari. Ini karena robot pada mesin pencari biasanya tidak menjalankan kode-kode JavaScript yang dibutuhkan dalam fungsionalitas Ajax. Ini bukan masalah yang spesifik untuk Ajax mengingat isu yang sama juga dialami situs yang menyediakan data dinamis yang membutuhkan page refresh oleh pengguna, misalnya penekanan tombol submit pada akhir pengisian formulir (secara umum, masalah ini kadang-kadang dirujuk sebagai hidden web).
Ketergantungan pada JavaScript juga menjadi isu tersendiri. JavaScript sering diimplementasikan secara berbeda di tiap browser. Karena itu, situs yang menggunakan JavaScript perlu diuji pada sejumlah browser yang berbeda untuk meyakinkan kompatibilitasnya. Tidak jarang kode JavaScript harus ditulis dua kali, satu bagian untuk browser IE dan bagian lain untuk Mozilla. Masalah juga kerap muncul apabila pengguna tidak mengaktifkan dukungan JavaScript pada browsernya.
Tidak ada komentar:
Posting Komentar