Implementing iOS Collection View with Efficient Rendering Mechanism
Article Summary
Tokopedia's iOS team was crashing on UICollectionView batch updates. Their solution? Build a better abstraction inspired by Instagram and SwiftUI.
The engineering team at Tokopedia faced performance issues with dynamic layouts using UICollectionView's performBatchUpdates. Wrong indexPaths caused crashes, and reloadData was too slow for complex UIs with hundreds of cells.
Key Takeaways
- Switched from UICollectionView to Texture's ASCollectionNode for background thread rendering
- Built ListNode: a wrapper that automates diffing and eliminates manual indexPath management
- Diffing algorithm calculates inserts, deletes, updates, and moves automatically
- API inspired by IGListKit and SwiftUI List for easier future migration
- Prevents NSInternalInconsistencyException crashes from incorrect batch updates
ListNode abstracts away the complexity of performBatchUpdates by automatically calculating cell changes through diffing, making ASCollectionNode as simple to use as SwiftUI's List.
About This Article
Tokopedia's iOS developers kept running into NSInternalInconsistencyException crashes when they manually defined indexPaths for performBatchUpdates. The problem was that incorrect section counts or cell operations would crash the entire collection view during dynamic layout updates.
Kensen Tjoa's team built ListNode to handle this automatically. It uses diffing to compare old and new data sets, which means developers no longer have to manage indexPaths by hand. The tool calculates inserts, deletes, updates, and moves on its own.
ListNode made things simpler by removing several manual tasks. Developers no longer need to register cells, dequeue reusable cells, or calculate cell sizes. These were the kinds of tasks that previously required careful coordination to avoid crashing during batch updates.