如此高强度的项目压力下,争取一个月写一篇吧。之后估计会出一个基础补完系列,争取一个星期更一篇。此文章只是用来记录自己的学习过程,如有错误欢迎指正。
概述
在iOS中随处可见各种列表,如聊天列表,评论列表,视频列表等。用高端机跑一些内容简单的列表是不会感觉到任何的卡顿的。但在低端机上面,大厂和小作坊的列表流畅度的差距就显现出来了,优秀的代码在低端机上允许也如同高端机一样丝滑。
卡顿产生的原因
你可以理解为系统会定时向App发送一个信号,在显示之前,App主线程会在CPU中计算显示内容,比如视图的创建、布局计算、图片解码、文本绘制等。随后 CPU 会将计算好的内容提交到 GPU 去,由 GPU 进行变换、合成、渲染。随后 GPU 会把渲染结果提交到帧缓冲区去,当信号到来的时候,如果帧缓冲区没有东西,根据垂直同步,这一帧会被丢弃,等待下一次机会再显示,而这时屏幕会显示与之前相同的内容,从而造成了视觉上的卡顿。
那么无论是CPU还是GPU出现了问题 只要最终的结果没有渲染完成就会造成界面卡顿。所以开发的时候要同事兼顾CPU和GPU。
优化方案
既然知道CPU和GPU都有造成卡顿的可能,那么优化方案都是针对于CPU和GPU 减少计算时间,不让某一时间计算量暴增,避免一方爆炸一方很闲的情况,这些优化方案都是可行的。CPU消耗时间主要在:对象创建、对象调整、对象销毁、布局计算、自动布局、文本计算、图片的解码。GPU耗时主要在:纹理的渲染、视图的混合 、图形的生成。针对这几个方面进行优化,能大大提高列表的流畅度。
避免离屏渲染
在iOS中离屏渲染好像被提及的比较多,其原理可以百度,因为我也是百度知道的,我就不CV了,简而言之就是GPU新开辟了一块内存供CPU渲染,这是一种时间换空间的策略。离屏渲染的整个过程,需要多次切换上下文环境;等到离屏渲染结束以后,将离屏缓冲区的渲染结果显示到屏幕上有需要将上下文环境从离屏切换到当前屏幕。而上下文环境的切换是要付出很大代价的。
如何避免离屏渲染
- 避免设置layer的mask layer.mask
- 避免设置图层的投影 layer.shadow
- 图层的光栅化layer.ShouldRasterize
- 图层不为一层时 layer.maskToBounds = true
预排版
当我们从接口取得数据时,我们就应该计算出显示内容所需的高度并存储起来,视图布局的计算是CPU最耗时的地方,多次对frame、bounds进行调整非常消耗资源,因此,提前计算好最终布局,然后一次调整,而不是频繁调整这些属性。自动布局也是在显示前计算,而不是提前计算完成,对于复杂视图来说常常会产生严重的性能问题。
避免图层混合
我们开发中为了实现某种效果,常将图层像画布一样一层层叠起来,这样GPU需要一层层绘制,消耗了大量资源,为了减少GPU资源消耗,应将多层图层合成一层来显示,并适当的减少视图层数和和数量,并在不透明的视图中标明opaque属性以避免无用的Alpha通道合成。比如如果UIlabel的背景为纯色的话,应该给UIlabel设置背景色来避免图层混合。
更高效的异步图片加载
优秀的异步加载图片库 SDWebImage 已经可以满足大部分需求了,将图片全部存在内存中并加上动画可以避免异步加载时图片闪白。另外注意在显示图片的时候要避免图片被拉伸或被压缩,这在一定程度上也会造成性能的消耗。
写在后面的话
所有的优化都是为了提高CPU和GPU的计算速度的,所谓的优化就是在压榨硬件性能,但是硬件性能也有极限。产品总不可能让你在黑白电视上播彩色电影吧。