FlashList

FlashList is Shopify’s high-performance list component for React Native, built as a near drop-in replacement for FlatList that eliminates the blank-cell flicker and janky scrolling common with large or complex lists. Version 2 was rebuilt from the ground up as a JS-only solution targeting React Native’s New Architecture, using view recycling to reuse component instances instead of destroying and recreating them, and removing the need for the size estimates that FlashList v1 previously required.

Used extensively within Shopify’s own commerce apps and widely adopted across the React Native community, FlashList focuses on making ‘fast scrolling’ achievable by simply swapping the component name — matching FlatList’s familiar props API while delivering meaningfully better frame rates and memory efficiency for feed-like, product-list, and infinite-scroll UIs.

What You Get

• A FlashList component with a FlatList-compatible props API for near-zero migration effort
• View recycling that reuses rendered components instead of destroying/recreating them during scroll
• No size-estimation requirement in v2 — item sizing is handled automatically
• Support for multiple item view types (heterogeneous lists) with strong scroll performance
• Full TypeScript type definitions and React Native New Architecture support

Common Use Cases

• Rendering large product catalogs or shopping feeds without scroll stutter
• Building infinite-scroll social/news feeds that mix multiple content types (posts, ads, headers)
• Replacing an existing FlatList that shows blank cells or drops frames on lower-end devices
• Chat and messaging UIs needing smooth, high-frequency list updates

Under The Hood

Architecture: FlashList v2’s public component (src/FlashList.ts) is a thin re-export of RecyclerView, the actual implementation living under src/recyclerview/. RecyclerViewManager.ts tracks which items are currently mounted and maps scroll position to visible item ranges, RenderStackManager.ts and ViewHolderCollection.tsx/ViewHolder.tsx implement the recycling pool that reuses mounted component instances across scroll positions instead of destroying and remounting them, LayoutCommitObserver.tsx coordinates layout measurement commits, and layout-managers/ houses the sizing strategies that let v2 avoid requiring size estimates. A native/ directory bridges to platform-specific measurement/scroll APIs needed to hook into React Native’s New Architecture (Fabric).

Tech Stack: TypeScript throughout, built against React Native’s New Architecture exclusively in v2 (the README explicitly states v2 will not run on the old architecture), with a fixture/react-native app and Ruby/CocoaPods tooling (Gemfile) for iOS native test fixtures, plus a Jest-based test setup and a documentation website built separately under website/.

Code Quality: Tests live alongside implementation files in __tests__ directories throughout src/, and a dedicated benchmark/ folder under src/ suggests performance regressions are tracked deliberately rather than only functionally tested — appropriate given the library’s entire value proposition is scroll-performance. TypeScript strictness (tsconfig.json, tsc -b build step) and ESLint (lint/lint:fix scripts) are enforced in CI, and the CHANGELOG/RELEASE.md show a disciplined, frequent release process (100 releases recorded).

API Design: The defining design decision is API compatibility with FlatList — matching prop names and behavior closely enough that many teams migrate by only renaming the component — while v2 goes further by removing the estimatedItemSize prop that v1 required, eliminating a common source of misconfiguration and tuning pain. This ‘looks familiar, works better’ positioning keeps the learning curve low for React Native developers who already know FlatList.