What are some ASP.NET GridView performance improvement opportunities? - asp.net

I have an ASP.NET application that is fairly basic. It queries some data and displays the data in a GridView (0 - 2000 or so records possible). I've been trying to find some ways to make it zippier, best practices, etc. as it seems to be a little sluggish while the GridView is being rendered. I've seen some threads on utilizing CSS vs. setting all the styles directly on the GridView, but I'm not sure how this would look.
This is what the GridView looks like right now...
<asp:GridView ID="gvResults" runat="server" DataKeyNames="ORDNO" AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333" OnSelectedIndexChanged="gvResults_SelectedIndexChanged"
Width="100%" OnRowDataBound="gvResults_RowDataBound" meta:resourcekey="gvResultsResource1">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<Columns>
<asp:BoundField DataField="CSTNO" HeaderText="CUST" meta:resourcekey="BoundFieldResource1" />
<asp:BoundField DataField="ORDNO" HeaderText="RMA NUMBER" meta:resourcekey="BoundFieldResource2" />
<asp:BoundField DataField="CSTORD" HeaderText="CUST PO NUMBER" meta:resourcekey="BoundFieldResource3" />
<asp:BoundField DataField="ORDDTE" HeaderText="ORDER DATE" meta:resourcekey="BoundFieldResource4" />
<asp:BoundField DataField="INVDTE" HeaderText="INVOICE DATE" HtmlEncode="False" meta:resourcekey="BoundFieldResource5" />
<asp:CommandField ShowSelectButton="true" ButtonType="Link" meta:resourcekey="CommandFieldResource1" />
</Columns>
<EditRowStyle BackColor="#999999" />
<EmptyDataTemplate>
<span style="color: Red;">
<asp:Literal ID="litErrorNoRMAFound" runat="server" EnableViewState="False" meta:resourcekey="litErrorNoRMATagsFoundResource1"
OnInit="litErrorNoRMAFound_Init"></asp:Literal>
</span>
</EmptyDataTemplate>
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#3494CC" Font-Bold="True" ForeColor="White" HorizontalAlign="Left" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
</asp:GridView>
Thanks in advance, for any of your ideas/comments.
EDIT
Requirements do not allow for paging of the data. I am also looking for specific information on CSS utilization and the GridView...

A few ideas:
Eliminate viewstate if possible.
If you're using IIS6 or better, consider enabling compression.
Enable paging on your GridView to keep request times down.
Make sure your deployed production solution is release-compiled with no rogue debugging or tracing directives

Don't use the GridView. If you want control, use the Repeater.

If you're not using paging (as mentioned in a comment), consider going to a DataList or even a Repeater to reduce the overhead of the object itself.

Enable paging will work ;)

Is viewstate enabled? That could be a lot of hidden data.

You could try using server-side viewstates. It puts a bit more load on the server, but page loading / updating should be much faster.

Using CSS should reduce the size of the markup.
http://www.jigar.net/howdoi/viewhtmlcontent197.aspx shows how to style the gridview with CSS.
You can replace the entire way the grid renders with the CSS Control Adapters, which should help reduce the markup size further.

