图像基础知识
图像是人对视觉感知的物质再现。图像可以由光学设备获取，如照相机、镜子、望远镜及显微镜等；也可以人为创作，如手工绘画。图像可以记录、保存在纸质介质、胶片等等对光信号敏感的介质上。随着数字采集技术和信号处理理论的发展，越来越多的图像以数字形式存储。因而，有些情况下“图像”一词实际上是指数字图像。
与图像相关的话题包括图像采集、图像制作、图像分析和图像处理等。
图像分为静态影像，如图片、照片等，和动态影像，如影片等两种。
图像是一种视觉符号。透过专业设计的图像，可以发展成人与人沟通的视觉语言，也可以是了解族群文化与历史源流的史料。世界美术史中大量的平面绘画、立体雕塑与建筑，也可视为人类由古自今文明发展的图像文化资产。
计算机研究中一般是指 数字图像
通常，像素在计算机中保存为二维整数数组的光栅图像，这些值经常用压缩格式进行传输和储存。
数字图像种类：二值图像、灰度图像、彩色图像、假彩色图像、多光谱图像、thematic、立体图像、三维图像
数字图像显示：光栅图像格式：BMP、GIF、JPEG、PNG等。矢量图像格式：WMF、SVG等
DPI（dots per inch）分辨率：每英寸点数
像素 = 尺寸 * 分辨率
颜色空间：对相同颜色数值的解释方式。比如说一个像素的数据时(FF0000FF),在RGBA 颜色空间中，会被解释为红色，而在BGRA 颜色空间中，则会被解释为蓝色。解码之前一般要提取出颜色空间参数，保证解码前后图片颜色空间保持一致。
CoreGraphic支持的颜色空间类型：HSB、RGB、CMYK、BGR
图片的位深度: 用多少位二进制来 记录图片中像素的色值(位深度决定了像素点的 颜色种类)
常见的位深度有:
1位,也就是黑白照片,只有黑色和白色
4位,有2的4次幂种颜色,16种颜色
8位,2的8次幂表示，它含有256种颜色(VGA)
24位,2的24次幂种颜色,16777216种颜色(真彩色, SVGA)
32位,32位在24位基础上加了透明度,颜色数量和24位是一样的.
在24位图片中, 红、绿、蓝 ( RGB ) 三基色各以2的8次幂,也就是256种颜色而存在的,这也是为什么图片中三基色的色值都在0~255之间的原因了。另外，有一些图片格式的位深度是固定的，比如GIF只有256种颜色。
| 图片格式 | 定义 |
|---|---|
| BMP/Bitmap | 位图文件。非压缩图片格式，体积非常大。图片每个像素的原始信息在存储器中依次排列，可以不经过解码就直接被渲染到UI上。其他格式图片一般都需要先被解码为bitmap格式，然后才能渲染到界面上 。 |
| PNG | 这种格式可以用来存储任何位深的图片.通用性非常广,包括透明图片. GIF 和 PNG 对于具有大面积相同颜色的图像是最好的选择，因为它们使用的 (主要是基于游程长度编码的) 压缩算法可以减少存储需求。这种压缩是无损的，这意味着图像质量不会被压缩过程影响。压缩比有上限，和JPG、GIF相比，PNG 最大的优势在于支持完整的透明通道 |
| JPG | 互联网中常见的格式,该格式使用有损压缩来减少图片的大小,jpg文件不支持透明图片.JPEG 不适用于对比鲜明的图像 (如线条图)，其压缩方式对类似区域的图像质量损害会相对严重。如果某张截图中包含了文本，且保存为 JPEG 格式，就可以清楚地看到：生成的图像中字符周围会出现杂散的像素点。在大部分照片中不存在这个问题，所以照片主要使用 JPEG 格式。 |
| GIF | GIF只有256种颜色,图片质量相对JPG会大打折扣,但是GIF的优点是可以存储动图. |
| 矢量图。编译时创建对应屏幕大小的PNG。图片被拉伸的话图片展示就不清晰了（pdf对阴影和渐变的处理会存在失真的情况） | |
| SVG/SF Symbol | SVG是一种无损的矢量图，是众多矢量图中的一种，它的特点是使用XML来描述图片。使用XML的优点是，任何时候你都可以把它当做一个文本文件来对待，也就是说，你可以非常方便的修改SVG图片，你所需要的只需要一个文本编辑器。(iOS13开始，苹果推出了SF Symbol，一种svg格式的矢量符号集。而且苹果还提供了多于1500多种icon模板，我们可以在这里下载查看。) |
| HEIC | HEIC是HEIF（High Efficiency Image Format 高效率图像文件格式）的一种。它同时支持有损压缩、无损压缩、透明度等特性。(HEIC的目的就是作为JPEG的继任者，对于一些需要下载的大图可以转成HEIC格式，供客户端使用) |
| Live Photo | 一张HEIC封面图 + mov 格式视频(mov QuickTime 影片格式，由Apple研发的音频、视频文件格式，用于存储常用数字媒体类型)（PHLivePhotoView） |
| 图片格式 | 适用范围 | 注意事项 |
|---|---|---|
| png | 应用icon，界面icon，卡通风格的背景图 | 导入项目前可以使用ImageOptim进行压缩 |
| jpeg | 尺寸较大的风景图，照片 | 不支持透明度；因为可以调节压缩比，可以在大小和质量之间寻找最佳平衡。 |
| webp | 支持有损、无损压缩、透明度、动图等特性，因为苹果本身不支持一般只应用于服务端返回来的图片 | 无法在xcode预览，不建议内置该类型图片 |
| 字形，高分辨率的矢量图 | 存在展开尺寸较大，光效失真的情况 | |
| svg（sf symbol） | 指示性icon | 仅支持iOS13及以上，系统sf符号是有版权的，使用时要注意应用范围和苹果要求 |
sRGB 目前比较通用的全色彩图像色域，每个像素占4个字节。所以在iOS的实际使用中 图片实际占用的内存是 像素 * 4。一张分辨率很高的图片，展示时所消耗的内存会比图片实际的文件大小要大很多。（WWDC2018 图像最佳实践）
图片的格式
sRGB：这个是目前比较通用的全色彩图像色域，每个像素占 4 个字节
Wide：每个像素占 8 个字节，相比 sRGB 能表示的颜色更多
还有占内存更小的格式：
亮度和 alpha 8 格式：每像素 2 个字节，单色图像和 alpha，metal 着色器。
Alpha 8 格式：每个像素 1 个字节，用于单色图像，比 SRGB 小 75％
选择正确的格式可以减少了内存的使用。简单总结一下：
一个字节：Alpha 8
两个字节：亮度和alpha 8
四个字节：SRGB
八个字节：Wide 格式
那下一个话题来了，如何选择正确的格式呢？
选择正确的格式
简单的回答是：不需要你来选择格式，而是应该让格式选择你。是不是觉得一下子松了一口气？哈哈😆
用 UIGraphicsImageRenderer 代替 UIGraphicsBeginImageContextWithOptions
使用 UIGraphicsBeginImageContextWithOptions 生成的图片，每个像素需要 4 个字节表示。建议使用 UIGraphicsImageRenderer，这个方法是从 iOS 10 引入，在 iOS 12 上会自动选择最佳的图像格式，可以减少很多内存。
另外，如果想修改颜色，可以直接修改 tintColor，不会有额外的内存开销。(图片测试下 通过tintColor 和 iconfont占用的内存比较)
Downsampling
当你缩小一幅图像的时候，会按照取平均值的办法把多个像素点变成一个像素点，这个过程称为 Downsampling。
UIImage 在设置和调整大小的时候，需要将原始图像加压到内存中，然后对内部坐标空间做一系列转换，整个过程会消耗很多资源。我们可以使用 ImageIO，它可以直接读取图像大小和元数据信息，不会带来额外的内存开销。
页面上实际展示的ImageView 所占用的内存大小，图片本身的尺寸决定的，所以通过Downsampling 生成缩略图 来降低内存 。
通过Downsampling，我们成功地减低了内存的使用，但是解码同样会耗费大量的 CPU 资源。如果用户快速滑动界面，很有可能因为解码而造成卡顿。
解决办法：Prefetching + Background decoding
Prefetch 是 iOS10 之后加入到 TableView 和 CollectionView 的新技术。我们可以通过tableView(_:prefetchRowsAt:)这样的接口提前准备好数据。有兴趣的小伙伴可以搜一下相关知识。
至于Background decoding其实就是在子线程处理好解码的操作。（最好在单个同步队列中处理，否则线程切换的性能也比较差）
来源：
