Virtualize big data for React
npm i go-virtualize
yarn add go-virtualize
import { Virtualize, VirtualizedComponentProps } from "go-virtualize";
function Row({ column, row, children, key }: VirtualizedComponentProps) {
return (
<div key={key} className="row">
{children}
</div>
);
}
function Column({ column, row, key }: VirtualizedComponentProps) {
return (
<div key={key} className="column">
{column}, {row}
</div>
);
}
function App() {
return (
<div className="App">
<Virtualize
style={{ width: "100%", height: "100%", backgroundColor: "#ccc" }}
rows={100000}
columns={10000}
row={Row}
column={Column}
avgHeight={30}
avgWidth={200}
/>
</div>
);
}