Ajax, asenkron JavaScript ve XML anlamına gelmektedir. Fakat bu ne demek? Web geliştirmeye yeni başlamış ve bu terimle ilk kez karşılaşmışsanız, başlarda size biraz karışık gözükebilir. Ajax kısaca arka planda bir web sayfasını yenilemeden veri göndermek ve almak için kullanılan bir web geliştirme tekniğidir. Yani Ajax bir programlama dili veya aracı değil, sadece bir kavramdır. Şimdi bunun ne anlama geldiğini uygulama üzerinden örneklendirelim.
Twitter’a girip timeline’ı açarsak bir süre sonra siz sayfayı yenilemeseniz dahi ekranızın anasayfa kısmında yeni tweet’lerin mevcut olduğunu gösteren bir icon göreceksiniz. Daha da beklerseniz, takip ettiğiniz kişiler Twitter’da bir şeyler paylaştıkça bu sayının arttığını görürsünüz.
Sayfayı hiç yenilemediğimiz halde bu verilerin nasıl yüklendiğini anlamak ve arka planda neler olup bittiğini görmek için başlayalım. İlk olarak Chrome geliştirici araçlarını açın, Network sekmesine göz atın ve XHR kısmına girin. Twitter web sayfasının her 10 saniyede bir sunucularına yeni bir istekte bulunduğunu ve bu isteğin amacının zaman tünelinizde yeni tweet olup olmadığını sormak olduğunu görebilirsiniz.
Sayfayı hiç yenilemediğimiz halde verilen yüklendiğine dikkat edin. Bunun sebebi, verileri URL çubuğu aracılığıyla başlatılan tipik tarayıcı ile yüklemek yerine sahne arkasına HTTP isteklerini yapmak için JavaScript, XML HTTP istek nesnesini kullanmasıdır. Yani JavaScript, XML http isteği aracılığıyla yapılan bu isteklerin, tarayıcının URL çubuğuna girilen normal isteklerle aynı olmasıyla ilgilidir.
Peki Ajax nasıl çalışır özetlemek gerekirse: JavaScript, güncelleme sürecini otomatikleştirir, güncellenmiş içerik talebi, evrensel olarak anlaşılabilir hale getirmek için XML olarak biçimlendirilir ve JavaScript, sayfayı görüntüleyen kullanıcı için ilgili içeriği yenilemek üzere yeniden devreye girer.
Şimdir bir karşılaştırma tablosu oluşturalım. Geleneksel model ve Ajax modeli arasında nasıl bir fark var değerlendirelim.
Geleneksel Model
- Web tarayıcısından sunucuya bir HTTP isteği gönderilir.
- Sunucu verileri alır ve ardından alır.
- Sunucu, istenen verileri web tarayıcısına gönderir.
- Web tarayıcısı verileri alır ve verilerin görünmesi için sayfayı yeniden yükler. Bu işlem sırasında kullanıcıların tüm işlem bitene kadar beklemekten başka seçeneği yoktur. Sadece zaman alıcı olmakla kalmaz, aynı zamanda sunucuya gereksiz bir yük bindirir.
AJAX Modeli
- Tarayıcı, XMLHttpRequest’i etkinleştirecek bir JavaScript çağrısı oluşturur.
- Arka planda, web tarayıcısı sunucuya bir HTTP isteği oluşturur.
- Sunucu verileri alır, alır ve web tarayıcısına geri gönderir.
- Web tarayıcısı, doğrudan sayfada görünecek olan istenen verileri alır. Yeniden Yükleme gerekmez.
Ajax’ı Web Uygulamalarında Kullanmanın Faydaları
Form Doğrulama : İstemci tarafı doğrulamalarının gönderimden sonra gerçekleştiği geleneksel form gönderiminin aksine, AJAX yöntemi kesin ve anında form doğrulaması sağlar.
Asenkron Aramalar Yapma : Ajax, bir web sunucusuna asenkron arama yapmanızı sağlar. Bu, istemci tarayıcısının, kullanıcının bir kez daha harekete geçmesine izin vermeden önce tüm verilerin gelmesini beklemekten kaçınmasını sağlar.
Bant genişliği kullanımını azaltma : Ajax’ın bir diğer avantajı da bant genişliği kullanımından geliyor. Bu eylem, web performansını ve yükleme hızını iyileştirmede de etkilidir. Ajax, tüm sayfa içeriğini iletmek yerine parçacık içeriklerini getirerek sunucunun bant genişliğinden en iyi şekilde yararlanır. Bu, sayfayı yeniden yüklemeden arka plan gerçekleştirmek için veritabanından veri getirebileceğiniz ve veritabanına depolayabileceğiniz anlamına gelir.
Artan Hız : Ajax geliştirmenin temel avantajlardan biri olan zenginleştirilmiş bir kullanıcı deneyimi sunar. Sunucu ile az miktarda veri alışverişi yaparak web sayfalarının güncellenmesini sağlar. Bu şekilde, tüm sayfayı yeniden yüklemek zorunda kalmadan bir web sayfasının bölümlerini oluşturmak mümkündür .Klasik web sayfalarında tüm sayfayı yeniden yüklemeniz gerekir ve bu zahmetlidir. Ajax, tarayıcı performansını artırmaya yardımcı olur ve duyarlı bir kullanıcı deneyimi sunarak daha hızlı bir hız sunar.
Ajax, geliştiriciler ve kullanıcılar olarak bir web sayfasıyla iletişim kurmak için yeni yöntemler ve teknikler sağlasa da, hatırlanması gereken en önemli şey, bunun ürün veya projelerle nasıl etkileşime girileceği ile ilgili olduğu ve oluşturulan isteklerin süresini ve sayısını azalttığıdır. Bu blogun amacı AJAX’ın temellerini, AJAX’ın nasıl çalıştığını ve avantajlarını açıklamaktı. Diğer içeriklerime buradan ulaşabilirsiniz.
