tanstack-solid-table-with-tanstack-virtual

This skill builds on @tanstack/table-core#core, getting-started, and table-state. Virtualize the final Table model in the renderer; Virtual is not a Table feature.

Setup

import { createVirtualizer } from '@tanstack/solid-virtual'

let scrollElement: HTMLDivElement | undefined
const rows = () => table.getRowModel().rows
const virtualizer = createVirtualizer({
  get count() {
    return rows().length
  },
  getScrollElement: () => scrollElement ?? null,
  estimateSize: () => 36,
  getItemKey: (index) => rows()[index].id,
  overscan: 5,
})