TanStackT
TanStack•11mo ago•
1 reply
urgent-maroon

Is it possible to implement nested virtualization with @tanstack/virtual

Hey is it possible to implement nested virtualization with @tanstack/virtual, or is it better to flatten everything into a single list for better performance?

I have a hierarchical data structure like this:
const data = [
  {
    id: "m1",
    name: "Module 1",
    modules: [
      {
        id: "sub-m1",
        name: "Sub-Module 1",
        roles: [
          {
            id: "r1",
            name: "Role 1",
            tasks: [
              { id: "t1", name: "Task 1" },
              { id: "t2", name: "Task 2" }
            ]
          }
        ]
      }
    ]
  },
  {
    id: "m2",
    name: "Module 2",
    modules: [
      {
        id: "sub-m2",
        name: "Sub-Module 2",
        roles: [
          {
            id: "r2",
            name: "Role 2",
            tasks: [{ id: "t3", name: "Task 3" }]
          }
        ]
      }
    ]
  }
];


Would it be better to virtualize each level separately or flatten the hierarchy into a single list and manage expansion manually? note: my list can be very long
Was this page helpful?