SDWebImage 4.x版本源碼分析(一)圖解!!!

本文分析的 SDWebImage 版本為4.3.2。可以來這里下載一下源碼注釋

一、為什么會出現SDWebImage?
二、SDWebImage不同版本的區別
三、SDWebImage的使用
四、解讀SDWebImage UML 類圖 和 流程圖
五、詳細的類的解析和該類的流程
- UIView+WebCache、SDWebImageManager
- SDWebImageDownloader
- SDWebImageCache
- SDWebImageDownloaderOperatiion
- 問題總結


一、為什么會出現SDWebImage?

SDWebImage作者 Olivier Poitrey

在SDWebImage 1.0版本的文檔里說,由于用網絡圖片對UITableView缺乏支持用起來很難受,Google一番后也沒有發現有哪個簡單的庫來為您執行異步圖像抓取+緩存工作。

于是他找了他的好朋友Sebastien Flory(Fraggle)尋求幫助,后來他發現用NSOperation類來管理并發,UITableView中圖片的加載響應速度提升很多。因此他重寫了Fraggle的實現。

二、SDWebImage不同版本的區別

2.x

  • 將UIImageView類圖像和緩存管理添加到Cocoa Touch框架的類別
  • 異步圖片下載器
  • 異步內存+磁盤映像緩存,并且自動處理過期的緩存圖片
  • 后臺圖像解壓縮
  • 保證相同的URL不會被多次下載
  • 保證偽造的URL不會一次又一次地重試
  • 保證主線程永遠不會被阻塞

3.x

  • 將UIImageView類圖像和緩存管理添加到Cocoa Touch框架的類別
  • 異步圖片下載器
  • 異步內存+磁盤映像緩存,并且自動處理過期的緩存圖片
  • 后臺圖像解壓縮
  • 保證相同的URL不會被多次下載
  • 保證偽造的URL不會一次又一次地重試
  • 保證主線程永遠不會被阻塞

新增功能:

  • 動畫GIF支持
  • WebP格式支持
  • 使用GCD和ARC
  • Arm64支持

4.x

  • 類別UIImageView,UIButton,MKAnnotationView添加Web圖像和高速緩存管理
  • 異步圖片下載器
  • 異步內存+磁盤映像緩存,并且自動處理過期的緩存圖片
  • 后臺圖像解壓縮
  • 保證相同的URL不會被多次下載
  • 保證偽造的URL不會一次又一次地重試
  • 保證主線程永遠不會被阻塞
  • 使用GCD和ARC

說明上看起來沒什么區別

從文件上看
新增

  • 緩存配置類 SDImageCacheConfig
  • 一堆Decoder類 對之前SDWebImageDecoder補充優化
  • 圖像變換類 SDWebImageTransition
  • category 新增功能調用接口
image.png
image.png

對于GIF圖的展示

  • 從4.0版本開始,我們依靠FLAnimatedImage來照顧我們的動畫圖像。
  • 要使用它,只需確保你我們FLAnimatedImageView而不是UIImageView。
  • 注意:有一個向后兼容的功能,所以如果你還在試圖加載GIF成UIImageView,它只會顯示第一幀為靜態圖像。
  • 重要提示:FLAnimatedImage僅適用于iOS平臺,因此對于所有其他平臺(OS X,tvOS,watchOS),我們將回退到上述向后兼容性功能

4.x支持

  • iOS 7.0或更高版本
  • tvOS 9.0或更高版本
  • watchOS 2.0或更高版本
  • OS X 10.8或更高版本
  • Xcode 7.3或更高版本

向后兼容性

三、SDWebImage的使用

安裝方法

// 必須
pod ‘SDWebImage'
// 可選 使用GIF
pod 'SDWebImage/GIF’
// 可選 使用WebP
pod 'SDWebImage/WebP’

使用

#import <SDWebImage/UIImageView+WebCache.h>

...

[imageView sd_setImageWithURL:[NSURL URLWithString:@"[http://www.domain.com/path/to/image.jpg](http://www.domain.com/path/to/image.jpg)"] placeholderImage:[UIImage imageNamed:@"placeholder.png"]];

四、解讀SDWebImage UML 類圖 和 流程圖

首先看一下UML圖

image.png
image.png
  1. 我們便于調用的類別依賴于UIView+WebCache,UIView+WebCache依賴于SDWebImageManager;
  2. SDWebImageManager 由 SDWebImageManagerDelegate、SDImageCache、SDWebImageDownloader 組成,聚合關系但不是強依賴;
  3. SDWebImageManager 依賴于 SDWebImageCombinedOperation,SDWebImageCombinedOperation實現了SDWebImageOperation的代理;
  4. SDImageCache 由 SDImageCacheConfig 組成,依賴 SDWebImageCodersManager;
  5. SDWebImageDownloader 依賴 SDWebImageDownloaderOperation、SDWebImageDownloadToken、SDWebImageCodersManager;
  6. SDWebImageCodersManager 由 SDWebImageWebPCoder、SDWebImageImageIOCoder、SDWebImageGIFCoder組成;
  7. SDWebImageCodersManager、SDWebImageGIFCoder 實現了 SDWebImageCoder 的代理,SDWebImageWebPCoder、SDWebImageImageIOCoder 實現了 SDWebImageCoder 的子類 SDWebImageProgressiveCoder 的代理;
  8. SDWebImageDownloaderOperation 繼承于 NSOperation ,并實現了SDWebImageDownloaderOperationInterface 、SDWebImageOperation的代理;
  9. SDWebImagePrefetcher 由SDWebImageManager 和 SDWebImagePrefetcherDelegate 組成;
  10. SDWebImage 聲明了 6個 Delegate。

在文件中的位置:


image.png

流程圖:


image.png

從流程圖上看,

  1. 通常我們使用 UIImageView+WebCache 里的方法來設置網絡圖片的;
  2. UIImageView+WebCache 的主要方法是調用 UIView+WebCache 里的方法;
  3. UIView+WebCache 負責給 UIImageView 設置圖片,
    ** 通過 SDWebImageManager 加載到圖片,
    ** 把得到的 image 設置給 UIImageView
  4. SDWebImageManager 溝通 SDImageCache 和 SDWebImageDownloader ,
    ** 首先通過 SDImageCache 查詢到是否有緩存的圖片;
    ** 接著如果需要下載,就通過 SDWebImageDownloader 下載圖片;
    ** 然后如果需要緩存,把圖片緩存給 SDImageCache ;

下一章,五、詳細的類的解析和該類的流程

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 227,488評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,034評論 3 414
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 175,327評論 0 373
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,554評論 1 307
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,337評論 6 404
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 54,883評論 1 321
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 42,975評論 3 439
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,114評論 0 286
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,625評論 1 332
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,555評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,737評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,244評論 5 355
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 43,973評論 3 345
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,362評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,615評論 1 280
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,343評論 3 390
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,699評論 2 370

推薦閱讀更多精彩內容