AJAX: Mengenal Pengertian, Fungsi, dan Cara Kerjanya

Apa itu AJAX


Mengunjungi web site yang terlalu banyak reload setiap kali klik fitur-fiturnya tentu menyebalkan, bukan? Belum lagi kalau ternyata loading web site tersebut lemot. 

Untungnya ada AJAX yang biasa digunakan oleh net developer. Web site jadi tak perlu direload setiap kali pengunjung klik fitur tertentu, seperti fitur chat, komentar, dan lainnya.  Aktivitas browser jadi tak terganggu, server tak terlalu terbebani, dan tentunya pengguna jadi lebih nyaman menggunakan web site. 

Memangnya, apa sih AJAX itu? Terus, apa saja fungsi dan cara kerjanya sehingga web site bisa lebih mudah dan nyaman digunakan. Nah, di artikel ini Anda akan belajar lebih element mengenai AJAX. Yuk simak selengkapnya! 

Apa itu AJAX? 

“Capek euy reload halaman web site mulu. Mana server kalo ditanya lama jawabnya..” protes browser

“Salah sendiri ga minta bantuan aku..” kata AJAX 

AJAX atau Asynchronous JavaScript and XML adalah teknik yang digunakan untuk membuat web site yang dinamis. Artinya web site mampu mengupdate dan menampilkan information baru dari server tanpa perlu melakukan reload. 

Salah satu contoh penggunaannya misalnya pada replace jumlah angka likes dan komentar pada media sosial Instagram, Fb, Twitter, dan lainnya. 

contoh AJAX Javascript pada twitter

Sesuai namanya, AJAX terdiri dari JavaScript dan XML yang bekerja bersama. JavaScript adalah bahasa pemrograman untuk mengelola konten web site yang dinamis. Sementara XML (eXtensible Markup Language) digunakan untuk memuat dan membawa information dari server ke browser. 

AJAX JavaScript dan XML ini bekerja secara asynchronous untuk berkomunikasi dengan server. Proses pertukaran informasi ini dilakukan di background. Artinya, saat AJAX JavaScript dan XML bekerja, halaman dapat tetap diakses oleh pengunjung web site. 

Bagaimana cara kerja AJAX selengkapnya? 

Baca juga: Panduan Belajar HTML untuk Pemula 

Cara Kerja AJAX 

Kalau dijabarkan dengan contoh sebuah fitur pada web site, begini cara kerja AJAX: 

  1. Browser akan memanggil AJAX javascript untuk mengaktifkan XMLHttpRequest dan mengirimkan HTTP Request ke server. 
  2. XMLHttpRequest dibuat untuk proses pertukaran information di server secara asinkron.
  3. Server menerima, memproses, dan mengirimkan information kembali ke browser.  
  4. Browser menerima information tersebut dan langsung ditampilkan di halaman web site, tanpa perlu reload atau membuat halaman baru. 

Masih bingung dengan penjelasan di atas? Baiklah. Mari gunakan sebuah cerita untuk memahaminya..

Cara kerja AJAX Javascript

Katakanlah Anda sedang berada di kedai kopi AJAX dan memesan secangkir kopi kepada kasir. Lalu, kasir mengirim pesanan ke barista untuk membuatkan kopi sesuai pesanan Anda. Setelah kopi Anda jadi, akan ada pelayan yang mengantar kopi Anda.

Ketika ada orang lain yang ingin membeli kopi, kasir bisa kembali melayani tersebut. Semua prosesnya seperti yang terjadi pada Anda.

Berbeda ketika Anda memesan kopi di kedai kopi B Aja. 

cara kerja kedai kopi B Aja

Karena hanya ada seorang pelayan yang merangkap kasir dan barista, proses pemesanan dan penyajian kopi menjadi lama. Bahkan, pengunjung lain baru bisa dilayani setelah pesanan kopi sebelumnya selesai dibuat.  

Proses pemesanan pada kedai kopi B Aja mirip dengan apa yang terjadi jika sebuah web site tidak memanfaatkan AJAX. 

