Since ASP.NET AJAX UpdatePanel
was first introduced, it has earned a strange mix of reputation. On the one hand, it has become a tool of first choice for many ASP.NET developers who wanted an easy way of introducing an AJAX-like behavior for their ASP.NET web apps. On the other hand, it has earned a lot of criticism from seasoned web developers because of certain performance consequences associated with complex usage scenarios.
Well, everything may be good and may be evil based on how we use it. From my experience, conscious and judicious use of UpdatePanel
is the key to saving its benefits and avoiding potential problems.
Below, I suggest a number of rules that help achieving better results when using UpdatePanel
.
- Avoid automatic refreshing of
UpdatePanel
; always stay in control of which UpdatePanel
and when refreshes: set UpdateMode
property to Conditional
(the default value is Always
). - Minimize the content of the
UpdatePanel
: the <ContentTemplate>
should only include controls that are necessary to refresh. For instance, if user input requires server-side validation, include only an error message mark-up in the UpdatePanel
and leave the rest of the form outside. - Try to keep the partial postback trigger controls outside of their respective
UpdatePanels
unless its necessary to change their markup. - Try to stick to a simple rule: one trigger for one
UpdatePanel
. If you need to refresh multiple UpdatePanels
during one request, add a trigger control to only one of those UpdatePanels
and refresh the others programmatically in an event handler on the server. The idea is to avoid uncontrollable refreshing of unnecessary UpdatePanels
. - Since
ViewState
is updated with every partial postback request, turn the ViewState
off on a page that contains the UpdatePanel
wherever possible or store the ViewState
on the server to avoid transferring it back and forth with every async request. - Since Page runs through its lifecycle during every partial postback and executes methods like
Page_Load
or Page_PreRender
, make sure that logic that is unnecessary for refreshing UpdatePanel
is not executed by wrapping it in if(!ScriptManager.IsInAsyncPostBack)
. - If you use
UpdatePanel
event handlers like Init
, Load
, PreRender
and Unload
, make sure that code inside these event handlers does not execute unless necessary by checking Page.IsPostBack
and ScriptManager.IsInAsyncPostBack
properties. - If you trigger an
UpdatePanel
programmatically from the client-side (via JavaScript), make sure that its event handler check for the event trigger value using Request.Params["__EVENTTARGET"]
to avoid unnecessary execution path. - If you programmatically update Page's Header (Title, etc.) or other Page's content that is outside
UpdatePanel
, make sure that this code never gets executed during partial postbacks. First of all, it's not necessary since page does not refresh but also it may be dangerous because the content may not be handled properly by a browser.
Conclusion
There may probably be more tricks and tips regarding usage of UpdatePanel
, but those mentioned above have been proven by real experience. I would also recommend reading an excellent post by Dave Ward that helps in understanding how UpdatePanel
works behind the scenes and never hesitate using Fiddler to investigate what your web app's doing.