Getting started
When you need to render a list, table or grid with a lot of rows or columns, you may face performance problems. A lot of DOM nodes must be created, but only a few of them are visible.
One way to optimize this is called virtual scroll. Based on scroll position and size of each item we can calculate the range to show. Only visible elements are rendered with this approach.
row 0
row 1
row 2
row 3
row 4
row 5
row 6
row 7
Components (List, Table) are available for basic use cases. If you want maximum flexibility — headless API is for you. Variable item sizes with on-the-fly remeasurement are also supported.
Supported adapters
Library core, housing all dimensions/calculations, is written in vanilla js, so it can be reused.
- React
Vue(coming)Angular(coming)Svelte(coming)
Supported browsers
// taken from package.json
"browserslist": [
">0.6%",
"not op_mini all"
]