solid/compose-with-tanstack-virtual

Virtualize large datasets in a SolidJS data grid by using `createVirtualizer` from `@tanstack/solid-virtual` to render only the visible subset of rows from `table.getRowModel().rows`, significantly reducing DOM workload for fast scrolling.

Yes, TanStack virtual scrolling integrates with SolidJS table sorting, filtering, grouping, and expansion. The virtualizer strictly controls which rows render visually, while the underlying table logic manages the data operations independently.

Virtual scrolling with `@tanstack/solid-table` works by passing a reactive row count to `createVirtualizer` and rendering the `<tbody>` with absolute-positioned `<tr>` elements, ensuring only the rows currently in view are mounted to the DOM.

To handle dynamic row heights in a virtualized SolidJS table, configure `createVirtualizer` with the correct scroll element ref scoping and use absolute positioning with `translateY` on virtualized `<tr>` elements to maintain accurate scroll positioning.

You should add virtualization to your SolidJS data table when dealing with very large row counts, scroll-heavy views, or infinite scrolling patterns, ensuring the UI remains responsive by avoiding mounting thousands of DOM nodes simultaneously.