关于 FlatList renderItem 组件性能和内存使用的问题

Question

我是react-native 新手。 只是关于FlatListrenderItemComponent 性能和内存使用的问题。

renderItemComponents 下面哪个性能更快，哪个对大型列表内存友好？

1：

class MyListItem extends React.PureComponent {
  render() {
    return (
     <View style={{width: '100%', height: 60}}>
       {
         this.props.size ===  30 ?
         (
           <View style={{width: 30, height: 30}}>
                <Text>test</Text>
           </View>
         )
         :
         null
       }
       <View>...</View>
     </View>
    )
  }
}

2：

class MyListItem extends React.PureComponent {
  render() {
    return (
         <View style={{width: '100%', height: 60}}>
           <View style={{width: this.props.size, height: this.props.size}}>
                <Text>test</Text>
           </View>
           <View>...</View>
         </View>
    )
  }
}

谢谢。

Answer 1

Second 更快且内存友好，因为它不会检查任何条件，因此与 First 相比，它的性能更快。 你可以使用 FlatList 比两者都好。