React Virtual List

View the Project on GitHub mir3z/react-virtual-list

React Virtual List

Virtual vertical list component in React. Displays thousands of items without breaking a sweat!

Overview

This component allows to create very long lists that work extremely fast. This is achieved by rendering only the part of the list visible on the viewport.

Demo

Usage

The library is released as UMD module. Just load it in any way you like. If you include it directly on the web page it is exposed as VirtualList global.

The component accepts the following props:

Example

var items = [];

for (var i = 0; i < 1000; i++) {
    items.push({ number: i });
}

function createItem(item, props, state) {
    return <li key={ item.number }>Item #{ item.number }><li>;
}

<VirtualList items={ items } itemFactory={ createItem } itemHeight={ 100 } />

License

The MIT License (MIT). Copyright (c) 2016 mirz (mirz.hq@gmail.com)