Mac·iOS开发IT/互联网

iOS-SDWebImage底层框架解析

2019-12-16  本文已影响0人  夜里昙花现

SDWebImage是iOS开发中一个常用的图片第三方框架,我们常会这样子在ImageView上去加载一张网络图片

 [_imageView sd_setImageWithURL:[NSURL URLWithString:@"图片url"] placeholderImage:[UIImage imageNamed:@"placeholder.png"]];

那你知道它加载图片的过程吗?

下面,我们先来看看SDWebImage官方是怎么解释这个框架的。
(如果点不开查看这里:https://github.com/SDWebImage/SDWebImage)

This library provides an async image downloader with cache support. For convenience, we added categories for UI elements like UIImageView, UIButton, MKAnnotationView.
这个库提供了一个支持缓存的异步图像下载器。为了方便,我们为UI元素添加了类别,比如UIImageView, UIButton, MKAnnotationView。

官方的解释很简洁,就是一个支持缓存的一部图像下载器,同时对UIKit做了一些扩展,方便使用。

我们通过上面链接下载了SDWebImage,大体看了下整个库,可以分为四部分:

到这里,我们大概的了解了SDWebImage整个框架。那回到之前的问题,它是怎么去加载一张网络图片的呢

- (void)sd_internalSetImageWithURL:(nullable NSURL *)url
                  placeholderImage:(nullable UIImage *)placeholder
                           options:(SDWebImageOptions)options
                      operationKey:(nullable NSString *)operationKey
             internalSetImageBlock:(nullable SDInternalSetImageBlock)setImageBlock
                          progress:(nullable SDWebImageDownloaderProgressBlock)progressBlock
                         completed:(nullable SDExternalCompletionBlock)completedBlock
                           context:(nullable NSDictionary<NSString *, id> *)context
{
  ...
}

在这个方法里我们可以看到里面有这样子一段代码:

id <SDWebImageOperation> operation = [manager loadImageWithURL:url options:options progress:combinedProgressBlock completed:^(UIImage *image, NSData *data, NSError *error, SDImageCacheType cacheType, BOOL finished, NSURL *imageURL) {
...            
}];

我们从这里再点进去可以看到

//通过key查询缓存中
NSString *key = [self cacheKeyForURL:url];
operation.cacheOperation = [self.imageCache queryCacheOperationForKey:key options:cacheOptions done:^(UIImage *cachedImage, NSData *cachedData, SDImageCacheType cacheType) {
...
}];

到这里,你有没有看到到一个方法[queryCacheOperationForKey...],如果你注意到了,这会儿是不是有一点点小明白了,别急,我们继续往下看,你是不是迫不及待的想从这个方法点进去看看它到底做了哪些操作,那我们一起来看看

//先从内存中查找图片
UIImage *image = [self imageFromMemoryCacheForKey:key];
//如果内存中没有找到,再从磁盘中查找
void(^queryDiskBlock)(void) =  ^{
...
@autoreleasepool {
            NSData *diskData = [self diskImageDataBySearchingAllPathsForKey:key];
            UIImage *diskImage;
            SDImageCacheType cacheType = SDImageCacheTypeNone;
            if (image) {
                // the image is from in-memory cache
                diskImage = image;
                cacheType = SDImageCacheTypeMemory;
            } else if (diskData) {
                cacheType = SDImageCacheTypeDisk;
                // decode image data only if in-memory cache missed
                diskImage = [self diskImageForKey:key data:diskData options:options];
                if (diskImage && self.config.shouldCacheImagesInMemory) {
                    NSUInteger cost = diskImage.sd_memoryCost;
                    [self.memCache setObject:diskImage forKey:key cost:cost];
                }
            }
            ...
        }
};
/**
tips:
这里为什么要要使用autoreleasepool呢?
因为这里会产生大量的临时变量,使用autoreleasepool可以更快的进行释放
*/

看到这里,你可能会疑惑,如果内存缓存和磁盘缓存中没有图片,SDWebImage又是怎么去处理的呢?
还能怎么处理,当然是去下载啦,我们回到上一层,也就是查询缓存的方法,来看看它的回调中又是怎么去操作的。

//通过key查询缓存中
NSString *key = [self cacheKeyForURL:url];
operation.cacheOperation = [self.imageCache queryCacheOperationForKey:key options:cacheOptions done:^(UIImage *cachedImage, NSData *cachedData, SDImageCacheType cacheType) {
...
 BOOL shouldDownload = (!(options & SDWebImageFromCacheOnly))
            && (!cachedImage || options & SDWebImageRefreshCached)
            && (![self.delegate respondsToSelector:@selector(imageManager:shouldDownloadImageForURL:)] || [self.delegate imageManager:self shouldDownloadImageForURL:url]);
  if (shouldDownload) {
    ...
    //进行图片下载
    strongOperation.downloadToken = [self.imageDownloader downloadImageWithURL:url options:downloaderOptions progress:progressBlock completed:^(UIImage *downloadedImage, NSData *downloadedData, NSError *error, BOOL finished) {
        ...
        //下载完成后对图片进行存储
        if (downloadedImage && finished) {
          if (self.cacheSerializer) {
            dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_HIGH, 0), ^{
              @autoreleasepool {
                NSData *cacheData = self.cacheSerializer(downloadedImage, downloadedData, url);
                [self.imageCache storeImage:downloadedImage imageData:cacheData forKey:key toDisk:cacheOnDisk completion:nil];
                }
              });
           } else {
                [self.imageCache storeImage:downloadedImage imageData:downloadedData forKey:key toDisk:cacheOnDisk completion:nil];
           }
         }
    }];
    ...
  }
}];

