Skip to main content

Loading images asynchronously

There are a few details that need to be paid attention to when loading images from URLs in your Swift code:
  • loading and decoding the image on a background thread
  • updating the UIImageView on the main thread
  • not starting too many parallel downloads
  • cancelling downloads when images are not needed anymore
I recommend to use one of the two popular libraries that do the trick in just a few lines of code: SDWebImage or Kingfisher. Both are easy to get via CocoaPods and are quite similar in API and supported features.

SDWebImage

After adding the SDWebImage pod to the project:
pod 'SDWebImage'
Given an image view and a URL to load the image from, loading the image with an activity indicator is as simple as:
import UIKit
import SDWebImage

class ExampleViewController: UIViewController {
    
    @IBOutlet weak var imageView : UIImageView!
    
    // ...
    
    func loadImage() {
        let imageURL = URL(string: "https://upload.wikimedia.org/wikipedia/commons/1/15/Red_Apple.jpg")!
        imageView.sd_setShowActivityIndicatorView(true)
imageView.sd_setIndicatorStyle(.gray)
imageView.sd_setImage(with: imageURL)
    }
    
}

Kingfisher

Pretty much the same for Kingfisher:
pod 'Kingfisher'
Loading an image from an URL with activity indicator and displaying it in the image view:
import UIKit
import Kingfisher

class ExampleViewController: UIViewController {
    
    @IBOutlet weak var imageView : UIImageView!
    
    // ...
    
    func loadImage() {
        let imageURL = URL(string: "https://upload.wikimedia.org/wikipedia/commons/1/15/Red_Apple.jpg")!
        imageView.kf.indicatorType = .activity
imageView.kf.setImage(with: imageURL)
    }
    
}
There is a nice cheat sheet that demonstrates common cases like customizing the indicator or getting notified when downloads complete.

Differences between the libraries: SDWebImage vs. Kingfisher

  • SDWebImage supports progressive display of the image while loading is in progress via options: [.progressiveDownload] which is nice when loading larger images. This is not supported in Kingfisher as of now.
  • SDWebImage has support for Webp images included as a subspec that works out of the box, while for Kingfisher it’s an external plugin KingfisherWebP that requires extra configuration - for applications that have a lot of resources, webp helps delivering higher quality with shorter download times.
  • SDWebImage is implemented in Objective-C, Kingfisher in Swift 4.

Example project

Here is an example project that includes an example for both libraries which are included via CocoaPods:

Comments

Post a Comment

Popular posts from this blog

Swift GCD part 1: Thread safe singletons

Preview Singletons are entities, referenced to the same instance of a class from everywhere in your code. It doesn't matter if you like them or not, you will definitely meet them, so it's better to understand how they work. Constructing and handling a set of data doesn't seem to be a big challenge at first glance. The problems appear when you try to optimise the user experience with background work and your app starts acting weird. ??‍♂️ After decades of watching your display mostly with a blank face, you finally realize that your data isn't handled consistently by the manager because you're accessing it (running tasks on it) from multiple threads at the same time. So you really do have to deal with making your singletons thread safe. This article series is dedicated to thread handling using Swift. In the first part below you will get a comprehensive insight into som...
Post a Comment
Read more

Kiến thức cơ bản về RxSwift

Bài viết với mong muốn cung cấp thông tin cơ bản về kiến trúc, các thuật ngữ được sử dụng phổ biến về RxSwift, giúp những lập trình viên lần đầu làm quen RxSwift sẽ trở nên dễ dàng hơn. Trong bài viết có sử dụng một số từ khóa tiếng Anh, mình xin phép sẽ giữ nguyên bản không sử dụng tiếng Việt vì có lẽ sẽ dễ hiểu hơn cho người đọc. Observable Sequences Mọi hoạt động trong RxSwift từ việc đăng ký và xử lý sự kiện đều thông qua một Observable Sequences Trong RxSwift , các kiểu dữ liệu như Arrays , Strings hoặc Dictionary sẽ được convert sang Observable Sequences . Ta có thể tạo ra "Observable Sequences" của bất kỳ kiểu đối tượng nào tuân theo Sequence Protocol của Swift Standard Library . let helloSequence = Observable.just( "Hello Rx" ) let fibonacciSequence = Observable. from ([ 0 , 1 , 1 , 2 , 3 , 5 , 8 ]) let dictSequence = Observable. from ([ 1 : "Hello" , 2 : "World" ]) Đăng ký nhận event từ ""Observable Se...
Post a Comment
Read more

Thread safe singleton’s in Swift

What are singletons? — Singleton is design patterns which says that there should be only one instance of the class for the lifetime of the application. One the best example of Singleton is AppDelegate . How to write a singleton class ? class DefaultDict{ private var dict:[String:Any] = [:] public static let sharedManager = DefaultDict() private init(){ } public func set(value:Any,key:String){ dict[key] = value } public func object(key:String) -> Any?{ dict[key] } public func reset(){ dict.removeAll() } }   Testing singleton class under concurrent circumstances. We are going to write an example where we will set values in dict from various threads and even try to access some with different threads. When we do this we will encounter a crash. If you look closely it will be because of race condition and the crash will be on line set(value:Any,key:String) . class ViewController: UIViewController { ...
Post a Comment
Read more