Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

I didn't find any where in the readme about sorting & filter feature ? #85

Open
PoojaMgr opened this issue Feb 16, 2022 · 1 comment
Open

Comments

@PoojaMgr
Copy link

Hi @Lodin ,

I am working on the project. So the problem here are -

  1. Rendering of giant data of nodes in tree (approx. 2k-3k)
  2. Have filter & sorting feature
  3. Performance issue of page due to such huge size of data

However, in the doc, I didn't find anywhere how to tackle with sorting & filtering feature. It would be really great, if you can direct me to the doc where these things are mentioned ?

@gregjoeval
Copy link

gregjoeval commented Aug 30, 2022

Could you link an example where you've seen sorting of a tree structure?

For filtering I think you're "gonna have a bad time" if you're trying to show/hide nodes that match certain filters. You could however use the recomputeTree function on the tree ref to expand all nodes matching a specific filter using the subtreeCallback function. If, however, youre experiencing performance issues I would suggest not manipulating the tree all at once with a relatively complicated filter. In this case where performance is an issue I would recommend maintaining an index of the current node matching a filter and providing a button that will scroll the user to the next node matching that filter.

If you're experiencing performance issues due to tree size you might want to consider asynchronously building the tree.

demo: https://lodin.github.io/react-vtree/?path=/story/tree--async-data-with-placeholder
code: https://github.com/Lodin/react-vtree/blob/master/__stories__/AsyncData.story.tsx

note in the tree walker generator function the if condition that checks if the parent's data was downloaded:

if (parentMeta.data.downloaded) {

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants