This is a migrated thread and some comments may be shown as answers.

Radgrid improve paging performance

3 Answers 240 Views

Grid

This is a migrated thread and some comments may be shown as answers.

kavitha asked on 28 Apr 2011, 10:46 PM

Hello,

I am on Q2 2010 SP2, How can i improve the performance of my RadGrid, it has just 75 rows but it takes close to 7 seconds when i navigate between pages each of size 25, Is there a way to improve this latency? I am using filtering and sorting. Here is a sample of my grid declaration.

Lot of the help i got from previous posts don't work for filtering and sorting option. Any help is greatly appreciated.

Thanks,
Kavitha

<telerik:radgrid id="RadGrid1" width="100%" allowfilteringbycolumn="true" showstatusbar="true"

allowsorting="True" allowpaging="True" pagesize="100" runat="server" autogeneratecolumns="False"

enablelinqexpressions="false" onitemcommand="RadGrid1_ItemCommand" onneeddatasource="RadGrid1_NeedDataSource"

allowmultirowselection="true" OnPreRender="RadGrid1_PreRender" OnItemDataBound="RadGrid1_ItemDataBound">

<PagerStyle Mode="NextPrevAndNumeric" Position="Top" AlwaysVisible="true" />

<mastertableview datakeynames="WorkOrderID" clientdatakeynames="WorkOrderID">

<CommandItemSettings ShowAddNewRecordButton="false" />

<Columns>

<telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" HeaderStyle-Width="50px">

</telerik:GridClientSelectColumn>

<telerik:GridBoundColumn UniqueName="WorkOrderID" DataField="WorkOrderID" HeaderText="Work Order ID">

<FilterTemplate>

Clear filters

<asp:ImageButton ID="btnShowAll" runat="server" ImageUrl="~/Img/filterCancel.gif"

AlternateText="Show All" ToolTip="Show All" OnClick="btnShowAll_Click" Style="vertical-align: middle" />

</FilterTemplate>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="DateAdded" DataField="DateAdded" HeaderText="Date Added"

DataFormatString="{0:d}" HeaderStyle-Width="90px">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboDateAdded" DataTextField="DateAdded" DataValueField="DateAdded"

Height="200px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("DateAdded").CurrentFilterValue %>'

runat="server" OnClientSelectedIndexChanged="DateAddedIndexChanged" OnLoad="RadComboBoxDateAdded_OnLoad">

<Items>

<telerik:RadComboBoxItem Text="All" Selected="true" />

</Items>

</telerik:RadComboBox>

<telerik:RadScriptBlock ID="RadScriptBlock5" runat="server">

<script type="text/javascript">

function DateAddedIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("DateAdded", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="DateUpdated" DataField="DateUpdated" HeaderText="Updated Date"

DataFormatString="{0:d}" HeaderStyle-Width="90px">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboDateUpdated" DataTextField="DateUpdated" DataValueField="DateUpdated"

Height="200px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("DateUpdated").CurrentFilterValue %>'

runat="server" OnClientSelectedIndexChanged="DateUpdatedIndexChanged" OnLoad="RadComboBoxDateUpdated_OnLoad" OnItemDataBound="RadComboDateUpdated_ItemDataBound">

<Items>

<telerik:RadComboBoxItem Text="All" Selected="true" />

</Items>

</telerik:RadComboBox>

<telerik:RadScriptBlock ID="RadScriptBlock6" runat="server">

<script type="text/javascript">

function DateUpdatedIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("DateUpdated", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Status" DataField="Status" HeaderText="Status"

HeaderStyle-Width="200px">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboBoxStatus" DataTextField="Status" DataValueField="Status"

Height="200px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Status").CurrentFilterValue %>'

runat="server" OnClientSelectedIndexChanged="StatusIndexChanged" OnLoad="RadComboBoxStatus_OnLoad" OnItemDataBound="RadComboStatus_ItemDataBound">

<Items>

<telerik:RadComboBoxItem Text="All" Selected="true" />

</Items>

</telerik:RadComboBox>

<telerik:RadScriptBlock ID="RadScriptBlock2" runat="server">

<script type="text/javascript">

function StatusIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("Status", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Category" DataField="Category" HeaderText="Category"

HeaderStyle-Width="200px">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboBoxCategory" DataTextField="Category" DataValueField="Category"

Height="200px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("Category").CurrentFilterValue %>'

runat="server" OnClientSelectedIndexChanged="CategoryIndexChanged" OnLoad="RadComboBoxCategory_Onload" OnItemDataBound="RadComboCategory_ItemDataBound">

<Items>

<telerik:RadComboBoxItem Text="All" />

</Items>

</telerik:RadComboBox>

<telerik:RadScriptBlock ID="RadScriptBlock3" runat="server">

<script type="text/javascript">

function CategoryIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("Category", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="Addr1" DataField="Addr1" HeaderText="Street Address"

HeaderStyle-Width="100px" AllowFiltering="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="City" DataField="City" HeaderText="City"

HeaderStyle-Width="100px" AllowFiltering="false">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn UniqueName="State" DataField="State" HeaderText="State"

HeaderStyle-Width="100px">

<FilterTemplate>

<telerik:RadComboBox ID="RadComboBoxState" DataTextField="State" DataValueField="State"

Height="200px" AppendDataBoundItems="true" SelectedValue='<%# ((GridItem)Container).OwnerTableView.GetColumn("State").CurrentFilterValue %>'

runat="server" OnClientSelectedIndexChanged="StateIndexChanged" OnLoad="RadComboBoxState_OnLoad" Width="50px" OnItemDataBound="RadComboState_ItemDataBound">

<Items>

<telerik:RadComboBoxItem Text="All" />

</Items>

</telerik:RadComboBox>

<telerik:RadScriptBlock ID="RadScriptBlock9" runat="server">

<script type="text/javascript">

function StateIndexChanged(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

tableView.filter("State", args.get_item().get_value(), "EqualTo");

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

</Columns>

</mastertableview>

<clientsettings enablerowhoverstyle="true">

<Selecting AllowRowSelect="True" />

<ClientEvents OnRowSelected="RadGrid1_RowSelected" OnRowDeselected="RadGrid1_RowDeselected" OnGridCreated="GridCreated" />

</clientsettings>

</telerik:radgrid>

3 Answers, 1 is accepted

answered on 02 May 2011, 04:29 PM

None of the options provided here work for me. I cannot use Custom Paging as i am on Sql 2000 and i cannot use the row_number function on my proc. Also i am using Filtering and sorting.

For each of the options provided in the article please see my response below.

1. I am not using any client side features, i am using paging,sorting and filtering and i need that for my project.
2. I need some of the row related features, like row selection as i am displaying the number of rows selected on top of the table
3. As i said i am not able to use Custom Paging as i am using a proc in Sql 2000
4. Not using a hierarchical grid
5. Not using RadMultipage
6. Tried doing EnabbleViewState=false but that is not helping either

From my observation the slowness seems to be caused because of having to bind each of the filter dropdowns(i have 5 and i go to the database to retrieve values to show in the dropdown) each time the grid Databind is called. And this happens for each of the paging operations. But the number of rows returned is usually below 100.

Each of the paging and sorting operations are taking about 6 to 7 seconds

Is there anything else I can do to improve the performance? I kind of need this urgently as it is going to be released in a week's time.

Thanks,
Kavitha

answered on 02 May 2011, 04:53 PM

Hello Kavitha,

To speed up the performance, you may consider implementing load on demand for the RadComboBox control. Refer to the online example below for more information:
http://demos.telerik.com/aspnet-ajax/combobox/examples/populatingwithdata/autocompletesql/defaultcs.aspx

Additional hints about how to speed up the performance of your application can be found here:
http://www.telerik.com/products/aspnet-ajax/resources/top-performance.aspx
http://www.telerik.com/support/aspnet-ajax/grid.aspx (Section "Performance")

Kind regards,
Pavlina
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.