Friday, April 27, 2007

Simultaneous calls to server from UpdatePanel

The simplest way of Ajaxifying your ASP .NET web page using the ASP .NET Ajax library is to make use of its "UpdatePanel" control. It allows parts of your web pages to get refreshed, avoiding whole page reloads. This control causes asynchronous postbacks to the server. On receiving a response from the server, only the components inside the UpdatePanel are re-rendered. With the Ajax approach of making the calls to the server asynchronously, the user interface remains active even after a request to the server has been initiated. This means that the user can click on other active buttons on the page and initiate some more asynchronous calls (assuming those actions are also ajaxified).

Does this mean that I can place multiple UpdatePanels on my web page, let the user perform many actions simultaneously, resulting in many asynchronous calls to the server and different parts of the page getting refreshed as and when the corresponding Ajax call ends? Well - the answer to this question is NO and to understand why it is important to understand how an asynchronous postback is (or is not) different from a regular postback

The asynchronous postback made by UpdatePanel is exactly the same as a regular postback except for one important thing: the rendering. Asynchronous postbacks go through the same life cycles events as regular pages. Only at the render phase do things get different, since only the components inside the UpdatePanel are re-rendered instead of the whole page.

What this means for us is: Assume that there are two UpdatePanels on a web page, with one button each. The user clicks on Button 1 in the first UpdatePanel and the processing starts. Since the UI remains active after the first Ajax call, the user clicks on Button 2 in second UpdatePanel - assuming that both the calls will go through and he will get to see both the updates in some time. However, what will happen is that the second button click will invalidate the asynchronous postback initiated by the first button click. Effectively, only the final and the second button click will actually get processed, instead of both!

Note: While this is the story of the ASP .NET Ajax UpdatePanel - another interesting thing is the limit of 2 simultaneous connections to a server, a restriction put by most of the browsers today. This means that even with the crude simple Ajax way, it is possible to process only two requests simultaneously. All the other requests will be queued by the browser, until a free connection is available.

2 comments:

irfan said...

quite informative post. I had the similar scenario in one of the pages and was wondering why this behavior.

Thanks.

Unknown said...

I'm currently facing the same problem that you describe above, just to test the relaibility of my app i set a sleep(100000) in the server, just to know what would happen in case that the DB takess to long or any other problem that may cause a long delay in the callback, and i catch the timeout exception but i can make any other async call (well i can, but the server won't run it)until the first one ends, this is a huge drawback because the only way i have to prevent this case is reloading the page, and that's is not the idea of using the UpdatePanel in the first Place.

If you know or in the future find out how to fix this please contact me.

Martin

martinm@onetree.com