I recently bought Telerik controls. I am getting performance issue with radgrid.
- I implemented paging to the radgrid with 6000 records. And i created viewall option on rg402_ItemCreated to the radcombo. When i select viewall its taking 20 sec to bind the data to the grid and after that the brower gets stuck( both Firefox 3.6.4 and IE7) and displaying the error(Please find attached Image). Is there anyway to change the viewall option code to get the data fast. or is there anyway to improve the performance and decrease the time of records binding.
Here is my code.
.aspx code
style type="text/css">
.rgPageFirst, .rgPagePrev, .rgPageNext, .rgPageLast
{
display: none !important;
}
div.RadGrid_Default .rgHeader, div.RadGrid_Default th.rgResizeCol
{
background-image: none;
}
</style>
<script type="text/javascript">
function onRequestStart(sender, args) {
if (args.get_eventTarget().indexOf("ExportToExcelButton") >= 0 ||
args.get_eventTarget().indexOf("ExportToWordButton") >= 0 ||
args.get_eventTarget().indexOf("ExportToPdfButton") >= 0 ||
args.get_eventTarget().indexOf("ExportToCsvButton") >= 0) {
args.set_enableAjax(false);
}
}
</script>
<div>
<tr>
<td colspan="2">
<asp:Label runat="server" Font-Bold="true" Font-Size="14pt" ID="lblTskName"></asp:Label>
</td>
</tr>
<br />
</div>
<div>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<ClientEvents OnRequestStart="onRequestStart" />
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="rg402">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="rg402" LoadingPanelID="RadAjaxLoadingPanel1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default">
</telerik:RadAjaxLoadingPanel>
<telerik:RadGrid ID="rg402" runat="server" AutoGenerateColumns="false" Height="550px"
OnNeedDataSource="rg402_NeedDataSource" Width="120%" AllowPaging="True" AllowSorting="True"
AllowMultiRowSelection="True" EnableHeaderContextMenu="true" GridLines="None"
EnableHeaderContextFilterMenu="true" AllowMultiRowEdit="true" AllowFilteringByColumn="True"
OnPreRender="rg402_PreRender" OnItemCreated="rg402_ItemCreated" EnableViewState="false">
<HeaderStyle HorizontalAlign="Center" BorderWidth="1px" Font-Bold="true" Font-Size="8pt" />
<ExportSettings IgnorePaging="true" ExportOnlyData="true">
<Pdf AllowModify="false" AllowPrinting="true" PageBottomMargin="" PageFooterMargin=""
PageHeaderMargin="" PageHeight="11in" PageLeftMargin="" PageRightMargin="" PageTopMargin=""
PageWidth="14in" />
</ExportSettings>
<MasterTableView DataKeyNames="orderId" CommandItemDisplay="Top" EditMode="InPlace"
PageSize="30">
<CommandItemSettings ShowExportToWordButton="true" ShowExportToExcelButton="true"
ShowExportToCsvButton="true" ShowExportToPdfButton="true" ShowAddNewRecordButton="false" />
<Columns>
<telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" HeaderStyle-Width="3%"
ItemStyle-Width="3%">
</telerik:GridClientSelectColumn>
<telerik:GridBoundColumn UniqueName="sId" HeaderText="sId" DataField="sId" Visible="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="orderId" HeaderText="orderId" DataField="orderId"
Visible="false">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Customer Name" HeaderText="Customer Name" DataField="Customer Name"
ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Market Name" HeaderText="Market Name" DataField="Market Name"
ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="LOB" HeaderText="LOB" DataField="LOB" ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Headend Name" HeaderText="Headend Name" DataField="Headend Name"
ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Project Name" HeaderText="Project Name" DataField="Project Name"
ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridHyperLinkColumn UniqueName="Site Name" HeaderText="Site Name" DataTextField="Site Name">
</telerik:GridHyperLinkColumn>
<telerik:GridBoundColumn UniqueName="Task Status" HeaderText="Task Status" DataField="Task Status"
ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Plant Test Date" HeaderText="Plant Test Date"
DataField="Plant Test Date" ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="CORE CM Number" HeaderText="CORE CM Number"
DataField="CORE CM Number" ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Req SM Imp Date" HeaderText="Req SM Imp Date"
DataField="Req SM Imp Date" ReadOnly="true">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="SM Ticket Number" HeaderText="SM Ticket Number"
DataField="SM Ticket Number">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Sch SM Imp Date" HeaderText="Sch SM Imp Date"
DataField="Sch SM Imp Date">
</telerik:GridBoundColumn>
<telerik:GridEditCommandColumn UniqueName="ECC402">
</telerik:GridEditCommandColumn>
</Columns>
</MasterTableView>
<ClientSettings EnableRowHoverStyle="true" ReorderColumnsOnClient="false" AllowDragToGroup="false"
AllowColumnsReorder="True">
<Scrolling AllowScroll="true" UseStaticHeaders="true" />
<Selecting AllowRowSelect="True"></Selecting>
<Resizing AllowRowResize="true" AllowColumnResize="True" EnableRealTimeResize="True"
ResizeGridOnColumnResize="False"></Resizing>
</ClientSettings>
<PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
</telerik:RadGrid>
.cs file…
protected void Page_Load(object sender, EventArgs e)
{
try
{
if (!IsPostBack)
{
Session["SearchRes"] = null;
if (Session["TaskName"] != null)
lblTskName.Text = Session["TaskName"].ToString();
Session["FilColms"] = null;
Session["SortExp"] = null;
Session["FilExp"] = null;
Session["ViewAll"] = null;
BindGrid();
}
}
catch (Exception ex)
{
throw ex;
}
}
private void BindGrid()
{
try
{
DataSet dsResult = new DataSet();
clsSearch_BL clsObj = new clsSearch_BL();
clsObj.TaskID = (string)Session["TaskID"];
clsObj.CustName = (string)Session["CustName"];
clsObj.MarketName = (string)Session["MarketName"];
clsObj.HeadendName = (string)Session["HeadendName"];
clsObj.SiteName = (string)Session["SiteName"];
clsObj.TaskStatus = (string)Session["TaskStatus"];
clsObj.OrdType = (string)Session["OrdType"];
clsObj.OrdStatus = (string)Session["OrdStatus"];
clsObj.ProName = (string)Session["ProName"];
clsObj.LOC = (string)Session["LOC"];
clsObj.QuoteID = (string)Session["QuoteID"];
clsObj.CMNumber = (string)Session["CMNumber"];
if (Session["SearchRes"] == null)
{
dsResult = clsObj.getSearchResults_BL(clsObj);
Session["SearchRes"] = dsResult;
}
else
dsResult = (DataSet)Session["SearchRes"];
DataView dataView = dsResult.Tables[0].DefaultView;
rg402.DataSource = dsResult;
//rg402.DataBind();
}
catch (Exception ex)
{
throw ex;
}
}
protected void rg402_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
BindGrid();
}
protected void rg402_PreRender(object sender, EventArgs e)
{
rg402.MasterTableView.GetColumnSafe("RowIndicator").Display = false;
}
protected void rg402_ItemCreated(object sender, GridItemEventArgs e)
{
if (e.Item is GridPagerItem)
{
RadComboBox combo = (e.Item as GridPagerItem).FindControl("PageSizeComboBox") as RadComboBox;
// The number of items shown when all is selected
int allRowsCount = int.MaxValue;
// Remove duplicates
RadComboBoxItem duplicate = combo.Items.FindItemByValue(allRowsCount.ToString());
if (duplicate != null)
{
duplicate.Remove();
}
// Create a new item for showing all
RadComboBoxItem item = new RadComboBoxItem("All", allRowsCount.ToString());
item.Attributes.Add("ownerTableViewId", e.Item.OwnerTableView.ClientID);
combo.Items.Add(item);
// Set the current pagesize as the selected value
combo.Items.FindItemByValue(rg402.PageSize.ToString()).Selected = true;
}
My team did performance tests on RadGrid vs some other highly featured 3rd party controls, and RadGrid was fastest at the time…so you made a good choice in controls.
The browser is your limitation. You’ll have the same problem with any control. It’s bad practice to show more than a useful amount of data on the screen at once.
6000 rows and 16 columns…that’s probably over 9 Megs of HTML your browser has to parse thru just for your datagrid.
Don’t give them a ViewAll option. If they want to search thru the data quickly, you could add search capabilities that filter the results.
If they really want all the data at once, what i do is provide a link near the grid that allows them to download all the grid in the data as an Excel file.