React Progressive Table
This component lets you render tables progressively, row by row. Useful for speeding up responsiveness when rendering large tables.
Installation
npm i --save react-progressive-table
Usage
As a standard table:
import ProgressiveTable from 'react-progressive-table'; const MyComponent = <ProgressiveTable> <table> <thead> <tr> <th> Foo </th> <th> Bar </th> </tr> </thead> <tbody> <tr> <td> 53 </td> <td> 42 </td> </tr> </tbody> </table> </ProgressiveTable>;
Rendering using different table components, e.g. semantic-ui:
import ProgressiveTable from 'react-progressive-table';import Table from 'semantic-ui-react'; const MyComponent = <ProgressiveTable => <Table> <Table.Header> <Table.Row> <Table.HeaderCell> Foo </Table.HeaderCell> <Table.HeaderCell> Bar </Table.HeaderCell> </Table.Row> </Table.Header> <Table.Body> <Table.Row> <Table.Cell> 53 </Table.Cell> <Table.Cell> 42 </Table.Cell> </Table.Row> </Table.Body> </Table> </ProgressiveTable>;