Эдди Османи опубликовал в марте статью про работу с большими списками в React — "Rendering large lists with react-window".

Рендеринг десятков и сотен тысяч элементов в списке приводит к лагам в интерфейсе. Для решения этой проблемы используются виртуализированные списки, в которых рендерится не весь контент сразу, а только та его часть, которая видна в данный момент плюс некоторое смещение выше и ниже. Самая известная библиотека для создания таких списков react-virtualized Брайана Воуна (Brian Vaughn). Но существует более компактный аналог от того же автора — react-window. Про него и рассказывает в статье Эдди.

React-window — очень компактная и быстрая библиотека. В статье есть примеры того, как сделать с помощью неё виртуальный список и таблицу на гридах. У react-window есть несколько ограничений в отличие от react-virtualized, но для большинства случаев она подходит хорошо.

#performance #react #library

https://addyosmani.com/blog/react-window/