Dynamic heights
Items render naturally, then the layout adapts to their sizes.
Virtualization has never been easier.
Layout Virtual renders dynamic lists and responsive grids without making application code measure item heights, predict layout, or reshape content for a special container.
Framework agnostic virtualized layout
Section titled “Framework agnostic virtualized layout”Installation
Section titled “ Installation”npm install layout-virtualnpm install react-layout-virtualnpm install vue-layout-virtualnpm install angular-layout-virtualBundle size
Section titled “ Bundle size”~ 5 - 6 kB (gzip)
Section titled “~ 5 - 6 kB (gzip)”Built for content that refuses to stay one size
Section titled “Built for content that refuses to stay one size”Resize⟶
Features
Section titled “Features”Responsive grids
A list can become a grid as the container grows, without manual row math.
Framework adapters
Use the core engine directly or reach for React, Vue, and Angular packages.
Window scrolling
Virtualize inside a local scroller or coordinate with the document viewport.
soonUse cases
Section titled “Use cases”Unknown height article feeds
No need to crop article titles and adjust all cards to one fixed size.
Contact lists with sticky groups
Group list items easily.
soonChat messages and live insertion
A list with scroll to bottom functionality.
soonGrids with dynamic row heights and column number
No need to calculate rows and columns manually.
Lazy loaded ranges at arbitrary scroll position
Not necessary to load all items before the user reaches intended scroll position.
soon