Recyclerlistview: Easier examples/demo, is it just me or is it unnecessarily complex?

Created on 15 Oct 2019  路  6Comments  路  Source: Flipkart/recyclerlistview

I am trying to look at performance of this component vs FlatList.

It seems exceptionally complex, and I don't see any basic demos that I can actually understand what is going on. Would love to see the most basic demo possible with an array of simple numbers.

Also - is there any reason it can't have certain built-in functionality for dataProvider and layoutProvider? Seems like it's overkill to make it required.

The usage in my mind should be at a basic level a)pass in the data you want to be displayed, and b) which component should be rendered to represent the data.

Any help is greatly appreciated, happy to contribute back to the repo to add some getting started help.

There is just so much going on here https://github.com/Flipkart/recyclerlistview/tree/master/docs/guides/samplecode, I honestly don't know where to start. Show me how to get a listview with data [0, 1, 2, 3, 4, 5], with component , now that is simple enough so that I can understand the concepts.

Most helpful comment

@jacquesdev You could have a look at the following expo - https://snack.expo.io/@arunreddy10/rlv-extendedstate-demo. It displays a list of items from 1 to 100 and the content of the item is changed when it is pressed. You could have a look at the dataProvider and layoutProvider props in the above expo to get an idea of how they must be used

All 6 comments

@gzamann @jacquesdev You could go through the samples which have been given in the readme.
You could also go through this nice video on how to get started with RecyclerlistView - https://www.youtube.com/watch?v=R0QMjpCPHOg

@jacquesdev
1) Dataprovider is a wrapper for the data array that is to be displayed in the list. The data provider has to be provided with a method to compare two rows of data to check if they are different or not. This method is very important for performance because if two rows are the same then the row would not be rendered again. Messing up this method can lead to a lot of repeated rendering which would be costly thus affecting the performance.
2) LayoutProvider is necessary as it allows for type based recycling which means that your views which have gone outside the viewport can be reused to render the items yet to enter the viewport on basis of their type. Recyclerlistview is all about performance which makes it necessary to provide a layout provider. In case, the exact size of the view cannot be determined before in hand, an estimated size has to be provided in the layout provider and the forceNonDeterministicRendring prop must be set to true to allow for dynamic resizing based on the content.

Hope this clarifies your question regarding dataprovider and layoutprovider. We are working on adding a complete and exhaustive documentation for the library. Also, you could check out this link for getting started - https://www.youtube.com/watch?v=32ZM72CKtTE.

@gzamann
FlatList/ VirtualizedList has some issues with rendering large lists which are solved by recyclerlistview. In VirtualizedList, the views which have gone outside the viewport are unmounted so even though the memory footprint remains the same, there is a lot of overhead. Recyclerlistview uses type based recycling to reuse the views that have gone outside the viewport without unmounting them resulting in a significant performance improvement.

Closing due to inactivity

Thanks @arunreddy-flipkart

I've looked at the video you posted, and that does make more sense. I do still believe that both the layout provider and the data provider makes things unnecessarily complex for beginners. Of course, it's great to have them, but they should be optional.

@jacquesdev You could have a look at the following expo - https://snack.expo.io/@arunreddy10/rlv-extendedstate-demo. It displays a list of items from 1 to 100 and the content of the item is changed when it is pressed. You could have a look at the dataProvider and layoutProvider props in the above expo to get an idea of how they must be used

@arunreddy10 That snack is a life saviour, thank you for sharing.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ErHarinderSingh picture ErHarinderSingh  路  6Comments

sksin28 picture sksin28  路  8Comments

teryi picture teryi  路  5Comments

waheedakhtar694 picture waheedakhtar694  路  6Comments

sm2017 picture sm2017  路  5Comments