Grid virtualization strange behavior

Hi,

I'm trying to display dynamically updated list of orders inside the SfGrid. The several clients are submitting orders to the server using SignalR, then server re-send's those orders to summary page (also using SignalR). The summary is Blazor WASM app with single view SfGrid which displays orders from all clients in one table. I'm using ObservableCollection as a data source. The application never removes orders from the grid, only adds. 

The problem is: 
- without virtualization, the Grid starts lagging after the first 100 order submitted in approximately 1 minute, ok this outcome is somewhat expected;
- with virtualization but without 'PageSize', the grid working but scroll keep's jumping back to the first row until 'all' orders added, which obviously is not acceptable for me because client's keep adding orders;
- with virtualization and 'PageSize' set to 100 (x2 number of rows), well, I never saw any row after first 100, just blank space.

I've checked the documentation, but didn't find a way to get right behavior. I've also tried 'native' virtualization, just to check if this is problem with Blazor. And the 'native one' works as expected, adding rows to the off-screen section does not affect on-screen section of table at all.

Could you please help me with configuring Grid in a way that will allow me add rows in runtime?

Regards,
Ivan

5 Replies 1 reply marked as answer

JP Jeevakanth Palaniappan Syncfusion Team April 5, 2021 02:03 PM UTC

Hi Ivan, 
 
Greetings from Syncfusion support. 
 
Query 1 : with virtualization but without 'PageSize' 
 
We are currently validating the reported problem from our end and so we will update the details in two business days. Until then we appreciate your patience. 
 
Query 2: with virtualization and 'PageSize' set to 100 (x2 number of rows), well, I never saw any row after first 100, just blank space. 
 
We have checked the reported problem by specifying PageSettings and then scrolled to the end of the grid. Then added a new record by using a button click. Here the grid is scrolled to the top of the grid and there is no white space. Since the reproduced scenario is different from the reported one, we suggest you to share us the below details. 
 
 
  1. Share us the Syncfusion NuGet version details.
  2. Share us the complete code.
  3. If possible kindly share us the issue reproducing sample or reproduce the issue in the above provided sample.
 
I've also tried 'native' virtualization, just to check if this is problem with Blazor. And the 'native one' works as expected, adding rows to the off-screen section does not affect on-screen section of table at all. 
 
We also suggest you to share us this sample so that it will be helpful for us to validate the reported problem and provide you with a better solution as early as possible. 
 
Regards, 
Jeevakanth SP. 


Marked as answer

IC Ivan Cherkasov April 6, 2021 11:04 AM UTC

Hi, Jeevakanth!

I've added sample project, just summary and server. The server will start broadcasting mock orders automatically. The 'native' version is available on the "localhost:<port>/native".

I'm using version "
18.4.0.49" but the latest version behaves same for me. 

Thanks
Regards

Attachment: WebGridSample_4892cfff.zip


JP Jeevakanth Palaniappan Syncfusion Team April 12, 2021 04:40 AM UTC

Hi Ivan, 

Query 1 : with virtualization but without 'PageSize'  
 
We have validated your query and considered it as a bug and logged the defect report “In Virtualized grid, Scroll position not maintained while performing CRUD action by using observable collection”. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our upcoming patch release which is expected to be rolled out on or before mid of May, 2021. 
 
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.       
 
 
Query 2: with virtualization and 'PageSize' set to 100 (x2 number of rows), well, I never saw any row after first 100, just blank space.  
 
We have checked this problem by setting PageSize as 30, height as 500 and then enabled virtualization in your sample. With this we didn’t see whitespace but after loading certain data, the next set of data is not loading sometimes. Do we have to change anything in your sample?. Also kindly provide us a video demo to reproduce the whitespace in the grid. It will be helpful for us to validate it further. 

Regards,  
Jeevakanth SP. 



IC Ivan Cherkasov April 14, 2021 07:26 AM UTC

Hi, Jeevakanth

I have reviewed my code and found that 'PageSize' is working only with fixed grid size or when placing grid inside fixed-size container and height is set to some percentage.  Now I understand how to make grid working with virtualization enabled. 
Although, I'm now sure that virtualization is actually working. The grid is "locking" on 100+ rows, and page not responding sometimes for about 30 seconds, enough to miss 'KeepAlive' window of SignalR connection. 

Steps to reproduce:
1. Download new sample
2. Start debugging in VS
3. When app page opens, duplicate tab and navigate to <url>/summary
4. On the first tab you will have 3 buttons: 'Start' - starts placing orders automatically, 'Stop' - stop placing orders, 'Place Order' - to place manually.
5. On the second tab SfGrid with orders.
6. Press 'Start' on first tab, wait for ~40 sec, and press 'Stop'.
7. Check grid in the second tab, try scrolling or sorting. You can also check browser console, I'm logging order.id for each order received from server.

Any advice how to fix performance?

About video, I'll ask my manager for permission.

Thank you



Attachment: WebGridSample_c70e8813.zip


JP Jeevakanth Palaniappan Syncfusion Team April 16, 2021 02:02 PM UTC

Hi Ivan, 

We have checked the reported problem and we have considered it as a bug and logged the defect report “Improve performance of ObservableCollection bounded Grid while adding the records” for the same. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our weekly release which is expected to be rolled out by mid of May 2021. We will update you once the release is rolled out.     
        
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.        
 
  
Till then we appreciate your patience.    

Regards, 
Jeevakanth SP. 


Loader.
Up arrow icon