Add virtualization to improve performance with many items

[ferberts]

References issue #39

[stefanloerwald]

Hi @ferberts,

Thanks for contributing! This feels like an obvious improvement for large collections. I wonder whether we should have a parameter for it though, something like EnableVirtualize. What do you think?

Out of curiosity: how large are your collections?

Cheers Stefan

[ferberts]

Hi @stefanloerwald

I also thought about this but it is a bit tricky to built this contional fork into the blazor code. Also question is if there is any known drawback in using virtualize also for small sets of data. The pre-requisite must be that the size of the elements is known/equal. Since ListItem is always the same height this looks okay right now. Here is a good article upon using virtualization: https://www.daveabrock.com/2020/10/20/blazor-component-virtualization/ There are also some more parameters for optimization and on top it, perhaps you check that out too.

I need to organize a permission tree with 5000+ elements. There are only 6 at root level but on expansion the tree grows fast and with this the rendering amount on doing little stuff for checking/unchecking one checkbox for example. I missed this feature in any other blazor component lib (mud, mat, ...). I want to add it to MatBlazor too but here .netStandard2.1 breaks support for virtualize since it requires .net5+

Best regards Thomas

[stefanloerwald]

Hi @ferberts,

I agree that the razor syntax for conditional loop structures isn't the prettiest, but still quite decent (see https://github.com/excubo-ag/Blazor.TreeViews/pull/40/files#diff-023e5f9c7800e9394effc73d3d501af6a8a407cf7f6ab1345326d5a7dfca751fR5-R17). I've made two commits to your PR which would implement the conditional Virtualize. Please have a look at it and see whether that works for you.

Cheers Stefan