There are many types of web applications that rely on periodic refresh or “polling” in one form or another. Some common applications that all require such a solution include:
- Online games
- Chat systems
- News sites
- Monitoring systems
I recently needed a solution that could periodically check a database table to see if it had been updated with the information my application required. Once the database was updated, I needed my script to automatically update my content with that information.
The Solution
I came up with a very simple solution that relies on Javascript’s setInterval method to make periodic AJAX requests to the server and check to see if the needed information is available. Once the information was there, I ended the setInterval method by calling the clearInterval method as shown below.
[code language=”javascript”]
function periodicRefresh(requiredInfo){
var myInterval = setInterval( function(){
$.ajax({
url: ‘/system/myServerScript.php’,
type: ‘POST’,
dataType: ‘json’,
data: {ri: requiredInfo},
success: function(response){
if(response.success == true){
// UPDATE THE CONTENT WITH THE NEW INFORMATION
var freshData = response.data;
$(‘#oldData’).replaceWith(freshData);
// ONCE THE NEW DATA HAS BEEN OBTAINED, END setInterval
clearInterval(myInterval);
}
}
});
// REPEATS EVERY 5 SECONDS UNTIL clearInterval IS CALLED
},5000);
}
[/code]
This is a very simple example of periodic refresh, and there are several ways to accomplish the same thing. Many applications will require a system that constantly checks the server for changes as long as the user is active such as: chat systems, news sites, and monitoring systems. In these situations, it is important to stay focused on optimization since every request demands resources on both ends. The developer should try to increase the average refresh period and reduce the content sent per refresh without having a negative impact on user experience.
Make the Server Aware of the Browser and Vice Versa
Making the server more aware of the browser and the browser more aware of the server is one key to optimizing periodically refreshing applications.
To make the server more aware of the browser, the browser can upload a message to the server periodically to let the server know the user is still active. If the user is not still active, the polling will end, saving the server precious resources.
To make the browser more aware of the server, the browser can monitor the server’s resources and dynamically modify the interval based on the server’s ability to keep up.
