Об этом проекте

react-window предоставляет компоненты React для рендеринга больших наборов данных, избегая затрат производительности на создание элементов для каждого элемента сразу. Он предлагает два основных компонента: List для данных с множеством строк и Grid для данных с множеством строк и столбцов. Компонент List требует rowComponent, rowCount, rowHeight и rowProps. Высоту строк можно задавать в пикселях, процентах, функциях от индекса и свойств ячейки или с помощью динамического кэша высоты строк из useDynamicRowHeight. В документации отмечается, что динамические высоты менее эффективны, чем предопределенные размеры. Дополнительные функции включают overscan-рендеринг, пользовательские ключи строк, обратные вызовы изменения размера и видимого диапазона, высоту по умолчанию для серверного рендеринга, пользовательские CSS-классы и стили, переопределение корневого элемента, а также императивный API ref для прокрутки и доступа к DOM. Компонент Grid требует cellComponent, cellProps, columnCount, columnWidth, rowCount и rowHeight. Размеры столбцов и строк могут быть значениями в пикселях, процентах или функциями, но, в отличие от строк List, размеры ячеек Grid должны быть определяемы без рендеринга. Grid также поддерживает overscan в обоих направлениях, пользовательские ключи строк и столбцов, направленный текст, размеры по умолчанию для серверного рендеринга, обратные вызовы изменения размера и отрисованных ячеек, дочерние элементы для наложения или подсказок, а также императивные refs для Grid. Пакет устанавливается из npm с помощью "npm install react-window", а определения TypeScript включены в опубликованный дистрибутив. Документация доступна по адресу react-window.vercel.app, с отдельной документацией для версии 1.x. В README описывается использование в проектах, включая React DevTools и браузер Replay, но не приводятся конкретные утверждения о тестах производительности.