# react-virtual

> Hooks for virtualizing scrollable elements in React

Latest version **2.10.4** (published 2022-01-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-virtual
pnpm add react-virtual
yarn add react-virtual
bun add react-virtual
```

## Health

**Score 45/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high maintenance score; high quality score.

Warnings: low downloads.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 2.10.4 |
| Published | 2022-01-21 |
| First published | 2020-05-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 154.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7112 |
| Author | tannerlinsley |
| Maintainers | tannerlinsley |

## Links

- npm: https://www.npmjs.com/package/react-virtual
- Repository: https://github.com/tannerlinsley/react-virtual
- Homepage: https://github.com/tannerlinsley/react-virtual#readme
- Issues: https://github.com/tannerlinsley/react-virtual/issues
- Funding: https://github.com/sponsors/tannerlinsley
- npm.io page: https://npm.io/package/react-virtual

## Dependencies (1)

- [@reach/observe-rect](https://npm.io/package/@reach/observe-rect.md) ^1.1.0

## Recent versions

- 2.10.4 (latest) — 2022-01-21
- 2.10.3 — 2022-01-20
- 2.10.2 — 2022-01-20
- 2.9.1 — 2022-01-20
- 2.10.0 — 2021-12-02
- 2.9.0 — 2021-11-29
- 2.8.2 — 2021-09-30
- 2.8.1 — 2021-08-05
- 2.8.0 — 2021-07-13
- 2.7.2 — 2021-07-06
- 2.7.1 — 2021-04-16
- 2.7.0 — 2021-04-15
- 2.6.2 — 2021-04-13
- 2.6.1 — 2021-03-23
- 2.6.0 — 2021-03-20
- … 29 more at https://npm.io/package/react-virtual/versions

## README

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
**Table of Contents**  *generated with [DocToc](https://github.com/thlorenz/doctoc)*

- [Visit react-virtual.tanstack.com for docs, guides, API and more!](#visit-react-virtualtanstackcom-for-docs-guides-api-and-more)
- [Quick Features](#quick-features)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

![React Virtual Header](https://github.com/tannerlinsley/react-virtual/raw/master/media/repo-dark.png)

Hooks for virtualizing scrollable elements in React

<a href="https://twitter.com/intent/tweet?button_hashtag=TanStack" target="\_parent">
  <img alt="#TanStack" src="https://img.shields.io/twitter/url?color=%2308a0e9&label=%23TanStack&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ftweet%3Fbutton_hashtag%3DTanStack">
</a>
<a href="https://npmjs.com/package/react-virtual" target="\_parent">
  <img alt="" src="https://img.shields.io/npm/dm/react-virtual.svg" />
</a>
<a href="https://bundlephobia.com/result?p=react-virtual" target="\_parent">
  <img alt="" src="https://badgen.net/bundlephobia/minzip/react-virtual" />
</a>
<a href="https://spectrum.chat/react-virtual">
  <img alt="Join the community on Spectrum" src="https://withspectrum.github.io/badge/badge.svg" />
</a>
<a href="https://github.com/react-virtual/react-virtual" target="\_parent">
  <img alt="" src="https://img.shields.io/github/stars/tannerlinsley/react-virtual.svg?style=social&label=Star" />
</a>
<a href="https://twitter.com/tannerlinsley" target="\_parent">
  <img alt="" src="https://img.shields.io/twitter/follow/tannerlinsley.svg?style=social&label=Follow" />
</a>

<br />
<br />

Enjoy this library? Try the entire [TanStack](https://tanstack.com)! [React Query](https://github.com/tannerlinsley/react-query), [React Table](https://github.com/tannerlinsley/react-table), [React Charts](https://github.com/tannerlinsley/react-charts), [React Form](https://github.com/tannerlinsley/react-form)

## Visit [react-virtual.tanstack.com](https://react-virtual.tanstack.com) for docs, guides, API and more!

## Quick Features

- Row, Column, and Grid virtualization
- One single **headless** hook
- Fixed, variable and dynamic measurement modes
- Imperative scrollTo control for offset, indices and alignment
- Custom scrolling function support (eg. smooth scroll)
- <a href="https://bundlephobia.com/result?p=react-virtual@latest" target="\_parent">
  <img alt="" src="https://badgen.net/bundlephobia/minzip/react-virtual@latest" />
  </a>

<!-- Force  -->

---
_Source: https://npm.io/package/react-virtual · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._