Are there reasons for the cell virtualization to not work by default

Posted by: dginev on 18 July 2019, 4:20 pm EST

  • Posted 18 July 2019, 4:20 pm EST

    Hello there,

    I am trying to evaluate wijmo grid for a project at my company, and everything seemed to work wonderfully in my POC until I actually started using the grid inside of our application. When using it in the application with around 800 rows and 10 columns, it is taking up to 40 seconds for the grid to load and the page to become responsive. I tried replicating the issue outside of our application, but I could not. What I noticed when trying to replicate the issue outside of our application was that the grid and the page load very fast but, when I scroll fast in my test example, the rows take a few milliseconds to catch up to the position where I am. In our actual application the grid takes really long to load, but once it loads, scrolling is very smooth. This tells me that in my test demo app the not all rows are rendered until they are visible and in our actual app that is not happening. So my question is what could it be that will disable the virtualization of the cells?

  • Posted 19 July 2019, 5:13 am EST

    Hi Dimitar,

    The virtualization of cells is always enabled by default. But it can be disabled using the virtualizationThreshold property of FlexGrid so please ensure that it is not set to a large value.

    In the actual application, there may be other reasons that may be causing the grid to take a long time to render like using itemFormatter. You may improve the loading time of the grid by setting its height and width to a smaller number. The itemFormatter runs only for visible cells and setting the height and width to a small value will make less number of cells visible and thus improving the load time.

    Regards,

    Ashwin

  • Posted 19 July 2019, 2:35 pm EST

    Hi Ashwin,

    Thanks for the reply. I did figure it out after banging my head against the wall half a day. Setting the height was one of the first things I tried, but the problem was that I was setting the grid height in the style attribute of the flex grid like so:```

    .wj-flexgrid { max-height: 1000px}
    
    and that little nugget solved all my problems :)
  • Posted 21 July 2019, 11:32 pm EST

    Hi Dimitar,

    We are glad that you were able to solve the issue. Please let us know in case you have any other query.

    Regards,

    Ashwin

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels