grid response time

I need to populate data to 5 grids, It takes about 0.2 second to show updated content for one grid. However, instead to show updated grid one-by-one, it keeps silence for a second and show 5 updated grids all together. I used the following code:

Function showGrids()
{
fillGrid(grid1);
fillGrid(grid2);
fillGrid(grid3);
fillGrid(grid4);
fillGrid(grid5);
}

Function fillGrid(grid)
{
//some code to populate data to grid,
//such as: grid.setCellData(cellValue,column,row)
}

As my testing, the above procedure keeps a second silence until a new screen with 5 updated grids showing up together. I am wondering why it happened this way. It looks like slow response. If I add an “alert()” after each “fillGrid()”, it takes about 0.2 second to show each updated grid one-by-one.

I like the 5 updated grids to show up one-by-one. It can let users focus on the first updated grid while other grids updating. The response looks much faster in this way. How can I do it?

Thanks,

The browser starts rendering only after the exit from the javascript thread. If you want incremental updates - put each iteration into separate setTimeout() call, so the control is returned to the browser engine between the updates.

Thank you for your prompt response. Could you tell me how to "put each iteration into separate setTimeout() call"? How can I alter the above sample code?

Thanks again!

http://msdn.microsoft.com/en-us/library/ms536753(VS.85).aspx