Kingfisher源码浅析

作者: 直男程序员 | 来源:发表于2021-06-24 09:46 被阅读0次

Kingfisher源码浅析
Kingfisher源码解析之ImagePrefetcher
Kingfisher源码解析之使用
Kingfisher源码解析之Processor和CacheSe
Kingfisher源码解析之加载流程
SRWebSocket源码浅析（上）
SRWebSocket源码浅析（下）
Kingfisher Notes
Kingfisher源码阅读（三）
Kingfisher(I)

源码的阅读是提升编程技能的一种方法，怀着学习及忐忑的心情准备对喵神的Kingfisher库的源码进行下阅读和理解，提高下自己的整体编程思路以及良好编程习惯的养成，话不多说，现在开撸。
注：本文基于Kingfisher4.10.0版本

一、框架构成

1 kf组成

1.1.1 使用`Kingfisher`时候，.kf是使用最普遍的，其实提供的kf本质上市一个模板结构体`KingfisherWrapper`。

public struct KingfisherWrapper<Base> {
    public let base: Base
    public init(_ base: Base) {
        self.base = base
    }
}

1.1.2 通过协议配置到UI和String等上

模板结构体KingfisherWrapper通过协议 KingfisherCompatible配置到Image，ImageView，Button及 tvOS的TVMonogramView上, 协议 KingfisherCompatibleValue 配置到Data, String, CGSize上。

协议定义及extension：

/**
 A type that has Kingfisher extensions.
 */
public protocol KingfisherCompatible {
    associatedtype CompatibleType
    var kf: CompatibleType { get }
}

public extension KingfisherCompatible {
    public var kf: Kingfisher<Self> {
        return Kingfisher(self)
    }
}

extension Image: KingfisherCompatible { }
#if !os(watchOS)
extension ImageView: KingfisherCompatible { }
extension Button: KingfisherCompatible { }
#else
extension WKInterfaceImage: KingfisherCompatible { }
#endif

2. kf最普遍的在imageview的使用

1.2.1 在实际的开发中，我们使用最多的就是ImageView上的kf，示例代码如下：

let imageView = UIImageView()
imageView.kf.setImage(with: url)
// 带背景图片
let image = UIImage(named: "default_profile_icon")
imageView.kf.setImage(with: url, placeholder: image)

1.2.2 对应的实现在`ImageView+Kingfisher`文件中：

extension Kingfisher where Base: ImageView {}

1.2.3 其中最重要的方法就是setImage这个方法:

@discardableResult
    public func setImage(with resource: Resource?,
                         placeholder: Placeholder? = nil,
                         options: KingfisherOptionsInfo? = nil,
                         progressBlock: DownloadProgressBlock? = nil,
                         completionHandler: CompletionHandler? = nil) -> RetrieveImageTask{}

这个方法是根据KingfisherOptionsInfo作为配置，设置Resource和Placeholder，通过KingfisherManager.shared.retrieveImage方法下载数据的过程。

接下来一个个分析下这几个参数：

Resource：
Resource是一个协议，标志着图片来自网络，提供cacheKey和downloadURL，对应代码分析如下：

public protocol Resource {
    // 缓存的key
    var cacheKey: String { get }
    
    // 下载链接
    var downloadURL: URL { get }
}

/// ImageResource对应的结构体
public struct ImageResource: Resource {
    
    public let cacheKey: String
    
    public let downloadURL: URL
    
   // Create a resource.
    public init(downloadURL: URL, cacheKey: String? = nil) {
        self.downloadURL = downloadURL
        self.cacheKey = cacheKey ?? downloadURL.absoluteString
    }
}

/// URL实现该协议，将absoluteString作为缓存的Key
extension URL: Resource {
    public var cacheKey: String { return absoluteString }
    public var downloadURL: URL { return self }
}

