vue-virtual-scroller

Vue Virtual Scroller is a component library for Vue.js that makes scrolling through large lists and datasets fast and smooth. Instead of rendering every item in a list all at once, which can slow down or crash a browser when there are thousands of rows, this library only renders the items currently visible on screen. As you scroll, new items are added to the page and offscreen items are removed, keeping memory usage and rendering time low regardless of how many total items you have.

The technique this library uses is called virtual scrolling. It is a well-established approach for large data displays in web applications. The practical result is that a list with ten thousand items performs much the same as a list with ten items, because at any given moment only the visible slice exists in the browser's page structure.

The current version targets Vue 3 and ships in ESM format only. ESM, short for ECMAScript Modules, is the modern JavaScript module format. The library works with ESM-aware build tools such as Vite, Nuxt, Rollup, and webpack 5. Projects on an older stack may need to check compatibility before adding it. If you are working on a Vue 2 project, the first version of the library is maintained on a separate branch of the same repository.

Setting up the library in a Vue 3 project with Vite or Nuxt follows the same steps as adding any other npm package. A live demo and a video demo are linked from the README, and a dedicated documentation site covers the full component API and available options.

The README in this repository is brief and points to external resources for detailed usage. Full instructions, component props, slots, and examples are on the documentation site rather than in the repository itself.