React Native android 应用中的慢速动画

Slow animations in ReactNative's android app

我正在使用 reduxreact-native 并且在一页上我使用了 FlatList 和一些使用 Animated.new() 的动画。 同样在他的应用程序中,我正在使用反应导航,但我的应用程序的 UI 动画非常慢。原因之一是该列表有数百个。 我试图通过使用 getItemLayout 来增强 FlatList 的性能,但尽管相同的代码在 ios.

上工作效率很高,但应用程序仍然表现得很慢

我经历了以下 URL: https://facebook.github.io/react-native/docs/performance.html

谁能指导我如何提高性能?

已编辑:

添加 getItemLayoutonEndReachedThreshold 后性能得到改善,但有时抽屉图标仍然没有响应。

<FlatList
                    refreshControl={
                        <RefreshControl
                            refreshing={this.props.gameList.get('isFetching')}
                            onRefresh={()=>{
                                this.props.getGameList()
                            }}/>}
                    getItemLayout={this.getItemLayout}
                    contentContainerStyle={styles.gameListContent}
                    data={gameListData}
                    keyExtractor={this.keyExtractor}
                    renderItem={props=>this.renderItem({...props, isFirst: props.index === 0, isLast: props.index === gameListData.length-1})}
                    ItemSeparatorComponent={this.renderSeparator}
                    initialNumToRender={25}
                    onEndReachedThreshold={0.5}
                />

为了提高 FlatLsit 的性能,在初始渲染时通过将 10 切片到 15 将数据传递给它,并在 scrollUp 事件上将所有数据传递给 is,因为它加载了更多数据正如我们在 setInitilaItemToRender 中指定的那样,因为它多次触发 onEndReached 事件。

为每个列表项创建 PureComponent 帮助我提高了列表性能。但是有些人建议使用 ListView 而不是 FlatList 但我没有尝试过。关注以下 URL 了解更多详情:

https://github.com/facebook/react-native/issues/13649