Improved Performance for Variable Extent Reorderable List in Flutter
While working on a project in Flutter, I needed a list that could perform well while being thousands of items long, where every item wasn’t the same size, and where items could be reordered with drag and drop. The Flutter team was tracking this issue, and while there were packages that addressed it for static lists, they hadn’t solved it for the ReorderableListView yet.
I went ahead and made version of their ReorderableListView that solves the performance issue and released it as an open source package.
It works by allowing the user to pass in a list of itemExtents, rather that just a single fixedExtent allowed by the basic flutter widget. This is similar to the way React-virtualized handles optimizing long variable extent lists. I implemented a speedy binary search to know pre-layout the pixel height of any given height. Perhaps the trickiest part was getting the drag and drop reordering to continue working as it should. It was tricky because in my optimized list, the items were positioned at exactly their calculated height, whereas in the basic ReorderableListView widget items are laid out on the fly directly under the previous item. So since the original widget creates a gap in the list during reorder using offsets, I had to readjust most of the offset logic.
Thanks for reading!