You'll want to enable paging in order to avoid a situation where you are rendering hundreds of records to the page. In essence, you'll use the Page Controls in order to move through records rather than the scroll bar.
A related option that can help a lot is to use an ObjectDataSource that retrieves only those records that the grid wants to display. This uses the new ROW_NUMBER() construct in SQL Server. Here is an example of an ObjectDataSource method that retrieves a specific range of records. It uses my DAL but you should be able to get a pretty clear idea:
[DataObjectMethodAttribute(DataObjectMethodType.Select, true)]
public List<SelectClassData> GetList(string sortType, int startRowIndex, int maximumRows)
{
if (!BusinessUtilities.SQLSafe(sortType))
throw new Exception("Illegal value in request (unsafe).");
startRowIndex++;
int EndRow = startRowIndex + maximumRows;
using (BSDIQuery qry = new BSDIQuery())
{
if (sortType.Length == 0)
sortType = "Title";
return
qry.Command(
"With OrderedClassEvent as (Select ClassID, Title, StartDate, EndDate, ROW_NUMBER() OVER (ORDER BY " + sortType + ") as RowNum From ClassEvent)")
.Append(" Select ClassID, Title, StartDate, EndDate From OrderedClassEvent Where RowNum Between #StartRow AND ").ParamVal(startRowIndex)
.Append("#EndRow ").ParamVal(EndRow)
.Append("Order By RowNum")
.ReturnList<SelectClassData>();
}
}
With respect to using CSS, etc. that will not make the grid zippier but it will permit you to define the Grid attributes (e.g. FooterStyle, HeaderStyle, etc.) in a "Skin" file that you'll tuck away in an theme directory. It is optional but you could also define the styles for each attribute using CSS. The skin file will show a "template" GridView with the CssClass for each attribute. When you refer create your grid, you'll refer to the Skin file and then just leave out all of the attribute definitions found in that file (the gridview won't need them because it knows what to do based on the skin). This is especially great if you want to have all of your grids look the same.

You answered it yourself - zip it to make it zippier. Use a compression http handler.

You could output the first X items, then when the page has loaded fetch the next X items and so forth. This would probably make the page seem snappier for the end user.
You should also investigate what exacly makes the page slow, also check if the database query could be optimized using indexes or something.

As pagination is not allowed, I definitely explore to reduce total payload of this grid:
Using repeater control and build native TABLE to render this grid instead of datagrid control - this way I will have complete control over payload. Something like:
Using 100% CSS style instead of controls attributes.
Disabling the viewstate (?)
Note that performance issue is less relating to asp.net here and more to the amount of data transfer from server to client machine.

Disable viewstate if it is possible.
Use Repeater instead of grid and use
your own html, that would decrease
the rendered mark up
Try to use stored procedure
If you have any methods which getting
some data from other tables in your
db. Try to use view

Related

How to make GridView ASP.NET control look like SharePoint List?

Ive been developing a SharePoint WebPart. In this webpart there is a gridview used to display some information.
Due to business im required to give this gridview the look of a SharePoint list.
Is there anyone out there that has the styling to make the GridView ASP.Net control look like a SharePoint list?
For Sharepoint server control SPGridView all css classes are already included here you can find how to use it.
For ASP.NET GridView control you can try the example below
<asp:GridView runat="server" CssClass="ms-listviewtable">
<HeaderRow CssClass="ms-viewheadertr ms-vhltr"/>
<HeaderStyle CssClass="ms-vh2" />
<RowStyle BackColor="ms-itmhover" />
<AlternatingRowStyle CssClass="ms-alternating ms-itmhover" />
<ControlStyle CssClass="ms-vb-title"/>
</asp:GridView>

How to fetch value from datagrid to another form in asp.net

I have a Datagrid on one page, when user clicks on cell of datagrid, it should open another form with labels and textboxes and it should fill it with relevant data fetching from the SQL Database.
I have searched and found out
response.querystring["string"]
But due to its visibility cant use it.
I am pretty new with coding in asp, done some on WINFORM using C#, so I was trying to do through creating an object but it didn't work, so what is the correct way of doing it?
Thanks
I didnt' work with data grid but if it's anythign like gridview then you have an option to use template fields and customize the links for these.
Here is an example template field from grid view that can be customized to suite your needs
<asp:TemplateField HeaderText="Customer Status" SortExpression="IsCustomer">
<ItemStyle HorizontalAlign="Center" />
<ItemTemplate>
<a href='yournewpage.aspx?param=<%# Eval("Column_name")) %>' alt="" />
</ItemTemplate>
</asp:TemplateField>

Modify Gridview as it's being rendered through javascript

I'm trying to modify a field in each row of my gridview as it is rendered. I need to modify it with client side Javascript. I'm somewhat new to asp.net, but I think I should be doing something with clientscriptmanager.
I came up with a simple scenario which is basically what I want to do to avoid getting bogged down in the details. If I could accomplish the following I could accomplish my goal.
Say I have a grid view of names and salaries. I want to double each persons salary before displaying it. Obviously I can do it in the code behind, but due to the nature of the more complex actual thing I'm doing, I need to do it in javascript
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false"
onrowdatabound="GridView1_RowDataBound" >
<Columns>
<asp:BoundField HeaderText="Full Name" DataField="Name" ></asp:BoundField>
<asp:BoundField HeaderText="Salary" DataField="Salary" />
</Columns>
Its for sure that this won't be a good approach. If javascript is disabled in your browser then you won't get the actual data, which won't be desirable.
Anyways something like this will do it. Using jQuery
$("#GridView1 tr td:nth-child(2)").each ( function(){
var value = parseInt($(this).text(),10 ) * 2;
$(this).text(value);
});
This probably isn't what you're looking for, but i would use a template field in the case you are citing. Or better yet, modify the data being returned from the datastore to already have the value calculated.
<asp:TemplateField HeaderText="Salary">
<ItemTemplate>
<%#Eval("Salary") * 2 %>
</ItemTemplate>
</asp:TemplateField>
There are a lot of reasons you wouldn't do this with client side scripting. For one, it can be disabled on the browser. Plus, you are relying on the client to perform calculations that would be more efficiently and appropriately run on the server.

asp.net: DetailsView control not interpreting html

I have a asp.net detailsview control on a page. I've noticed that it always displays the raw text from my database field, it doesn't interpret the html in the text -- so it displays < b>mytext< /b> instead of just mytext in bold.
Is there anyway to get the control to interpret the html in the data being returned
Regards
melt
Can you post the code of your control? The basics are you need to set the HtmlEncode property to false. This is due to a difference in how labels and textboxes handle encoding, something meant to protect you from malicious scripts someone may have entered in these fields.
If you have it set to auto-generate fields (default), you'll need to change to BoundFields or TemplateFields instead and set the offending field's HtmlEncode Property to false.
You can see a code sample of the individual fields in MSDN, here's a simplified example:
<asp:DetailsView runat="server" AutoGenerateRows="False">
<Fields>
<asp:BoundField DataField="ProductName" HeaderText="Product" />
<asp:BoundField DataField="CategoryName" HeaderText="Category" />
<asp:BoundField DataField="HTMLField" HeaderText="HTML" HtmlEncode="false" />
</Fields>
</asp:DetailsView>

Dynamic Columns and Data Sources with .NET Grid View

I am working on a multi-purpose page and rather than adding multiple grids to the same page we wanted to use a single GridView to the page, and on Page_Init add the needed columns, and set the respective DataSourceID.
So to do this, we have something like the following in the aspx, the codebehind in the Page_Init is very simple adding a few columns then setting the DataSourceID property of the GridView.
ASPX:
<asp:GridView ID="gvDisplay" runat="server" AutoGenerateColumns="false" CellPadding="5"
width="100%" AllowPaging="true" PageSize="200" DataSourceID="wuProcessLogDataSource">
<RowStyle CssClass="RowStyle" />
<AlternatingRowStyle CssClass="AlternatingRowStyle" />
<HeaderStyle CssClass="HeaderStyle" />
</asp:GridView>
<asp:ObjectDataSource id="wuProcessLogDataSource" runat="server" EnablePaging="True"
SelectMethod="GetWUProcessLog" TypeName="Project.Objects.WUProcessLogDal"
SelectCountMethod="GetWUProcessLogTotalRecords">
<SelectParameters>
<asp:QueryStringParameter QueryStringField="w" DefaultValue="0" Name="workunitId" />
</SelectParameters>
</asp:ObjectDataSource>
The object data source is there and working as the first page load triggers without any issues at all. However, as soon as you click on a page button, the grid disappears from the page? Any ideas?
I would just use a DataGrid but it doesn't have the desired dynamic display abilities for the HyperLinkColumn.
It sounds like you're doing something like
If (!Page.IsPostBack)
{
//create + add columns - set datasource etc
}
If that's the case - then you need to remove the check and always generate the columns (I'd also suggest disabling viewstate for the datagrid)
try the page load event instead of page init

Resources