Loading images in the background using CloudKit? - ios

Question

I'm working on an app in Swift that uses a UITableViewController with a fixed row height of 200. I have JPG images stored on CloudKit in a native resolution of 320 x 200. They range from around 25k to 45k apiece.
The issues I'm having is when the table populates, it loads up the 2-3 cells on the screen with the images and text, as it should. I'd like the rest of the cells to load in the background, since there are only a total of 12 entries. In the future there might be as many as 25-30.
As it's working now, when I begin scrolling, the proper text loads into the cells but the images lag a little and load in over the top of a previously display image.
From doing some reading, is this the result of the reusable cell? Is there a way to load all the cells in the background so it doesn't load the images only after I scroll?
Here's the code I've got:
override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
// Return the number of sections.
return 1
}
override func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
// Return the number of rows in the section.
return traders.count
}
override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as! CustomTableViewCell
if traders.isEmpty {
// come back here later
return cell
}
let trader = traders[indexPath.row]
if let traderDate = trader.objectForKey("modificationDate") as? NSDate {
//format date
var dateFormatter = NSDateFormatter()
dateFormatter.dateFormat = "EEE MMM dd hh:mm a"
var dateString = dateFormatter.stringFromDate(traderDate)
cell.dateLabel?.text = dateString
}
cell.nameLabel?.text = trader.objectForKey("StringAttribute") as? String
cell.placeLabel?.text = trader.objectForKey("Place") as? String
println(cell.placeLabel.text)
// Can we can get the image from cache?
if let imageFileURL = imageCache.objectForKey(trader.recordID) as? NSURL {
println("Got image from cache")
cell.traderImageView?.image = UIImage(data: NSData(contentsOfURL: imageFileURL)!)
} else {
// OK then, fetch the image from CloudKit in the background
let publicDatabase = CKContainer.defaultContainer().publicCloudDatabase
let fetchRecordsImageOperation = CKFetchRecordsOperation(recordIDs: [trader.recordID])
fetchRecordsImageOperation.desiredKeys = ["image", "detailImage"]
fetchRecordsImageOperation.queuePriority = .VeryHigh
fetchRecordsImageOperation.perRecordCompletionBlock = {(record:CKRecord!, recordID:CKRecordID!, error:NSError!) -> Void in
if (error != nil) {
println("Failed to get image: \(error.localizedDescription)")
} else {
if let traderRecord = record {
dispatch_async(dispatch_get_main_queue(), {
if let imageAsset = traderRecord.objectForKey("image") as? CKAsset {
cell.traderImageView?.image = UIImage(data: NSData(contentsOfURL: imageAsset.fileURL)!)
self.imageCache.setObject(imageAsset.fileURL, forKey: trader.recordID)
}
})
}
}
}
println("add operation")
publicDatabase.addOperation(fetchRecordsImageOperation)
}
println("return cell")
return cell
}
I'm assuming there must be a way to accomplish what I'm after, and pre-load all the cells with the images. I've contemplated storing the images as assets in the code itself (which I assume would load faster), but I really want access to change the images through the CloudKit dashboard without having to resubmit a new app each time I want to change an image.

Answer 1

You should look at the caching libraries, such as SDWebImage or FastImageCache. The lag appears due to several reasons - jpg decoding, loading from disk, some memory issues with Core Animation when the image is not aligned in memory.
I prefer to use FastImageCache, because it is awesome and boosts image loading incredibly. This benchmark shows a little advantage of it in case when image is already downloaded and persists on disk.