I am trying to implement Flashlist for Shopify on a web application, but the DOM nodes are not reducing when I click on “Load More”. For better memory optimisation, it is necessary to reduce or recycle existing DOM nodes when loading more data.

const overrideItemLayout: FlashListProps<Item>['overrideItemLayout'] = (
  layout,
  item,
  index,
  maxColumns,
  extraData
) => {
  layout.size = 50; // Assuming each item has a height of 100
  layout.span = 1; // Assuming each item spans 1 column (if applicable)
};

<FlashList
  data={data}
  renderItem={renderItem}
  estimatedItemSize={50} // Adjust based on your item height
  keyExtractor={(item) => item.id}
  overrideItemLayout={overrideItemLayout}
  ListFooterComponent={renderConversationFooter(
    true,
    false,
    10,
    loadMore,
    true
  )}
/>;