What does removeClippedSubviews do, and when can enabling it be a double-edged sword?

Short answer

It detaches native views outside the viewport from the native render tree to save memory, but can cause some elements to flicker or temporarily disappear during fast scrolling.

Explanation

removeClippedSubviews can greatly reduce memory use in huge lists. However, on some Android versions or with elements containing inputs, maps, or web views, detaching them abruptly can lose focus state or show blank areas until the system remounts them.

Code example

<FlatList
  data={heavyItems}
  removeClippedSubviews={Platform.OS === 'android'}
  renderItem={renderItem}
/>

Common mistakes

• Enabling removeClippedSubviews for elements with complex text inputs, which can cause focus problems and make the keyboard disappear.

Follow-up questions

• What is Shopify's FlashList architecture, and what does it improve over FlatList?

Sources

• React Native docs — FlatList: removeClippedSubviews