|
| 1 | +# scrolloop |
| 2 | + |
| 3 | +> Modern virtual and infinite scrolling components for React, React Native, Preact, Vue, and Svelte. scrolloop uses windowing to render only the items visible in the viewport, keeping large lists fast while exposing the same API for fixed-height virtual lists and page-based infinite loading. |
| 4 | + |
| 5 | +scrolloop is a monorepo of framework adapters built on a platform-independent virtualization core: |
| 6 | + |
| 7 | +- `@scrolloop/core`: platform-independent virtualization logic |
| 8 | +- `@scrolloop/shared`: infinite-loading state management and shared utilities |
| 9 | +- `@scrolloop/react`: React components (`VirtualList`, `InfiniteList`) |
| 10 | +- `@scrolloop/react-native`: React Native components |
| 11 | +- `@scrolloop/preact`: Preact components and hooks |
| 12 | +- `@scrolloop/vue`: Vue 3 components and composables |
| 13 | +- `@scrolloop/svelte`: Svelte 5 components and stores |
| 14 | + |
| 15 | +## Guide |
| 16 | + |
| 17 | +- [Introduction](https://976520.github.io/scrolloop/guide/introduction): What scrolloop is, why virtual scrolling matters, and the packages available. |
| 18 | +- [Quick start](https://976520.github.io/scrolloop/guide/quick-start): Build a windowing list in about a minute with a minimal React example. |
| 19 | +- [Concepts](https://976520.github.io/scrolloop/guide/concepts): How windowing, overscan, and absolute positioning let scrolloop render tens of thousands of items without performance loss. |
| 20 | + |
| 21 | +## Components |
| 22 | + |
| 23 | +- [VirtualList](https://976520.github.io/scrolloop/guide/virtual-list): The core high-performance list component, with per-runtime usage and props (`count`, `itemSize`, `height`, `renderItem`). |
| 24 | +- [InfiniteList](https://976520.github.io/scrolloop/guide/infinite-list): Combines data fetching with virtualization for page-based infinite scrolling (`fetchPage`, `pageSize`, `itemSize`, `renderItem`). |
| 25 | + |
| 26 | +## Advanced |
| 27 | + |
| 28 | +- [SSR Guide](https://976520.github.io/scrolloop/guide/ssr): Server-side rendering support for `@scrolloop/react`'s `InfiniteList`, using `isServerSide` and initial data to improve initial load and SEO (React DOM adapter only). |
| 29 | + |
| 30 | +## Optional |
| 31 | + |
| 32 | +- [GitHub repository](https://github.com/976520/scrolloop): Source code, issues, and contribution workflow. |
| 33 | +- [README](https://github.com/976520/scrolloop#readme): Installation commands for each framework package. |
0 commit comments