RadGridVIew with 50 columns and 40 rows performance

2 posts, 0 answers
  1. B
    B avatar
    74 posts
    Member since:
    Jul 2011

    Posted 04 Aug 2014 Link to this post

    Hi,

    When I create a simple RadGridView (*) with 50 columns and 40 rows that are visible on the screen at the same time this becomes slow. Both the initial filling of the grid and scrolling through them is slow.

    Is there some option I missed?

    When I profile it almost all of the time is spent in Windows dll's:

    Functions Doing Most Individual Work
    Name Exclusive Samples %
    [PresentationCore.ni.dll] 75,78

    Functions Doing Most Individual Work
    Name Exclusive Samples %
    [PresentationFramework.ni.dll] 10,20


    The system I ran the performance test on: Intel Core i7-3632QM 2.2Ghz, 8G memory.

    (*)only text columns, no converters, no sorting, no filtering

    Regards,

    Bayram

    using System.Windows;
    using System.Collections.Generic;
    using System;
    using System.Collections.ObjectModel;
     
    namespace TelerikTest
    {
        /// <summary>
        /// Interaction logic for MainWindow.xaml
        /// </summary>
        public partial class MainWindow : Window
        {
            public MainWindow()
            {
                InitializeComponent();
                DataContext = this;
            }
     
            public ObservableCollection<PowerField> Fields
            {
                get { return (ObservableCollection<PowerField>)GetValue(FieldsProperty); }
                set { SetValue(FieldsProperty, value); }
            }
     
            public static readonly DependencyProperty FieldsProperty =
                DependencyProperty.Register("Fields", typeof(ObservableCollection<PowerField>),
                typeof(MainWindow), new PropertyMetadata(null));
     
            private void FillFields(string prefix)
            {
                List<PowerField> fields = new List<PowerField>();
                for (int i = 0; i < 100; i++)
                {
                    fields.Add(new PowerField()
                    {
                        Col1 = prefix + "Col 1, Row " + i,
                        Col2 = prefix + "Col2, Row " + i,
                        Col3 = prefix + "Col3, Row " + i,
                        Col4 = prefix + "Col4, Row " + i,
                        Col5 = prefix + "Col5, Row " + i,
                        Col6 = prefix + "Col6, Row " + i,
                        Col7 = prefix + "Col7, Row " + i,
                        Col8 = prefix + "Col8, Row " + i,
                        Col9 = prefix + "Col9, Row " + i,
                        Col10 = prefix + "Col10, Row " + i,
                        Col11 = prefix + "Col11, Row " + i,
                        Col12 = prefix + "Col12, Row " + i,
                        Col13 = prefix + "Col13, Row " + i,
                        Col14 = prefix + "Col14, Row " + i,
                        Col15 = prefix + "Col15, Row " + i,
                        Col16 = prefix + "Col16, Row " + i,
                        Col17 = prefix + "Col17, Row " + i,
                        Col18 = prefix + "Col18, Row " + i,
                        Col19 = prefix + "Col19, Row " + i,
                        Col20 = prefix + "Col20, Row " + i,
                        Col21 = prefix + "Col21, Row " + i,
                        Col22 = prefix + "Col22, Row " + i,
                        Col23 = prefix + "Col23, Row " + i,
                        Col24 = prefix + "Col24, Row " + i,
                        Col25 = prefix + "Col25, Row " + i,
                        Col26 = prefix + "Col26, Row " + i,
                        Col27 = prefix + "Col27, Row " + i,
                        Col28 = prefix + "Col28, Row " + i,
                        Col29 = prefix + "Col29, Row " + i,
                        Col30 = prefix + "Col30, Row " + i,
                        Col31 = prefix + "Col31, Row " + i,
                        Col32 = prefix + "Col32, Row " + i,
                        Col33 = prefix + "Col33, Row " + i,
                        Col34 = prefix + "Col34, Row " + i,
                        Col35 = prefix + "Col35, Row " + i,
                        Col36 = prefix + "Col36, Row " + i,
                        Col37 = prefix + "Col37, Row " + i,
                        Col38 = prefix + "Col38, Row " + i,
                        Col39 = prefix + "Col39, Row " + i,
                        Col40 = prefix + "Col40, Row " + i,
                        Col41 = prefix + "Col41, Row " + i,
                        Col42 = prefix + "Col42, Row " + i,
                        Col43 = prefix + "Col43, Row " + i,
                        Col44 = prefix + "Col44, Row " + i,
                        Col45 = prefix + "Col45, Row " + i,
                        Col46 = prefix + "Col46, Row " + i,
                        Col47 = prefix + "Col47, Row " + i,
                        Col48 = prefix + "Col48, Row " + i,
                        Col49 = prefix + "Col49, Row " + i,
                        Col50 = prefix + "Col50, Row " + i,
                    });
                }
                Fields = new ObservableCollection<PowerField>(fields);
            }
     
            private void Click(object sender, RoutedEventArgs e)
            {
                string prefix = DateTime.Now.ToString("ss") + " ";
                FillFields(prefix);
            }
        }
     
     
        public class PowerField
        {
            public string Col1 { get; set; }
            public string Col2 { get; set; }
            public string Col3 { get; set; }
            public string Col4 { get; set; }
            public string Col5 { get; set; }
            public string Col6 { get; set; }
            public string Col7 { get; set; }
            public string Col8 { get; set; }
            public string Col9 { get; set; }
            public string Col10 { get; set; }
            public string Col11 { get; set; }
            public string Col12 { get; set; }
            public string Col13 { get; set; }
            public string Col14 { get; set; }
            public string Col15 { get; set; }
            public string Col16 { get; set; }
            public string Col17 { get; set; }
            public string Col18 { get; set; }
            public string Col19 { get; set; }
            public string Col20 { get; set; }
            public string Col21 { get; set; }
            public string Col22 { get; set; }
            public string Col23 { get; set; }
            public string Col24 { get; set; }
            public string Col25 { get; set; }
            public string Col26 { get; set; }
            public string Col27 { get; set; }
            public string Col28 { get; set; }
            public string Col29 { get; set; }
            public string Col30 { get; set; }
            public string Col31 { get; set; }
            public string Col32 { get; set; }
            public string Col33 { get; set; }
            public string Col34 { get; set; }
            public string Col35 { get; set; }
            public string Col36 { get; set; }
            public string Col37 { get; set; }
            public string Col38 { get; set; }
            public string Col39 { get; set; }
            public string Col40 { get; set; }
            public string Col41 { get; set; }
            public string Col42 { get; set; }
            public string Col43 { get; set; }
            public string Col44 { get; set; }
            public string Col45 { get; set; }
            public string Col46 { get; set; }
            public string Col47 { get; set; }
            public string Col48 { get; set; }
            public string Col49 { get; set; }
            public string Col50 { get; set; }
        }
    }
    <Window x:Class="TelerikTest.MainWindow"
            xmlns:pc="clr-namespace:TelerikTest"
            WindowState="Maximized"
            Title="MainWindow">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <telerik:RadButton Click="Click" Content="Fill Fields"/>
            <telerik:RadGridView x:Name="MainGrid"
                                 Grid.Row="1"
                                 ItemsSource="{Binding Fields}"
                                 IsFilteringAllowed="False"
                                 CanUserSortColumns="False"
                                 CanUserFreezeColumns="False"
                                 RowIndicatorVisibility="Collapsed"
                                 ShowGroupPanel="False"
                                 AutoGenerateColumns="False"
                                 EnableColumnVirtualization="True"
                                 EnableRowVirtualization="True">
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col1}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col2}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col3}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col4}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col5}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col6}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col7}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col8}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col9}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col10}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col11}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col12}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col13}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col14}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col15}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col16}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col17}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col18}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col19}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col20}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col21}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col22}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col23}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col24}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col25}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col26}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col27}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col28}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col29}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col30}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col31}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col32}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col33}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col34}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col35}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col36}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col37}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col38}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col39}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col40}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col41}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col42}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col43}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col44}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col45}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col46}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col47}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col48}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col49}" />
                    <telerik:GridViewDataColumn Width="30" DataMemberBinding="{Binding Col50}" />
                </telerik:RadGridView.Columns>
            </telerik:RadGridView>
        </Grid>
    </Window>
  2. Dimitrina
    Admin
    Dimitrina avatar
    3769 posts

    Posted 04 Aug 2014 Link to this post

    Hello Bayram,

    RadGridView is a virtualized control and its elements are reused as they go in and out the view area. This increases the loading performance, however, the more the visual elements into view are, the slower the loading will be. You can check our online documentation explaining how the UI virtualization works. Looking at your definition, you have configured the GridView fine.

    Generally, in order to improve the performance, I can suggest you going through our online documentation on possible reasons why there would be degraded performance with it.

    I can also suggest you consider using Lightweight Templates for improving such performance problems.

    Another optimization would be to disable the Touch Support. You can refer to the bottom of the Touch Support article. Basically you should set it to false in code behind:
    TouchManager.IsTouchEnabled = false;

    With Q2 2014 SP release of UI for WPF we added the option to turn off the generating of the automation peers through the new global AutomationMode property of the AutomationManager. You can check the UI Automation Support article on how to set the AutomationMode property to Disabled.

    I hope those tips help.

    Regards,
    Didie
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
Back to Top