移动端图片类型的支持情况
mobile_image_arch.png
Android 的图片编码解码是由 Skia 图形库负责的，Skia 通过挂接第三方开源库实现了常见的图片格式的编解码支持。目前来说，Android 原生支持的格式只有 JPEG、PNG、GIF、BMP 和 WebP (Android 4.0 加入)，在上层能直接调用的编码方式也只有 JPEG、PNG、WebP 这三种。目前来说 Android 还不支持直接的动图编解码。
iOS 底层是用 ImageIO.framework 实现的图片编解码。目前 iOS 原生支持的格式有：JPEG、JPEG2000、PNG、GIF、BMP、ICO、TIFF、PICT，自 iOS 8.0 起，ImageIO 又加入了 APNG、SVG、RAW 格式的支持。在上层，开发者可以直接调用 ImageIO 对上面这些图片格式进行编码和解码。对于动图来说，开发者可以解码动画 GIF 和 APNG、可以编码动画 GIF。
UIImage缓存是怎么回事？
通过 imageNamed 创建 UIImage 时，系统实际上只是在 Bundle 内查找到文件名，然后把这个文件名放到 UIImage 里返回，并没有进行实际的文件读取和解码。当 UIImage 第一次显示到屏幕上时，其内部的解码方法才会被调用，同时解码结果会保存到一个全局缓存去。在图片解码后，App 第一次退到后台和收到内存警告时，该图片的缓存才会被清空，其他情况下缓存会一直存在。
我要是用imageWithData能不能避免缓存呢？
不能。通过数据创建 UIImage 时，UIImage 底层是调用 ImageIO 的 CGImageSourceCreateWithData() 方法。该方法有个参数叫 kCGImageSourceShouldCache，在 64 位的设备上，这个参数是默认开启的。这个图片也是同样在第一次显示到屏幕时才会被解码，随后解码数据被缓存到 CGImage 内部。与 imageNamed创建的图片不同，如果这个图片被释放掉，其内部的解码数据也会被立刻释放。
怎么能避免缓存呢？
- 手动调用
CGImageSourceCreateWithData()来创建图片，并把kCGImageSourceShouldCache和kCGImageSourceShouldCacheImmediately关掉。这么做会导致每次图片显示到屏幕时，解码方法都会被调用，造成很大的 CPU 占用。（发现并不能避免缓存，效果同imageWithData一样，图片被释放掉，内部解码数据才会被释放）
代码是这样的：
- (UIImage *)createImageWithData:(NSData *)data {
CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFTypeRef)(data), NULL);
NSDictionary *dic = @{(id)kCGImageSourceShouldCache: @NO, (id)kCGImageSourceShouldCacheImmediately: @NO};
CGImageRef image = CGImageSourceCreateImageAtIndex(source, 0, (__bridge CFDictionaryRef)(dic));
UIImage *scaledImage = [UIImage imageWithCGImage:image];
CFRelease(source);
CGImageRelease(image);
return scaledImage;
}
1440 * 2560的jpg图片占用内存为：
屏幕快照 2018-07-16 下午4.21.53.png
- 把图片用
CGContextDrawImage()绘制到画布上，然后把画布的数据取出来当作图片。这也是常见的网络图片库的做法。
- (UIImage *)createDecodeCopy:(CGImageRef)imageRef {
size_t width = CGImageGetWidth(imageRef);
size_t height = CGImageGetHeight(imageRef);
CGImageAlphaInfo alphaInfo = CGImageGetAlphaInfo(imageRef) & kCGBitmapAlphaInfoMask;
BOOL hasAlpha = NO;
if (alphaInfo == kCGImageAlphaPremultipliedLast ||
alphaInfo == kCGImageAlphaPremultipliedFirst ||
alphaInfo == kCGImageAlphaLast ||
alphaInfo == kCGImageAlphaFirst) {
hasAlpha = YES;
}
CGBitmapInfo bitmapInfo = kCGBitmapByteOrder32Host;
bitmapInfo |= hasAlpha ? kCGImageAlphaPremultipliedFirst : kCGImageAlphaNoneSkipFirst;
//If `data' is NULL, the data for context is allocated automatically and freed when the context is deallocated
CGContextRef context = CGBitmapContextCreate(NULL, width, height, 8, 0, CGColorSpaceCreateDeviceRGB(), bitmapInfo);
if (!context) return NULL;
CGContextDrawImage(context, CGRectMake(0, 0, width, height), imageRef);
CGImageRef newImageRef = CGBitmapContextCreateImage(context);
UIImage *image = [UIImage imageWithCGImage:newImageRef];
//内存释放
CFRelease(context);
CGImageRelease(newImageRef);
return image;
}
3.用drawInRect绘制到画布
- (UIImage *)originalImage:(UIImage *)image scaleToSize:(CGSize)size {
UIGraphicsBeginImageContext(size);
[image drawInRect:CGRectMake(0, 0, size.width, size.height)];
UIImage *scaledImage = UIGraphicsGetImageFromCurrentImageContext();
//内存释放
UIGraphicsEndImageContext();
return scaledImage;
}
4.从网上搜到一种（RN的Image组件是用此方法进行解码）
- (UIImage *)createThumbnailImageWithData:(NSData *)data scaleToSize:(CGSize)size {
CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFTypeRef)(data), NULL);
CGFloat maxDimension = MAX(size.width, size.height);
NSDictionary *dic = @{(id)kCGImageSourceCreateThumbnailFromImageAlways: @YES, (id)kCGImageSourceThumbnailMaxPixelSize: @(maxDimension)};
CGImageRef image = CGImageSourceCreateThumbnailAtIndex(source, 0, (__bridge CFDictionaryRef)(dic));
UIImage *scaledImage = [UIImage imageWithCGImage:image];
CFRelease(source);
CGImageRelease(image);
return scaledImage;
}
方法2、3、4均选用一张1440 * 2560的jpg图片，从instruments查看内存占用情况
屏幕快照 2018-07-16 下午4.29.16.png
通过画布获取解码后的数据，并没有通过ImageIO进行解码，原始像素数据大小为1440 * 2560 * 4=14.06M，绘制到size为1440 * 2560的画布上，所占内存为1440 * 2560 * 4=14.06M，如果绘制到size为1024 * 1024的画布上，内存为1024 * 1024 * 4 = 4M，如图
屏幕快照 2018-07-16 下午4.33.55.png
关于内存占用的一些疑问
1、缓存没有体现，不知道从哪里可以看到
2、方法2、3会造成内存飙升，之后降下来。禁用方法2中的CFRelease()或方法3中的UIGraphicsEndImageContext()，上下文无法释放，内存泄漏，在CGImage中内存会一直存在，参考下图。猜测内存飙升是上下文所占内存（width * height * 4），当上下文释放后，内存才会降下来。
屏幕快照 2018-07-16 下午4.46.43.png
3、方法4并不会造成内存飙升，禁用
CFRelease()会发现物理内存占用变大，多占用的内存大小为图片的大小，如图（选用的一张尺寸为1440 * 2560，大小为1.9M的jpg图片）
屏幕快照 2018-07-16 下午5.06.12.png
网友评论