Xah Lee, 2006-03
In web application programing, there is a painful issue. That is, the page needs to reload for every request to the server.
For example, when you have a page for users to submit a form to buy a product from a website, and suppose that item is out of stock. The usual process goes like this: the user clicks “Buy” button, and the page reloads, and then the same page shows up again with a new piece of additional text saying that it is “out of stock”. Aside from this new text, the rest of the page is the same.
This page reloading is a pain, because it resends much of the same page causing redundant network traffic, and the user has to wait for the page reload. It would be great, if after clicking “Buy”, then the simply shows “Sorry Out of Stock” instantaneously without reload. However, this is impossible because the way HTML, CGI, HTTP works. With the advent of JavaScript and DOM in the late 1990s, it is possible to update just part of the HTML page without reloading the whole page, however it does not solve the problem completely. Because, some operations such as putting a item to the shopping basket requires communication with the server, to check if the item is in stock, or update the user's shopping cart, but the only way browsers talk to the server is by HTTP requests.
Web programers have hacked around to solve this problem, and in 2000 or so have came up with hacks such as using a hidden IFRAME to exchange data between the client and server, or as Microsoft has hacked up in-house solution based on Java.
However, in 2004 or so a robust solution is coming into the scene, and that is XMLHttpRequest.
In this page we show a simple example demonstrating how it works.
References: