RadControls for ASP.NET AJAX The RadAjaxManager control allows you to easily create settings that update many controls on the page. Having a large number of updated controls can both help with a performance problem by rendering smaller portions of the page and worsen the situation by triggering unnecessary DOM layout updates. Dealing with such a performance problem will require actions specific for the current scenario.
Optimizing DOM updates
Most of the slowdown happens when updating multiple controls in a table element. Every DOM update triggers a set of layout recalculations that take up unneeded time. Take the following HTML for example:
CopyASPX
<div id="Header" style="width: 100%;" runat="server">
<table id="Table3" cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td>
<asp:Label ID="lblStatus" runat="server" />
</td>
<td>
</td>
<td style="height: 25px">
<asp:Label ID="lblMessage" runat="server" />
</td>
</tr>
</table>
</div>Having two AjaxSetting's for both labels will cause two DOM element updates: the spans rendered by lblStatus and lblMessage respectively. This will make the browser recalculate the table size twice. The process can be optimized by updating the TABLE or the outer DIV element. Updating the Header control will update both labels and will trigger one DOM update only.
Prohibitively bad performance is usually the result of updating controls that are placed deeply inside nested tables. Most browsers are slow when rendering elements with percentage dimensions (typically width or height of 100%), so another way to optimize this is to switch to sizes in pixels. Another possible solution is to use fixed table layout by setting an HTML table's CSS style property table-layout to fixed:
CopyCSS
<style type="text/css">
#Header table
{
table-layout: fixed;
}
</style>You will need to define width and <colgroup> and <col> elements for your table when using fixed table layout.
Other performance boosters
Having too many CSS stylesheet inclusions or too large CSS style blocks in your <head> tag can be slow to update too. You can try switching Telerik RadAjax's head update feature off if you do not load CSS-rich controls in Ajax requests. You can do that by setting the EnablePageHeadUpdate property to false.
Most browsers render documents a lot slower when operating in quirks mode. Try switching to strict mode by specifying a doctype for your document:
CopyHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">