Разработчики из Legend App выпустили Legend List, библиотеку, позиционируемую как прямая замена FlatList и FlashList. Ключевое отличие проекта — полная изоляция от нативного кода: вся логика реализована на TypeScript, что исключает необходимость линковки нативных модулей и упрощает интеграцию в кроссплатформенные проекты.
Почему это важно для разработчиков
Основная проблема стандартных списков в React Native — падение производительности при работе с динамическими размерами элементов. Legend List решает это архитектурно: компонент изначально оптимизирован для рендеринга элементов переменной высоты без «рывков» и задержек. Кроме того, библиотека поддерживает бесконечную прокрутку в обоих направлениях без артефактов скролла и предлагает специфичный для чатов функционал: привязку к концу списка без использования инвертированного режима (inverted), что устраняет проблемы с анимациями.
Ключевые технические особенности
Библиотека сохраняет API-совместимость с FlatList и FlashList, что делает миграцию минимально затратной. Среди новых возможностей выделяются:
- recycleItems: переиспользование компонентов элементов для оптимизации памяти (по умолчанию выключено для безопасности сложного стейта).
- maintainScrollAtEnd: удержание скролла в конце списка при обновлении данных, критично для мессенджеров.
- maintainVisibleContentPosition: стабилизация видимого контента при изменении размеров элементов выше viewport.
- alignItemsAtEnd: выравнивание контента по низу для UI чатов.
Сравнение с аналогами
| Характеристика | Legend List | FlatList | FlashList |
|---|---|---|---|
| Нативные зависимости | Нет (100% JS/TS) | Да (Reanimated/Platform) | Да (Reanimated) |
| Динамические размеры | Нативная поддержка | Требует оптимизации | Хорошая поддержка |
| Бесконечный скролл (оба направления) | Да (без скачков) | Сложная реализация | Ограничено |
| Размер пакета | Минимальный (легковесный) | Стандартный | Средний |
Установка и дорожная карта
Установка осуществляется через стандартные менеджеры пакетов: npm install @legendapp/list или bun add @legendapp/list. Библиотека поддерживает как React Native, так и React DOM (в разработке). В ближайшем плане (Roadmap) заявлены поддержка колонок (column spans), sticky-заголовков, masonry-лейаута и реализации getItemType для еще более точной оптимизации рендеринга.
Проект распространяется под лицензией MIT, документация и примеры кода доступны на официальном сайте и в репозитории GitHub.
Источник: Github ↗