Basicly, my problem is that I see the main screen of my cryptolist app so slow.

As I understand, the flatlist component is for reducing the resources of being consumed when we have large lists rendering in our app.

I have a basic screen of crypto list, with a couple of modals, using react-native-modal, and it just delays so much to display the content of any simple filter modal, only touchableOpacity and textmodal you select.

List using listview

I don’t know why it just isn’t smooth…

Crypto flatlist component

{cryptox.length > 0 && 
            <FlatList 
              style={styles.hotlist}
              data={cryptox}
              getItemLayout={(data, index) => (
                {length: 50, offset: 50 * index, index}
              )}
              removeClippedSubviews={true}
              renderItem={({ item }) => <Coin x={item} />}
              maxToRenderPerBatch={10}
              windowSize={3}
              refreshControl={
                <RefreshControl
                  refreshing={refreshing}
                  onRefresh={manageReload}
                  tintColor="white"
                />
              }
              onEndReached={loadMore}
              onEndReachedThreshold={0.3}
              />}

Modal basic component

  const ModalFilter24 = useMemo(() =>{
    return(<>
    <Modal avoidKeyboard={false} isVisible={modal24} style={styles.modalAlerts} onSwipeComplete={toggleModal24} swipeDirection="down">
    <View style={styles.alertCreator}>
      <View style={styles.filterModal}>
        <View style={styles.context}>
          <Text style={styles.boldTexter}>Filter by Percent</Text>
          <TouchableOpacity onPress={()=>{toggleModal24()}}><IconFax name={'close'} size={16} color={'#000'} /></TouchableOpacity>

        </View>
        
        <View style={styles.filterOptions}>
          
          <TouchableOpacity onPress={()=>{setPricing('24h'); toggleModal24()}} style={styles.filterOption}>
            <Text style={styles.colorBlack}>24h %</Text>
          </TouchableOpacity>

          <TouchableOpacity onPress={()=>{setPricing('7d'); toggleModal24()}} style={styles.filterOption}>
            <Text style={styles.colorBlack}>7d %</Text>
          </TouchableOpacity>

        </View>
      </View>
    </View>
    </ Modal>
    </>)
  }, [modal24])

**1. I have used useMemo to cache the modal, but is not optimizing anything
2. I have used good practices, to accelerate the render of the list, but still, it seems to be slow.
**

I expect to see the modal loading faster, without deleting the flatlist.