FlatList renderItem is called multiple times

Question

I\'m using FlatList to display data from an API call:

render() {
  const { navigation } = this.props;
  const animating = this.state.animating;

  return (
          


        

Answer 1

https://snack.expo.io/B1KoX-EUN - For optimization and prevent re-render you can call shouldComponentUpdate(nextProps, nextState) to diff this.state or this.props and return true/false - https://reactjs.org/docs/react-component.html#shouldcomponentupdate docs say this callback should be used only for optimization which is what we're doing here.