Cancel a scheduled task in javascript

More than often, the application UI consists in one master table that is used to refresh a slave one (item-details view).

When the user selects one record of the item list, the detail frame is refreshed with the fields related to this item. We use AJAX request to refresh the detail view.

However, multiple useless requests may occur when the user scrolls quickly through the master table. This can be avoided if we decide to refresh the detail view only if the user selection remains the same for a certain time.

The example below presents such mechanism.

The showDetails() function is called by a UI event such as onMouseOut().  The trick consist in delaying the refresh (by one second here), via a setTimeout() function. We keep track of the scheduled call in a global variable. This allow us to cancel the request in case another item in selected in the meantime.

var reqID = null; // Global var to avoid multiple requests when scrolling through the Item table
 
function showDetails(selectedItem) {
    if (reqID){
         // If an delayed AJAX call was already scheduled , we cancel it
        clearTimeout(reqID);
        reqID=null;
     }
 // Schedule a delayed ajax call (1s)
 reqID = setTimeout( function() { myMagicAjaxCall(selectedItem);}, 1000);
}

Thanks to StackOverflow article for the initial suggestion

Improve Internet Explorer with Google chrome frame

Google just released a preview of Chrome Frame, a plug-in for Internet Explorer. It improves IE ‘s javascript capabilities and make it compatible with the new HTML 5.

This sounds very promising for corporate environments where IE 6 is required.

Read the announcement on the developer blog and download the plug-in on the Google Chrome Frame page.

Our rapid benchmark shows 60 x acceleration !

I made a quick javascript benchmark using the online sunspider tests  (http://www2.webkit.org/perf/sunspider-0.9/sunspider.html).

The results are impressive with more than 60 times acceleration (The global transaction passes from 35 seconds to 0.5 second) !

Have a look on the the  full results using a standard IE6 vs the same IE with the plugin.

The test configuration:

  • Microsoft Windows XP Professional Version 2002 Service Pack 3
  • IE version 6.0.2900.5512.xpsp_sp3_gdr.090206-1234

The only actual drawback is that windows 2000 is not yet supported.

Thanks to Cyril for helping me running the benchmark.

Edit: Chrome Frame plugin is usually lauched by using a specific meta tag in the HTML header. In case you need to force the use of chrome frame without changing the original site, you may trigger it by adding cf: at the begining of the url: (like cf:http://le-moulin-de-verre.com/fieldnotes/).

See the documentation for details