You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Consider creating VTable component for better table support #312
Hi @inokawa
Should this ticket solve the problem that body cell width doesn't match header cell width (when we don't set fixed cell width like in original storybook example) ?
Looks like it doesn't work properly because of position: absolute. I checked this example with mui table + react-virtuoso https://mui.com/material-ui/react-table/#virtualized-table . They don't set height to tbody directly, but add additional rows to the beginning and to the end to control scroll height and visible rows position, and avoid position: absolute.
Hi, the purpose of this issue is to find a stable way to virtualize table element with virtua, because table virtualization is very tricky...
I'll take a look mui table example. Thank you!
In addition to that, @tanstack/react-virtual follows a similar approach to MUI virtualization, but without relying on absolute positioning. I agree with @mariia-mitiureva regarding the current limitations of Virtua.
I hope this feature gets prioritized soon, but I understand that open-source work takes time and effort. Looking forward to seeing where this goes!
For anyone visited here, is it necessary to render with table tag? And what features do you need from VTable?
The most difficult part of virtualized table is table tag has strict markup/style restriction. Virtualized table-like grid with div is easier with virtua's architecture, and we could support more features like sticky column/row (#635) or rowspan/colspan (#312 (comment)).
it might be fine so long as screen readers can read them properly (this is mostly up to the consumers of the library, but so long as the library ensures it's possible to do so, then it's good)
I recently built a complex data-table using tanstack table and virtua. for me, i think table tag made me much easier to built that complex thantable-like grid with div.
i'll create a minimal example (demo) for u, when i got time"
Activity
mariia-mitiureva commentedon Jan 8, 2024
Hi @inokawa
Should this ticket solve the problem that body cell width doesn't match header cell width (when we don't set fixed cell width like in original storybook example) ?
Looks like it doesn't work properly because of
position: absolute. I checked this example with mui table + react-virtuoso https://mui.com/material-ui/react-table/#virtualized-table . They don't set height to tbody directly, but add additional rows to the beginning and to the end to control scroll height and visible rows position, and avoidposition: absolute.inokawa commentedon Jan 8, 2024
Hi, the purpose of this issue is to find a stable way to virtualize table element with virtua, because table virtualization is very tricky...
I'll take a look mui table example. Thank you!
junwen-k commentedon Feb 16, 2025
In addition to that, @tanstack/react-virtual follows a similar approach to MUI virtualization, but without relying on absolute positioning. I agree with @mariia-mitiureva regarding the current limitations of Virtua.
I hope this feature gets prioritized soon, but I understand that open-source work takes time and effort. Looking forward to seeing where this goes!
[-]Better table support[/-][+]Consider creating VTable component for better table support[/+]tresorama commentedon Oct 20, 2025
Just an Idea for an API with
VList<table> <thead> <tr> </tr> </thead> <VList + rootElement={'tbody'} + // or + rootElement={TbodyComponent} > <tr> <td> Cell 1</td> <td> Cell 2</td> </tr> </VList>inokawa commentedon Dec 4, 2025
https://ant.design/docs/blog/virtual-table
inokawa commentedon Dec 4, 2025
For anyone visited here, is it necessary to render with
tabletag? And what features do you need from VTable?The most difficult part of virtualized table is
tabletag has strict markup/style restriction. Virtualized table-like grid withdivis easier with virtua's architecture, and we could support more features like sticky column/row (#635) or rowspan/colspan (#312 (comment)).mary-ext commentedon Dec 4, 2025
it might be fine so long as screen readers can read them properly (this is mostly up to the consumers of the library, but so long as the library ensures it's possible to do so, then it's good)
g3tl0st commentedon Dec 4, 2025
I recently built a complex data-table using
tanstack tableandvirtua. for me, i thinktabletag made me much easier to built that complex thantable-like gridwithdiv.i'll create a minimal example (demo) for u, when i got time"
inokawa commentedon Sep 19, 2026
Shipped
VGridcomponent in0.52.0, which hasrole="table". Any feedback is welcome!