Fungsi AJAX 

Apa saja fungsi AJAX untuk web site? Ini beberapa fungsinya: 

1. Mengirim dan Mengambil Information dari Server 

AJAX dapat digunakan untuk mengirim pesan ke server lalu mengambil hasil information dari server ke browser. Prinsip yang dikerjakan pun adalah asynchronous. Jadi, selama proses mengirim pesan terjadi, browser bisa tetap terus digunakan sambil menunggu respon dari server. 

2. Mengupdate Tampilan Web site Tanpa Harus Reload

Semua orang suka yang praktis. Nah, dengan adanya AJAX, pengunjung web site bisa lebih nyaman mengakses web site tanpa perlu berulang kali reload halaman. Hal ini terjadi karena AJAX hanya mengirimkan sebagian information yang dibutuhkan untuk proses saja. 

3. Membuat Web site Lebih Cepat dan Responsif

Dengan adanya AJAX, hanya information yang diperlukan saja yang akan direquest ke server. Maka, proses di server bisa jadi lebih cepat dan information bisa langsung dikirim kembali ke browser. Imbas yang dirasakan pengunjung adalah loading web site jadi lebih cepat.  

Jadi, pengunjung tak perlu menunggu lama ketika mengakses fitur di web site seperti chat, komentar, dan lainnya. 

1. Chat

Seberapa sering Anda mengunjungi sebuah web site dan menemukan fitur stay chat di sana? Cukup sering, kan? 

Contoh AJAX pada chat website

Dengan adanya fitur chat, semakin mudah bagi pengunjung untuk berkomunikasi dengan pemilik web site. 

Namun, coba bayangkan jika halaman web site harus reload setiap pengunjung klik tombol kirim untuk chat. Bukannya membantu, fitur itu justru akan membuat pengunjung kesal, kan? 

Nah, dengan adanya AJAX, fitur chat di web site bisa terus digunakan dengan nyaman. Apalagi, kalau performa web site optimum. Proses chat bisa jadi lebih cepat. 

2. Voting dan Score

Anda yang aktif di media sosial atau belanja on-line pasti sudah tak asing lagi dengan fitur voting Twitter atau ranking di Google Bisnisku, bukan?

Nah, fitur tersebut dibuat menggunakan AJAX. Setelah Anda klik tombol like atau kirim ranking, web site akan langsung mengupdate jumlahnya tanpa reload atau mengubah tampilan halaman.

Rating Niagahoster

Sama halnya saat Anda mengisi kolom komentar pada postingan. Setelah mengirimkan komentar, web site akan segera replace hasilnya. 

3. Google Search Suggestion 

Kurang afdol rasanya kalau tidak memasukkan Google Search Suggestion sebagai contoh AJAX dalam web site. Kenyataannya, popularitasnya semakin meningkat saat Google menggunakannya. 

Contoh penggunaan AJAX Javascript pada Google Suggestion

Ketika Anda mengetikkan key phrase di Google Search, Anda cukup mengetikkan beberapa kata saja. Nantinya, Google Search Suggestion akan memberikan rekomendasi terbaik secara cepat. Anda tak perlu menunggu lama dan berpindah halaman. 

Pastikan AJAX Menjadi Bagian Web site Anda! 

Nah, itu tadi penjelasan lengkap mengenai AJAX. Anda sudah mempelajari pengertian dan cara kerja hingga fungsinya pada web site. 

Dengan menggunakan AJAX, Anda dapat membuat web site dengan person expertise yang baik. Selain web site jadi lebih cepat, pengunjung juga akan senang karena tak perlu sering reload untuk mengakses fitur di web site. 

Beberapa fitur web site yang menggunakan AJAX antara lain: stay chat, sistem voting dan ranking, notifikasi, dan masih banyak lagi termasuk Google Search Suggestion. 

Dengan semua manfaat yang ditawarkan, yakin tidak ingin menggunakan AJAX untuk di web site Anda? 

Dikutip dari berbagai sumber

Leave a Reply

Your email address will not be published. Required fields are marked *