Even though Ajax has a single name, it's not a single technology. It's actually a combination of several technologies working together. It helps if we begin by understanding the history of Ajax. Starting back in 1996, Microsoft and Mozilla, makers of Netscape and Firefox, begin experimenting with asynchronous loading of content in web browsers. Asynchronous meaning that the content doesn't all load at the same time. In 1999, Microsoft Internet Explorer 5 added something called XMLHTTP ActiveX control.
And this was really the first time that we were able to load asynchronous content. Between 2000-2002, Mozilla created a standardized XMLHttpRequest object that was modeled very closely on Microsoft's interface. And it was this standardization that became adopted by all web browsers between 2002-2006. Right in the middle of that period, in 2004, Google began using XMLHttpRequest to asynchronously load content for Gmail.
In 2004, they also used it for Google Suggest. That's what happens when you go to the Google homepage and you start typing and it makes suggestions as you type of possible searches that come up right below the search box. And then in 2005, they began using it for Google Maps. Now, Google was one of the first companies to realize the tremendous promise of using XMLHttpRequest but it was not just Google. Flickr, Amazon, and Kayak.com were some of the other early adopters. Up until this point, it's still just a technique for using several different technologies together.
The moment when Ajax really caught fire with web developers was when it was given a name and explained how you could use it in an article by Jesse James Garrett of Adaptive Path. His article, "Ajax: A New Approach to Web Applications," came out in February of 2005. It's still available online and it's still a great introduction to the topic. Before Ajax, all web pages used the classic HTTP model. Let's make sure that we understand that first. The user performs an action, for example, they click on a link.
Google Maps remains an excellent example of using Ajax. As you drag, you zoom in, you zoom out, or change between satellite, street, or terrain views, the tiles of the map are updated in the background. And throughout it, users maintain the ability to continue interacting with the map. You aren't stuck waiting for your last click to reload a whole new webpage. Ajax has become so commonplace that it's easy to overlook it and take it for granted. Now, as I said earlier, Ajax is made up of a group of technologies.
- What is Ajax?
- Creating Ajax requests and responses
- Monitoring Ajax request state and events
- Responding to Ajax requests with HTML and JSON
- Building Ajax buttons
- Submitting forms with Ajax
- Implementing infinite scrolling
- Adding autosuggestions to text fields