Periodic Refresh in an Ajax Based Application

Streaming information without the need from user action is one of the key features of an Ajax based application. With this feature, users will have real time updates of any information they have requested.

Added to the above feature in Ajax is that the entire webpage will never be refreshed just to change the information in one part of the webpage. Because of this, users are free to interact with various parts of the website.

With this feature in Ajax, developers have even dared to build a desktop experience using only the browser. The server will constantly stream the information to the client browser and through client side scripting of JavaScript, only specific parts of webpage are changed.

This feature was made possible by XMLHttpRequest. This command access the information specific to the browser, fetching the necessary information and streams them accordingly. XMLHttpRequest has actually become the core command of JavaScript and Ajax since it has the ability to communicate with the server without dragging the whole webpage.

By using XML, data will be streamed asynchronously to the client without interaction. But XMLHttpRequest alone will ensure asynchronous data streaming with user interaction. Users still has to interact with the webpage so that new information will be obtained.

To enable continuous streaming of information, developers have to add the setInterval function to the website. Basically, this function refreshes the website content as set by the developers. With the use of setInterval, websites could be updated continuously and in milliseconds. The real time data is assured with this function.

Combining XMLHttpRequest with setInterval, you will have a website with streaming data for the users. As soon as new information is available, users will immediately see them. No more waiting and no user interaction either. The information will be available as soon as the server updates the information.

Developers on the other hand should never hasten the setInterval function. The 0 (zero) interval is just impossible to implement since it will eventually lag the browser and halt the information altogether. This parameter is even bad for users since they might never see the update as it constantly changes right in front of them.

However, this ideal situation is not applicable in reality. By continuously using XMLHttpRequest, the resources of the server and the client side will be used constantly and other functions in the website will be sacrificed to make way for these two functions. Eventually, the website will go down as the server and client communication will be lagged because constant information streaming will not be handled by the client and the server.

To answer this concern, developers added another function to control the setInterval function. The function setTimeout instructs XMLHttpRequest to stop fetching for new information at a certain time when there is new data available. It is a very simple command that could be added to setInterval and will save user and server resources while maintaining its capability to stream data in real time.

Good configuration of setInterval with setTimeout will ensure that the Ajax based website will have the latest information without requiring too many resources from users and the server.