I'm new to react-native currently developing an app All the app should contain
1- Carousel
2- 12 Category Card
3- 1 Category Page Contain Cards with Images and some texts (The card data will be fetched from an API)
I'm Using Expo App But the Performance is extremely slow in iPhone 6 For Example it's fine in iPhone 7 and above
Scrolling Performance is bad
Navigation Performance is bad
Project EXPO QR LINK: https://expo.io/@ov3rcontrol/Weddi
Github Project Link : https://github.com/Ov3rControl/Weddi
(Feel Free To Pull Request and Contribute to improving its a performance )
How can I improve my React-Native App Performance? what am i doing wrong here that is causing this performance issues
**EDIT 1: i Get Warrnings 1- Overwriting fontFamily style attribute preprocessor
2- Each child in a list should have a unique "key" prop
3- VirtualizedList: You have a large list that is slow
to update - make sure your render item function renders components that follow React performance best practices like PureComponent, shouldComponentUpdate**
VirtualizedList: You have a large list that is slow
Use pagination to resolve this. Limit the data array size to solve that. Flatlist renders the element on by one and if there are lot of elements then the performance would be slow. Also try using some optimisation procedures of flatlist like :removeClippedSubviews
initialNumToRender
maxToRenderPerBatch
windowSize
and layout height and width pre calculation if those are static : https://facebook.github.io/react-native/docs/flatlist#getitemlayouthttps://medium.com/sanjagh/how-to-optimize-your-react-native-flatlist-946490c8c49b