Large Dataset
2,550 nodes, all expanded, scrolling smoothly — the DOM only ever holds the rows currently in view.
Group 1
Item 1.1
Item 1.2
Item 1.3
Item 1.4
Item 1.5
Item 1.6
Item 1.7
Item 1.8
Item 1.9
Item 1.10
Item 1.11
Item 1.12
Item 1.13
Item 1.14
Item 1.15
Item 1.16
Item 1.17
Item 1.18
Item 1.19
Item 1.20
Item 1.21
Item 1.22
Item 1.23
2,550 nodes total — only the rows in view are mounted.
Show code
const data = generateLargeTree(50, 50); // 2,550 nodes
<TreeKit
data={data}
virtualized
height={360}
defaultExpandedIds={data.map((n) => n.id)}
/>The architecture behind this — and when you actually need virtualized vs. when default rendering is already fast enough — is covered in Large Trees.