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

Grid Hover Performance very slow in Firefox

1 Answer 35 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Devon
Top achievements
Rank 1
Devon asked on 14 Jun 2012, 01:29 PM
I have a RadGrid on my page that has <ClientSettings EnableRowHoverStyle="true" /> set. In Firefox, when you mouseover a row, the performance is incredibly slow. Swiping the mouse down a list of 10 items fairly slowly will only show the animation on 2-3 of them because it takes so long to change from the normal style to the hovered style. The CPU usage on my machine spikes greatly when i hover over a row. In IE9 and Chrome this doesn't happen, the transition from unhovered -> hovered is instantaneous, scrolling down the list will show each of them hovered at the correct time.

Is there something in the CSS that Firefox doesn't like, that we can change to increase this performance? Or is this a known issue with the Grid? This slowdown makes our app very annoying to use in Firefox.
We're using the Vista theme with no custom CSS set for the theme or for the grid. See the attached pictures:
1- CPU usage of Firefox with no row hovered (0%).
2- CPU usage of Firefox with a row hovered (~25%)
3- CPU Usage of IE with a row hovered (~6%)

Below is the code for the grid. It's bound OnPreRender in the codebehind.
<tel:RadGrid ID="rgSearchResults" runat="server" AllowPaging="True" AllowSorting="True" CellSpacing="0"
            GridLines="None" OnItemCommand="rgSearchResults_ItemCommand" OnItemDataBound="rgSearchResults_ItemDataBound"
            AutoGenerateColumns="False">
            <ClientSettings EnableRowHoverStyle="true" Selecting-AllowRowSelect="false" EnablePostBackOnRowClick="true" />
            <MasterTableView DataKeyNames="ID" AllowMultiColumnSorting="true">
                <SortExpressions>
                    <tel:GridSortExpression FieldName="Name" SortOrder="Ascending" />
                    <tel:GridSortExpression FieldName="SubBasin" SortOrder="Ascending" />
                    <tel:GridSortExpression FieldName="SubSubBasin" SortOrder="Ascending" />
                </SortExpressions>
                <Columns>
                    <tel:GridButtonColumn HeaderText="View" UniqueName="View" ButtonType="ImageButton" ImageUrl="~/Content/Images/edit.png"
                        Text="View" CommandName="View" />
                    <tel:GridButtonColumn HeaderText="Select" UniqueName="SelectTroutParentWater" ButtonType="ImageButton"
                        ImageUrl="~/Content/Images/edit.png" Text="Select" CommandName="SelectTroutParentWater" Visible="false" />
                    <tel:GridTemplateColumn HeaderText="Select" UniqueName="Select" Visible="false">
                        <ItemTemplate>
                            <asp:CheckBox runat="server" ID="rgcbSelect" OnCheckedChanged="rgcbSelect_CheckChanged" />
                        </ItemTemplate>
                    </tel:GridTemplateColumn>
                    <tel:GridBoundColumn DataField="ID" UniqueName="ID" Display="False" />
                    <tel:GridBoundColumn DataField="Name" HeaderText="Water Name" />
                    <tel:GridBoundColumn DataField="Latitude" HeaderText="Latitude" />
                    <tel:GridBoundColumn DataField="Longitude" HeaderText="Longitude" />
                    <tel:GridBoundColumn DataField="SubBasin" HeaderText="Sub Basin" />
                    <tel:GridBoundColumn DataField="SubSubBasin" HeaderText="Sub Sub Basin" />
                    <tel:GridBoundColumn DataField="ReceivingWater" HeaderText="Receiving Water" />
                    <tel:GridBoundColumn DataField="RiverMile" HeaderText="River Mile of Entry" />
                    <tel:GridBoundColumn DataField="CountyName" HeaderText="County" />
                    <tel:GridBoundColumn DataField="WaterType" HeaderText="Water Type" />
                    <tel:GridBoundColumn DataField="TagName" HeaderText="Tags" />
                </Columns>
            </MasterTableView>
        </tel:RadGrid>


What can I change to keep this functionality but improve performance?

1 Answer, 1 is accepted

Sort by
0
Martin
Telerik team
answered on 19 Jun 2012, 07:30 AM
Hello Devon,

Based on your code I have tried to reproduce the issue locally, but without success. Here is a short video showing the behavior I observed. Please review it and let me know whether I miss something.

All the best,
Martin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Devon
Top achievements
Rank 1
Answers by
Martin
Telerik team
Share this question
or