Magic of IGListKit, Part - 1

IGListKit is a data-driven UICollectionView framework for building fast and flexible lists made and maintain by Instagram. (full documentation here.)

Above is the architecture on which it works.
1. We need to create Adapter class object which handles the data flow into the sections.
2. We need to create each type of Section controller according to our requirement. The section controller handles each cells.
3. We can provide any type of data into a array and refresh the collection view as long as our data type conforms ListDiffable protocol.

I would not go into full implementation this time. you may read about them here:
1. https://medium.com/cocoaacademymag/iglistkit-migrating-an-uitableview-to-iglistkitcollectionview-65a30cf9bac9
2. https://www.raywenderlich.com/147162/iglistkit-tutorial-better-uicollectionviews

Honestly it was lil hard for me to understand and integrate this into my project for the first time. After lot of struggles I understood the core concept. I think the Instagram has put every thing at once which is in fact too much to understand in one go. we should understand the core concept of diffing algorithm first and then we would be able to appreciate their new architecture which handles collectionViews

Lets make things simple and not implement those adapter and section controllers. First let’s learn how we can use ListDiff in our existing project without changing much of existing code.

Suppose we have a UITableview which shows messages in a UIViewController.
We have a dataArray as stored property in the viewController which holds viewModel for each cell. For any change in this array we do tableView.reloadData() to see changes in UI.

first install IGListKit into the project and import IGListKit in code files.

pod 'IGListKit', '~> 3.0'

Our current ViewModel data structure is like

First step is to make this model conformed to ListDiffable. For that we need to change struct to class as this protocol is only for classes.
And implement two of its required method which are:

func diffIdentifier() -> NSObjectProtocol

and

func isEqual(toDiffableObject object: ListDiffable?) -> Bool

Q: Why two methods for diffing? 🤔
A: Actually one is for identity and other for equality.
The diff identifier uniquely identifies data (common scenario is primary key in databases). Equality comes into play when comparing the values of two uniquely identical objects (driving reloading).

So our Message model will become like this:

Now every time we get new data in ViewController we need to update our dataArray and we do reload tableview, but here we will calculate changes in indexPaths due to new data, any update or any deletion from the array.

IGListKit gives us a method to calculate these diffs, ListDiffPaths() . this method gives all changes in IndexPaths like inserts, deletes, updates

This will give tableView a smooth and safe data reload. Also we can set different animation (UITableViewRowAnimation) for each case if we want
(like fade, right, left, top, bottom, none, middle, automatic).

I guess this is enough to understand the first and most important part of IGListKit. I would cover rest part in future article where we would understand more about Adapter and SectionControllers.

If you think this was helpful please hit 🖐🏼 to make this article popular.

More on diffing algorithm:
1. Paul Heckel’s Diff research paper
2. Explanation of Paul Heckel’s Diff Algorithm
3. IGListKit’s doc on diffing
4. Swift port of IGListKit’s IGListDiff

Alternative diffing libraries:
1. https://github.com/mcudich/HeckelDiff
2. https://github.com/jflinter/Dwifft