iOS

图片优化

2023-03-05  本文已影响0人  有大圆

图片格式

目前我们在app中使用的图片主要有png、Jp(e)g,gif、webp

有损压缩&无损压缩

有损压缩:保留图片的亮度相关信息,对图片的颜色进行压缩,合并相似的颜色值(例如:jpeg)

无损压缩:整个图片建立图片的索引,把颜色用索引替代保存,实际上保存了一个颜色索引表和索引的矩阵(png)

矢量图&位图

位图bitmap:存储的就是各个点的元素,清晰度和分辨率有关,放大之后会看到颜色块

                 大小计算  : height * width * 4

矢量图:保存的是具体的点和线,没有分辨率的概念,放大之后清晰度不受影响

图片的渲染过程

1、用户态下,先分配图片的内存

2、切换到内核态,从磁盘先拷贝到的内核态缓冲区

3、切换到用户态,从内核态的缓冲区拷贝到用户态的内存

4、runloop进入休眠之前,core Animation准备渲染,在commit到render service之前,cpu将图片解码成bitmap

5、提交到gpu进行渲染,其中步骤:顶点着色器、几何分析、光栅化、片元着色器、合并渲染,提交到frame buffer

6、从frame buffer拿到结果,显示在屏幕

图片对App性能的影响和解决办法

IO:

1、频繁的从磁盘读取图片:

可以使用缓存的策略,将最近使用的图片缓存起来

参考:SDWebImage、YYImage

主要是通过链表、NSCache来实现,LRU算法

对内存的影响:

1、大图读取的过程中,比较耗费内存

解决方法:使用MMap的方案解决

2、Gif图比较占用内存,可以做类似帧重用的策略,例如:YYImageView

网络

图片太大影响流量

1、按照图片大小去请求,例如:新闻类的APP,列表的缩略图和新闻详情用的一张图,大小不同,可以在请求的时候带上图片的 width、height 、scale等元素,服务端做压缩(加上缓存策略)

2、使用webp格式的图片,无损压缩比png小45%

      webview中的webp处理可以使用NSProtocol拦截,自己下载解码解决

CPU

主要是解码的影响

1、异步线程解码

2、下载的图片存储的时候就解码

GPU:

绘制的问题主要是避免离屏渲染的出现

包大小:

1、纯色的图标可以使用iconfont来替换

2、小图标用svg来实现

3、将图片放到 assets中,xcode会进行压缩,并且会把png转换为ios易于识别的格式

上一篇 下一篇

猜你喜欢

热点阅读