We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Is the React Grid a pure React component?

Hi Team,

I am currently evaluating Grid control from various control vendors and found the one provided by SyncFusion to be feature rich and easy to use. 

However, when trying to show/hide columns, I noticed that the grid takes a few seconds to update/re-render on the screen. The tests were done on IE.

I am wondering if there is an issue with performance around column show/hide or if the Grid component is not a strict React component which is re-rendering the entire component on any change.

Regards
Nrupal

5 Replies

TS Thavasianand Sankaranarayanan Syncfusion Team December 12, 2018 07:31 AM UTC

Hi Nrupal, 

Thanks for contacting Syncfusion support. 

Query :  However, when trying to show/hide columns, I noticed that the grid takes a few seconds to update/re-render on the screen. The tests were done on IE. 

We have analyzed your query but we are unable to reproduce the reported issue at our end. If you have tested the component with more number of columns or data, the grid may vary in terms of the performance due to data loading duration. So please find the below sample and video demo for your reference, 



Please provide below information of details to look into this issue further, 

  1. Please share your grid configuration/ full code example?
  2. Please share your Internet Explorer version details?
 
Regards, 
Thavasianand S. 



NP Nrupal Prattipati replied to Thavasianand Sankaranarayanan December 12, 2018 11:56 AM UTC

Hi Nrupal, 

Thanks for contacting Syncfusion support. 

Query :  However, when trying to show/hide columns, I noticed that the grid takes a few seconds to update/re-render on the screen. The tests were done on IE. 

We have analyzed your query but we are unable to reproduce the reported issue at our end. If you have tested the component with more number of columns or data, the grid may vary in terms of the performance due to data loading duration. So please find the below sample and video demo for your reference, 



Please provide below information of details to look into this issue further, 

  1. Please share your grid configuration/ full code example?
  2. Please share your Internet Explorer version details?
 
Regards, 
Thavasianand S. 


Hi Thavasianand,

I have attached the grid configuration we are using.

The grid has 53 columns with around 100 rows of data. we will not be using paging, so all the rows are rendered on load.

Columns are hidden by default and visibility toggled by calling "this.gridInstance.showColumns(columnNames, 'field');" or "this.gridInstance.hideColumns(columnNames, 'field');"

We are also calling this.gridInstance.autoFitColumns(); onDataBound. 

I have done some UI Responsiveness tests in IE 11 on Windows 7. It has been observed that it takes around 45seconds to get the responsiveness back after toggling 3 columns. Most time is used up in setting innerHTML and appendChild.


Details of IE:
IE 11 on Windows 7
Version: 11.0.9600.19180


Regards
Nrupal


Attachment: GridConfig_c7ca52e8.zip


MF Mohammed Farook J Syncfusion Team December 14, 2018 11:53 AM UTC

Hi Nrupal, 

Thanks for contacting Syncfusion support. 

Query: I have done some UI Responsiveness tests in IE 11 on Windows 7. It has been observed that it takes around 45seconds to get the responsiveness back after toggling 3 columns 
 
We have analyzed your query and since you have used 53 columns with 100 rows of data in grid, we suggest to use the enableVirtualization and enableColumnVirtualization  properties of the grid. In the below sample, we have rendered the grid with same configuration and to avoid the delayed when columns are hidden or show dynamically. Because it can be optimized by the virtualization properties. Please refer to the below sample and documentation for your reference. 


                                https://ej2.syncfusion.com/documentation/api/grid/#enablevirtualization  



Regards, 
J Mohammed Farook 
 



NP Nrupal Prattipati January 7, 2019 10:20 AM UTC

Hi Mohammed Farook,

Hope you had a good holiday. Thanks for the sample. 

I can replicate the responsiveness in my solution when I do not use frozenColumns. Having frozenColumns in the grid makes the SyncFusion grid stand out from others we have been evaluating. 

Am I correct in saying frozenColumns and enableColumnVirtualization do not work together. Without virtualization the repsonsiveness takes a nose dive as expected.

Regards
Nrupal






PS Pavithra Subramaniyam Syncfusion Team January 8, 2019 07:06 AM UTC

Hi Nrupal, 

Greetings from Syncfusion. 
 
Query:   Am I correct in saying frozenColumns and enableColumnVirtualization do not work together 
 
Yes, currently we do not have support for frozenRows and frozenColumns in the grid when virtualization is enabled. 
 
Please get back to us for further assistance. 
 
Regards, 
Pavithra S.  


Loader.
Live Chat Icon For mobile
Up arrow icon