go-virtualize

go-virtualize

Virtualize big data for React

Install

npm i go-virtualize

yarn add go-virtualize

Usage

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>
  );
}

Live