React Native Tutorial Part - 10 | React Native Tutorial For Beginners | Learn2Earn Labs | Hindi

Hey Learners,
Here is one of our lecture recording of React Native. It will help you in understanding the topics and development concepts.

FLATLIST IN REACT NATIVE
The FlatList Component is among the simplest and most-used React Native components.
FlatList is a component that displays a limited number of items that can fit inside the current window and the rest of the items will be rendered with the list scrolling action.

Or,

Flatlist in reacts native is designed to handle large datasets that might not fit on the device screen.
The FlatList component displays the similar structured data in a scrollable list.
It works well for large lists of data where the number of list items might change over time.
The FlatList shows only those renders elements which are currently displaying on the screen, not all the elements of the list at once.
FlatList offers many inbuilt features like vertical/horizontal scrolling, header/footer views, separator, pull to refresh, lazy loading, etc.
FlatList can simply be implemented using the "data" and "renderItem" props to create a list.


FEATURES OF FLATLIST
It provides Scroll loading.
Pagination of List Of data.
Rendering items as List and Grid View Type.
Fully cross-platform.
Optional horizontal mode.
Header and Footer support.
Separator support.
Pull to Refresh.


ADVANTAGES OF FLATLIST
FlatList shows only needed items on the app screen.
Simple & easy.
Pull to refresh functionality.
Provide smooth scrolling.


SYNTAX OF FLATLIST
FlatList
data={
Data To Be Set in List
}
ItemSeparatorComponent={
An Separator View
}
renderItem={({ item }) =
(Single Item View)
}
/


SCROLLVIEW Vs FLATLIST

a) Scrollview
ScrollView renders all its react child components at once.
Low performance.
Scrollview provides slow rendering and increased memory usage.
ScrollView doesn't render separators between your items.

b) Flatlist
FlatList shows only needed items on the app screen.
High performance.
FlatList save memory and processing time.
FlatList render separators between your items.


LISTVIEW Vs FLATLIST

a) ListView
Low performance.
Listview is Depreciated.
Slow.
Render data in a vertical manner.

b) FlatList
High performance.
Flatlist is a New component.
Fast.
Render data vertically as well as horizontally.


Hope you enjoyed this tutorial! Don’t forget to subscribe to my channel.
https://www.youtube.com/channel/UCf4bJDvTPqiY2hGI51Q22jQ

If you have any query then visit our website-
https://www.learntoearnlabs.com/

If you want to connect with the trainer then here is the LinkedIn profile link
https://www.linkedin.com/in/rohitsinghprofile/

Have a good time ahead!
Thank you