结束,整个图片的加载流程就是这样子的啦,是不是明白了?

我们来总结一下网络图片加载过程:查询图片缓存(内存缓存和磁盘缓存),如果在缓存中找不到图片,则调起网络接口进行图片下载并返回图片,除此之外,还需将图片保存到内存缓存和磁盘缓存中。

这里有一个值得注意的地方,SDWebImage是怎么将图片存储在内存缓存中,而且,为什么还要自己实现一个内存缓存类(SDMemoryCache),直接用NSCache不好吗?

@interface SDMemoryCache <KeyType, ObjectType> : NSCache <KeyType, ObjectType>
@end

它是继承自NSCache。我们知道,NSCache能够操作缓存,但它有一个问题,内存中的缓存数据什么时候清理不归NSCache管理,所以,当数据很多的时候,在下一个取值的时候,我们就没办法取到缓存了,所以,SDWebImage才会自己实现一个内存缓存类。
在SDWebImageCache.m中我们可以看到这样一段代码:

- (void)storeImage:(nullable UIImage *)image
         imageData:(nullable NSData *)imageData
            forKey:(nullable NSString *)key
            toDisk:(BOOL)toDisk
        completion:(nullable SDWebImageNoParamsBlock)completionBlock {
    ...
    // if memory cache is enabled
    if (self.config.shouldCacheImagesInMemory) {
        NSUInteger cost = image.sd_memoryCost;
        [self.memCache setObject:image forKey:key cost:cost];
    }
    ...
}
//---SDImageCacheConfig.h---
@property (assign, nonatomic) BOOL shouldCacheImagesInMemory; //默认值为YES

看到这里,我们是不是都明白了?也许会有人问,这样子岂不是有两分内存缓存?
答案是可能会有,换句话说,如果当我们通过objectForKey:去获取图片的时候,如果值为空,而我们又shouldUseWeakMemoryCache为YES,我们这时候可以直接拿到这个图片,不用再去请求一次,也就是以空间换区时间。
以上,也就是为什么SDWebImage要自己去实现一个内存缓存类的原因了。

这里,我们回到第一个问题,SDWebImage是怎么将图片存储在缓存中的?
我们再来看看上面那个方法

- (void)storeImage:(nullable UIImage *)image
         imageData:(nullable NSData *)imageData
            forKey:(nullable NSString *)key
            toDisk:(BOOL)toDisk
        completion:(nullable SDWebImageNoParamsBlock)completionBlock {
    ...
    //内存缓存
    if (self.config.shouldCacheImagesInMemory) {
        NSUInteger cost = image.sd_memoryCost;
        [self.memCache setObject:image forKey:key cost:cost];
    }
    //磁盘缓存
    if (toDisk) {
      ...
      [self _storeImageDataToDisk:data forKey:key];
    }
}

