Download
There are several components provided by vue-virtual-scroller. RecycleScroller is a component that only renders the visible items in your list. It also re-uses components and dom elements to be as efficient and performant as possible. DynamicScroller is a component that wraps the RecycleScroller component and extends its features to include dynamic size management. The main use case for this is when you do not know the size of the items in advance. The Dynamic Scroller automatically "discovers" item dimensions as it renders new items during scrolling. DynamicScrollerItem must wrap each item in a DynamicScroller to handle size computations. IdState is a mixin that ease the local state management in reused components inside a RecycleScroller. RecycleScroller is a virtual scroller that only renders the visible items. As the user scrolls, RecycleScroller reuses all components and DOM nodes to maintain optimal performance.
Features
- The RecycleScroller creates pools of views to render visible items to the user
- A view holds a rendered item, and is reused inside its pool
- For each type of item, a new pool is created so that the same components (and DOM trees) are reused for the same type
- Views can be deactivated if they go off-screen, and can be reused anytime for a newly visible item
- When the user scrolls inside RecycleScroller, the views are mostly just moved around to fill the new visible space
- The Recycle Scroller is a component that only renders the visible item in your list
Project Samples
