Asynchronously loading images into table and collection views

At a glance

Project structure

Async Image Loading/
├── TableViewController.swift
├── CollectionViewController.swift
├── Item.swift
├── ImageCache.swift
├── ImageURLProtocol.swift
└── AppDelegate.swift

Structure observations

• Table and collection screens deliberately duplicate only presentation setup; both use the same cache contract.
• Cache policy and simulated transport/cancellation are separate types.
• Mutable image content sits on stable-identity Item reference objects used by snapshots.

Overall architecture

flowchart LR
    Table["TableViewController"] --> Items["Item identities"]
    Collection["CollectionViewController"] --> Items
    Table --> Cache["ImageCache.publicCache"]
    Collection --> Cache
    Cache --> Memory["NSCache URL to UIImage"]
    Cache --> Inflight["URL to completion list"]
    Cache --> Session["URLSession"]
    Session --> Protocol["ImageURLProtocol"]
    Protocol --> Data["Delayed local file data"]
    Cache -->|main queue completion| Items
    Items --> Snapshot["Diffable snapshot reload"]

Reference code

Async Image Loading/ImageCache.swift:20 — the cache returns hits immediately and merges concurrent misses for the same URL into one completion list.

final func load(url: NSURL, item: Item,
                completion: @escaping (Item, UIImage?) -> Void) {
    if let cachedImage = image(url: url) {
        DispatchQueue.main.async { completion(item, cachedImage) }
        return
    }
    if loadingResponses[url] != nil {
        loadingResponses[url]?.append(completion)
        return
    }
    loadingResponses[url] = [completion]
    ImageURLProtocol.urlSession().dataTask(with: url as URL) { data, _, error in
        // decode, cache, and dispatch completions to the main queue
    }.resume()
}

Interpretation

Consumers request by URL but update by Item identity. The cache owns transport and deduplication; list controllers remain responsible for verifying the item is still in their current snapshot before mutating/reloading it.

Ownership and state

classDiagram
    ImageCache *-- NSCache : owns decoded images
    ImageCache *-- Dictionary : owns in-flight callbacks
    TableViewController *-- Array~Item~ : owns items
    CollectionViewController *-- Array~Item~ : owns items
    Item *-- UUID : stable identity
    Item o-- UIImage : current placeholder or result
    ListController *-- DiffableDataSource : owns
    URLSession *-- ImageURLProtocol : creates per request
    ImageURLProtocol *-- DispatchWorkItem : owns until completion or cancellation

Ownership evidence

Async Image Loading/ImageCache.swift:9 — one shared cache owns private decoded and in-flight state.

public class ImageCache {
    public static let publicCache = ImageCache()
    var placeholderImage = UIImage(systemName: "rectangle")!
    private let cachedImages = NSCache<NSURL, UIImage>()
    private var loadingResponses = [NSURL: [(Item, UIImage?) -> Void]]()
}

Class and protocol design

No app-defined protocol abstraction is present; URLProtocol subclassing supplies the transport substitution point.

Access control

Reference code

Async Image Loading/TableViewController.swift:9 — the screen exposes its diffable source to its own code but keeps the backing item collection private.

class TableViewController: UITableViewController {
    var dataSource: UITableViewDiffableDataSource<Section, Item>! = nil
    private var imageObjects = [Item]()
}

Logic ownership and placement

Design patterns

Naming conventions

• ImageCache names policy/ownership; ImageURLProtocol names the URL-loading adapter.
• publicCache explicitly signals shared scope; cachedImages and loadingResponses distinguish completed versus in-flight state.
• Item.identifier names stable identity, while image is the mutable presentation payload.

Architecture takeaways

• Centralize caching and coalesce requests by resource identity.
• Return async results with stable item identity, then confirm current snapshot membership before reloading.
• Keep backing item arrays private to the screen that owns its snapshot.
• Test latency and cancellation through a URL-loading substitution rather than UI sleeps.

Source map

• Official Apple documentation