A Better List View For React Native – FlashList

A great alternative to the <FlatList> that enables you to create a fast and high-performance listview in React Native applications.

How to use it:

1. Install and import.

# Yarn
$ yarn add @shopify/flash-list

# NPM
$ npm i @shopify/flash-list
import React from "react";
import { View, Text } from "react-native";
import { FlashList } from "@shopify/flash-list";

2. Create a basic flash list.

const DATA = [
  {
    title: "First Item",
  },
  {
    title: "Second Item",
  },
  {
    title: "Third Item",
  },
  {
    title: "Last Item",
  },

];
const MyList = () => {
  return (
    <FlashList
      data={DATA}
      renderItem={({ item }) => <Text>{item.title}</Text>}
      estimatedItemSize={200}
    />
  );
};

Preview:

A Better List View For React Native

Download Details:

Author: Shopify

Live Demo: View The Demo

Download Link: Download The Source Code

Official Website: https://github.com/Shopify/flash-list

License: MIT

You Might Be Interested In:

Add Comment