我在使用React原生API(Pressable)时注意到我的React原生应用程序(Android版本)上的一些性能相关问题。当按下时,它会延迟几秒钟才响应,特别是在使用它在屏幕之间导航时。我似乎不知道为什么会发生这种情况。它在iOS上运行得很好。我将我的React Native版本升级到0.71.2。我希望这能修复滞后,但它没有
pwuypxnk1#
我确信Pressable比其他TouchableComponent更容易导致滞后,请看这里的代码:比较TouchableOpacity和Pressability你可以看到Pressable是一个沉重的组件,它拥有更多的事件,即使是它自己的Gesture,因此我建议不要多次使用Pressable,例如在FlatList项中。
Pressable
TouchableComponent
TouchableOpacity
Pressability
Gesture
50few1ms2#
我在我的项目中遇到了类似的问题,我找到了一个适合我的解决方案。我使用的是react-navigation中的createStackNavigator,我在Android上遇到了延迟。在将其替换为createNativeStackNavigator后,性能问题得到了解决。这可能也值得在您的项目中尝试。祝你好运!
createStackNavigator
createNativeStackNavigator
mec1mxoz3#
React Native提供了InteractionManager来处理长时间运行的任务并提高响应能力。您可以将导航代码 Package 在InteractionManager.runAfterInteractions中,以确保其顺利运行而不会阻塞UI线程。
InteractionManager
InteractionManager.runAfterInteractions
import { InteractionManager } from 'react-native'; InteractionManager.runAfterInteractions(() => { // Your navigation code here });
字符串
3条答案
按热度按时间pwuypxnk1#
我确信
Pressable
比其他TouchableComponent
更容易导致滞后,请看这里的代码:比较
TouchableOpacity
和Pressability
你可以看到
Pressable
是一个沉重的组件,它拥有更多的事件,即使是它自己的Gesture
,因此我建议不要多次使用Pressable
,例如在FlatList项中。50few1ms2#
我在我的项目中遇到了类似的问题,我找到了一个适合我的解决方案。我使用的是react-navigation中的
createStackNavigator
,我在Android上遇到了延迟。在将其替换为createNativeStackNavigator
后,性能问题得到了解决。这可能也值得在您的项目中尝试。祝你好运!mec1mxoz3#
React Native提供了
InteractionManager
来处理长时间运行的任务并提高响应能力。您可以将导航代码 Package 在InteractionManager.runAfterInteractions
中,以确保其顺利运行而不会阻塞UI线程。字符串