Placeholder：
``Placeholder也是一个协议，提供在ImageView`上添加自身和移除自身的功能，对应代码分析如下：

public protocol Placeholder {
    
    func add(to imageView: ImageView)
 
    func remove(from imageView: ImageView)
}

其中Image和View都有对应的协议实现：

extension Placeholder where Self: Image {
    
    /// 设置imageview的image为自己
    public func add(to imageView: ImageView) { imageView.image = self }
    
    /// 将imageview的image设置为nil
    public func remove(from imageView: ImageView) { imageView.image = nil }
}

extension Placeholder where Self: View {
    
    /// 将自身即view覆盖到imageview上
    public func add(to imageView: ImageView) {
        imageView.addSubview(self)

        self.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            NSLayoutConstraint(item: self, attribute: .centerX, relatedBy: .equal, toItem: imageView, attribute: .centerX, multiplier: 1, constant: 0),
            NSLayoutConstraint(item: self, attribute: .centerY, relatedBy: .equal, toItem: imageView, attribute: .centerY, multiplier: 1, constant: 0),
            NSLayoutConstraint(item: self, attribute: .height, relatedBy: .equal, toItem: imageView, attribute: .height, multiplier: 1, constant: 0),
            NSLayoutConstraint(item: self, attribute: .width, relatedBy: .equal, toItem: imageView, attribute: .width, multiplier: 1, constant: 0)
            ])
    }

    /// 将自身移除
    public func remove(from imageView: ImageView) {
        self.removeFromSuperview()
    }
}

KingfisherOptionsInfo

KingfisherOptionsInfos是配置的数组，而KingfisherOptionsInfoItem是一个枚举，包含各种可以配置的信息，代码分析如下：

/// 配置的数组
public typealias KingfisherOptionsInfo = [KingfisherOptionsInfoItem]
let KingfisherEmptyOptionsInfo = [KingfisherOptionsInfoItem]()

/// 枚举
public enum KingfisherOptionsInfoItem {
    case targetCache(ImageCache) //设置缓存器，Kingfisher用这个缓存器来缓存展示的图片
    case originalCache(ImageCache) //设置缓存器，Kingfisher用这个缓存器来缓存下载的原始图片
    case downloader(ImageDownloader) //设置下载器，Kingfisher用这个下载器来下载数据
    case transition(ImageTransition) //设置下载完成之后的动画
    case downloadPriority(Float) //0.0~1.0 设置下载优先级
    case forceRefresh //忽视缓存
    case fromMemoryCacheOrRefresh //先尝试从内存缓存读取，如果没有，则重新下载，不会读取磁盘缓存
    case forceTransition //从缓存读取的图片也会进行动画处理
    case cacheMemoryOnly //只通过内存缓存图片
    case waitForCache //缓存完成之后才调用completion block
    case onlyFromCache  //只通过缓存读取图片，不会下载
    case backgroundDecode //使用图片前线在后台线程上解码
    case callbackDispatchQueue(DispatchQueue?) //设置回调在那个队列上
    case scaleFactor(CGFloat) // data转成Image时的Scale
   .....
}

至于 DownloadProgressBlock和CompletionHandler这两个下载进度闭包和完成的闭包，需要对KingfisherManager进行分析下了。

3. KingfisherManager(下载及缓存)

KingfisherManager为一个单例类，主要由两部分组成，ImageDownloader用于管理下载；ImageCache用于管理缓存。

public class KingfisherManager {
    
    public static let shared = KingfisherManager()
    
    // 缓存
    public var cache: ImageCache
    
    /// 下载
    public var downloader: ImageDownloader

    // 便利构造
    convenience init() {
        self.init(downloader: .default, cache: .default)
    }
    
    // 初始化
    init(downloader: ImageDownloader, cache: ImageCache) {
        self.downloader = downloader
        self.cache = cache

        let processQueueName = "com.onevcat.Kingfisher.KingfisherManager.processQueue.\(UUID().uuidString)"
        processQueue = DispatchQueue(label: processQueueName, attributes: .concurrent)
    }
}

1.3.1 其中主要的方法是`retrieveImage`，用于生成下载任务，代码分析如下：

   @discardableResult
    public func retrieveImage(with resource: Resource, //resource看前面的分析
        options: KingfisherOptionsInfo?, //配置信息
        progressBlock: DownloadProgressBlock?,
        completionHandler: CompletionHandler?) -> RetrieveImageTask //返回值为task
    {
        let task = RetrieveImageTask()
        let options = currentDefaultOptions + (options ?? KingfisherEmptyOptionsInfo)
        if options.forceRefresh {
              // 下载及缓存图片
            _ = downloadAndCacheImage(
                with: resource.downloadURL,
                forKey: resource.cacheKey,
                retrieveImageTask: task,
                progressBlock: progressBlock,
                completionHandler: completionHandler,
                options: options)
        } else {
            // 读出缓存中的图片
            tryToRetrieveImageFromCache(
                forKey: resource.cacheKey,
                with: resource.downloadURL,
                retrieveImageTask: task,
                progressBlock: progressBlock,
                completionHandler: completionHandler,
                options: options)
        }
        
        return task
    }

1.3.2 图片下载ImageDownloader

Source为ImageDataProvider的部分较为简单，就是调用ImageDataProvider的data方法获取Image，所以这里我们只讨论Source为Resource，也就是从网络上获取图片的部分。

下载图片的代码如下：

let downloader = options.downloader ?? ImageDownloader.default
guard let task = downloader.downloadImage(
    with: resource.downloadURL,
    options: options,
    completionHandler: cacheImage) else {
  return nil
}
return .download(task)

ImageDownloader是图片的下载器, 本类中需要注意的成员变量有如下几个：

网络请求的抽象：

private let sessionDelegate: SessionDelegate
private var session: URLSession
open var sessionConfiguration = URLSessionConfiguration.ephemeral {
  didSet {
    session.invalidateAndCancel()
    session = URLSession(configuration: sessionConfiguration, delegate: sessionDelegate, delegateQueue: nil)
  }
}

// 自定义证书的验证逻辑
// https://www.cnblogs.com/Code-life/p/7806824.html
open weak var authenticationChallengeResponder: AuthenticationChallengeResponsable?

二、收获总结

1. tyoealias运用

在编程中要善于使用`typealias`，例如在一个文件中大量使用同一个系统类时，就可以使用别名将其替换，这个后期修改这个类的话就简单多了。

2. 灵活使用protocol

在看完源码后，可以很清楚的看到里面灵活使用了多个协议，协议的使用使得代码更多解耦和灵活，特别是swift中对协议的extension，简直是协议的利器。

3. 一些配置信息可使用枚举的数组来灵活配置

遇到有多种情况，需要配置时候，可以使用枚举来定义不同的类型，通过一个数组和灵活配置这些信息。

4. kf 写法

在SnapKit中，view.snp是通过对View进行扩展实现的
类似snp的写法：

public var snp: ConstraintViewDSL {
        return ConstraintViewDSL(view: self)
    }

这种写法来为类添加一个不存在的属性

在KingFisher中，是通过泛型与协议结合的方式实现的：

/**
 A type that has Kingfisher extensions.
 */
public protocol KingfisherCompatible {
    associatedtype CompatibleType
    var kf: CompatibleType { get }
}

public extension KingfisherCompatible {
    public var kf: Kingfisher<Self> {
        return Kingfisher(self)
    }
}

extension ImageView: KingfisherCompatible { }
extension Image: KingfisherCompatible { }

Kingfisher源码浅析
源码的阅读是提升编程技能的一种方法，怀着学习及忐忑的心情准备对喵神的Kingfisher库的源码进行下阅读和理解，...
Kingfisher源码解析之ImagePrefetcher
Kingfisher源码解析系列，由于水平有限，哪里有错，肯请不吝赐教 Kingfisher源码解析之使用 Kin...
Kingfisher源码解析之使用
Kingfisher源码解析系列，由于水平有限，哪里有错，肯请不吝赐教 Kingfisher源码解析之使用 Kin...
Kingfisher源码解析之Processor和CacheSe
Kingfisher源码解析系列，由于水平有限，哪里有错，肯请不吝赐教 Kingfisher源码解析之使用 Kin...
Kingfisher源码解析之加载流程
Kingfisher源码解析系列，由于水平有限，哪里有错，肯请不吝赐教 Kingfisher源码解析之加载流程 K...
SRWebSocket源码浅析（上）
SRWebSocket源码浅析（上） SRWebSocket源码浅析（上）
SRWebSocket源码浅析（下）
SRWebSocket源码浅析（下） SRWebSocket源码浅析（下）
Kingfisher Notes
这篇文章已经对Kingfisher的源码分析的非常好了：Kingfisher源码阅读以下仅是自己一些学习笔记： ...
Kingfisher源码阅读（三）
上一篇地址：Kingfisher源码阅读（二）第一篇地址：Kingfisher源码阅读（一）上篇看完下载模块了，...
Kingfisher(I)
参考资料：源码阅读Kingfisher US