呐,大体就是这样子的,但看到这里,总感觉有点似懂非懂的样子?
那我们再来看看memCache它是什么?

@property (nonatomic, strong, nonnull) NSMapTable<KeyType, ObjectType> *weakCache; // strong-weak cache
//
self.weakCache = [[NSMapTable alloc] initWithKeyOptions:NSPointerFunctionsStrongMemory valueOptions:NSPointerFunctionsWeakMemory capacity:0];

NSMapTable?它是什么?
通过查找资料,我们了解到,NSMapTable有点类似于NSDictionary,只不过NSMapTable比NSDictionary提供了更多的内存语义。
通过上面代码我们可以看到,NSMapTable在alloc的时候,对key进行了strong设置,对value进行了weak设置,所以,当我们的对象被释放的时候,NSMapTable会自动删除key-value。
Tips:
NSMapTable 内存语义:assgin,copy,strong
NSDictionary 内存语义:NSCoping

- (void)setObject:(id)obj forKey:(id)key cost:(NSUInteger)g {
    [super setObject:obj forKey:key cost:g];
    if (!self.config.shouldUseWeakMemoryCache) {
        return;
    }
    if (key && obj) {
        // Store weak cache
        LOCK(self.weakCacheLock);
        // Do the real copy of the key and only let NSMapTable manage the key's lifetime
        // Fixes issue #2507 https://github.com/SDWebImage/SDWebImage/issues/2507
        [self.weakCache setObject:obj forKey:[[key mutableCopy] copy]];
        UNLOCK(self.weakCacheLock);
    }
}

看完这个,是不是豁然开朗,哈哈
最后,我们再来看一个磁盘缓存一个小小的点

- (void)_storeImageDataToDisk:(nullable NSData *)imageData forKey:(nullable NSString *)key {
    ...
    if (![self.fileManager fileExistsAtPath:_diskCachePath]) {
        [self.fileManager createDirectoryAtPath:_diskCachePath withIntermediateDirectories:YES attributes:nil error:NULL];
    }
    
    // get cache Path for image key
    NSString *cachePathForKey = [self defaultCachePathForKey:key];
    // transform to NSUrl
    NSURL *fileURL = [NSURL fileURLWithPath:cachePathForKey];
    
    [imageData writeToURL:fileURL options:self.config.diskCacheWritingOptions error:nil];
    ...
}

- (nullable NSString *)defaultCachePathForKey:(nullable NSString *)key {
    return [self cachePathForKey:key inPath:self.diskCachePath];
}

- (nullable NSString *)cachePathForKey:(nullable NSString *)key inPath:(nonnull NSString *)path {
    NSString *filename = [self cachedFileNameForKey:key];
    return [path stringByAppendingPathComponent:filename];
}

- (nullable NSString *)cachedFileNameForKey:(nullable NSString *)key {
    const char *str = key.UTF8String;
    if (str == NULL) {
        str = "";
    }
    unsigned char r[CC_MD5_DIGEST_LENGTH];
    CC_MD5(str, (CC_LONG)strlen(str), r);
    NSURL *keyURL = [NSURL URLWithString:key];
    NSString *ext = keyURL ? keyURL.pathExtension : key.pathExtension;
    // File system has file name length limit, we need to check if ext is too long, we don't add it to the filename
    if (ext.length > SD_MAX_FILE_EXTENSION_LENGTH) {
        ext = nil;
    }
    NSString *filename = [NSString stringWithFormat:@"%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%02x%@",
                          r[0], r[1], r[2], r[3], r[4], r[5], r[6], r[7], r[8], r[9], r[10],
                          r[11], r[12], r[13], r[14], r[15], ext.length == 0 ? @"" : [NSString stringWithFormat:@".%@", ext]];
    return filename;
}

磁盘缓存:
传建一个目录,为每一个缓存文件生成一个MD5文件名。
那SDWebImage今天就说道这里了,后面如果有时间,会围绕SDWebImageDownloader和SDWebImageDownloaderOperation来谈一谈SDWebImage的下载模块。

此致,谢谢博友们看完,如有不足,欢迎指正。

上一篇下一篇

猜你喜欢

热点阅读