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.
What can I change to keep this functionality but improve performance?
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?