iOS image caching. Libraries benchmark (SDWebImage vs FastImageCache)

photos_time_screen1. Introduction

In the past years, iOS apps have become more and more visually appealing. Displaying images is a key part of that, that’s why most of them use images that need to be downloaded and rendered. Most developers have faced the need to populate table views or collection views with images. Downloading the images is resource consuming (cellular data, battery, CPU, …), so in order to minimize this the caching model appeared.

To achieve a great user experience, it’s important to understand what is going on under the iOS hood when we cache and load images.

Also, the benchmarks on the most used image caching open source libraries can be of great help when choosing your solution.

2. Classical approach

  • download the images asynchronously
  • process images (scale, remove red eyes, remove borders, …) so they are ready to be displayed
  • write them on disk
  • read from disk and display them when needed
// assuming we have an NSURL *imageUrl and UIImageView *imageView, we need to load the image from the URL and display it in the imageView
if ([self hasImageDataForURL:imageUrl] {
  NSData *data = [self imageDataForUrl:imageUrl];
  UIImage *image = [UIImage imageWithData:imageData];
  dispatch_async(dispatch_get_main_queue(), ^{
    imageView.image = image;
  });
} else {
  [self downloadImageFromURL:imageUrl withCompletion:^(NSData *imageData, …) {
    [self storeImageData:imageData …];
    UIImage *image = [UIImage imageWithData:imageData];
    dispatch_async(dispatch_get_main_queue(), ^{
      imageView.image = image;
    });
  }];
}
FPS simple math: 
    • 60 FPS is our ideal for any UI update, so the experience is flawless
    • 60FPS => 16.7ms per frame. This means that if any main-queue operation takes longer than 16.7 ms, the scrolling FPS will drop, since the CPU will be busy doing something else than rendering UI.

3. Downsides of the classical variant:

  • loading images or any file from the disk is expensive (disk access is usually from 10.000 to 1.000.000 times slower than memory access. See comparison here. If we refer to SSD disks, those can come closer to RAM speeds (like 10 times slower), but at this point no smartphone or tablet is equipped with an SSD unit.
  • creating the UIImage instance will result in a compressed version of the image mapped to a memory section. The compressed image is small and cannot be rendered. If loaded from disk, the image is not even loaded into memory. Decompressing an image is also expensive.
  • setting the image property of the imageView in this case will create a CATransaction that will be committed on the run loop. On the next run loop iteration, the CATransaction involves (depending on the images) creating a copy of any images which have been set as layer contents. Copying images includes:
    • allocating buffers for file IO and decompression
    • reading disk data into memory
    • decompressing the image data (results the raw bitmap) – high CPU consumer
    • CoreAnimation uses the decompressed data and renders it
  • improper byte-aligned images are copied by CoreAnimation so that their byte-alignament is fixed and can be rendered. This isn’t stated by Apple docs, but profiling apps with Instruments shows CA::Render::copy_image even when the Core Animation instrument shows no images copied
  • starting with iOS 7, the JPEG hardware decoder is no longer accessible to 3rd party apps. This means our apps are relying on a software decoder which is significantly slower. This was noticed by the FastImageCache team on their Github page and also by Nick Lockwood on a Twitter post.

4. A strong iOS image cache component must:

  • download images asynchronously, so the main queue is used as little as possible
  • decompress images on a background queue. This is far from being trivial. See a strong article about background decompression
  • cache images into memory and on disk. Caching on disk is important because the app might be closed or need to purge the memory because of low memory conditions. In this case, re-loading the images from disk is a lot faster than downloading them. Note: if you use NSCache for the memory cache, this class will purge all it’s contents when a memory warning is issued. Details about NSCache here http://nshipster.com/nscache/
  • store the decompressed image on disk and in memory to avoid redoing the decompression
  • use GCD and blocks. This makes the code more performant, easier to read and write. In nowadays, GCD and blocks is a must for async operations
  • nice to have: category over UIImageView for trivial integration.
  • nice to have: ability to process the image after download and before storing it into the cache.
Advanced imaging on iOS

To find out more about imaging on iOS, how the SDK frameworks work (CoreGraphics, Image IO, CoreAnimation, CoreImage), CPU vs GPU and more, go through this great article by @rsebbe.

Is Core Data a good candidate?

Here is a benchmark of image caching using Core Data versus File System, the results are recommending the File System (as we are already accustomed to).

Just looking at the concepts listed above makes it clear that writing such a component on your own is hard, time consuming and painful. That’s why we turn to open source image caching solutions. Most of you have heard of SDWebImage or the new FastImageCache. In order to decide which one fits you best, I’ve benchmarked them and analysed how they match our list of requirements.

5. Benchmarks

Libraries tested:

Note: AFNetworking was added to the comparison because it benefits of disk caching from iOS 7 (due to NSURLCache).

Scenario:

- for each library, I made a clean install of the benchmark app, then started the app, scroll easily while all images are loaded, then scroll back and forth with different intensities (from slow to fast). I closed the app to force loading from disk cache (where available), then run the same scrolling scenario.

Benchmark app – project:

- the demo project source can be found on Github under the name ImageCachingBenchmark, together with the charts, collected data tables and more.
- please note the project from Github had to be modified as well as the image caching libraries so that we know the cache source of each image loaded. Because I didn’t want to check in the Cocoapods source files (not a good practice) and that the project code must compile after a clean install of the Cocoapods, the current version of the Github project is slightly different from the one I used for the benchmarks.
- if some of you want to rerun the benchmarks, you need to make a similar completionBlock for image loading for all libraries like the default one on SDWebImage that returns the SDImageCacheType.

Fastest vs slowest device results

Complete benchmark results can be found on the Github project. Since those tables are big, I decided to create charts using the fastest device data (iPhone 5s) and the slowest (iPhone 4).

iPhone 5s results

This slideshow requires JavaScript.

iPhone 4 results

This slideshow requires JavaScript.

Summary
Results SDWebImage FastImageCache AFNetworking TMCache Haneke
async download
backgr decompr
store decompr
memory cache
disk cache NSURLCache
GCD and blocks
easy to use
UIImageView categ
from memory
from disk
lowest CPU
lowest mem
high FPS
License MIT MIT MIT Apache Apache
Table legend:

- async download = support for asynchronous downloads directly into the library
- backgr decompr = image decompression executed on a background queue/thread
- store decompr = images are stored in their decompressed version
- memory/disk cache = support for memory/disk cache
- UIImageView categ = category for UIImageView directly into the library
- from memory/disk = top results for the average retrieve times from memory/disk cache

6. Conclusions

- writing an iOS image caching component from scratch is hard
- SDWebImage and AFNetworking are solid projects, with many contributors, that are maintained properly. FastImageCache is catching up pretty fast with that.
- looking at all the data provided above, I think we can all agree SDWebImage is the best solution at this time, even if for some projects AFNetworking or FastImageCache might fit better. It all depends on the project’s requirements.

About these ads

11 thoughts on “iOS image caching. Libraries benchmark (SDWebImage vs FastImageCache)

  1. Pingback: A Comparison Of Open Source iOS Image Caching Libraries

  2. Pingback: Benchmarking iOS Imaging Caching Libraries [iOS developer:tips];

  3. Thanks for this immensely useful benchmark Bogdan! I will be adding better image decompression to Haneke shortly (currently it only decompresses the image the first time), which hopefully should make it perform better.

    I didn’t understand what you meant by “from disk”. Would you mind clarifying this?

  4. No, this is a bit tricky. I tried explaining in the “Benchmark app – project” section. Libraries like FastImageCache or Haneke didn’t have a way to return the cache source like SDWebImage. SDWebImage setImageWithUrl:completed: works with a completion block like this: ^(UIImage *image, NSError *error, SDImageCacheType cacheType). I modified the code of FastImageCache, Haneke and TMCache to make their completion blocks return a cachetype. But I wouldn’t/shouldn’t commit that to each project. And since I didn’t want to add the Pods sources to the repo, I was left with the only option to remove that parts of the code so the project compiles. Basically in order to re-run the benchmarks one must make the same changes as I did.

  5. Pingback: Worthy iOS libraries | Yet another iOS Blog

  6. I don’t get it. From what I can see, Haneke doest better than most of the others. Why SDWebImage is best solution of all time? Please clarify, thanks.

  7. I agree Haneke performs very good, but there are some advantages of SDWebImage that win the fight for me:
    - background image decompression
    - supports iOS 6
    - is a mature project that is used by a lot of developers and is very robust (which can happen with Haneke if we give it support and time)

    • LRImageManager could be a competitive candidate, but I didn’t include it since I was looking at wide spread projects (500+ stars) with a good contributors lists.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s