iOS-TableView卡顿、掉帧的原理及优化策略

NSLog(@"SHOW TIME");

一、图像显示原理

UIView内部有个CALayer层，用来绘制图像位图，如当创建一个内容为Hello world的UILabel文本时，contents就是一个绘制hello world的位图，系统会在合适的时机回调给我们drawRect方法，我们可以重写drawRect方法进行额外的内容绘制；绘制好的位图经过CoreAnimation框架提交给OpenGL进行渲染，从而显示到屏幕上。具体流程如下图1-1

                                                                                         图1-1 图像显示原理

 二、CPU的工作

- layout：进行UI布局、文本计算。

- display：进行绘制。drawRect:方法就发生在这一步。

- prepare：进行图片编解码。比如imageView图片是不能直接显示到屏幕的，需要经过解码。

- commit：通过CoreAnimation框架提交绘制好的位图给GPU进行之后的渲染。

三、GPU的工作

- 简单来说就是对CPU生成的位图进行渲染，显示到屏幕上。

四、卡顿、掉帧的原因

页面滑动的流畅性一般为60FPS，即每秒60帧，也就是说每帧画面更新需要1/60秒。只要在每帧时间内完成图像的显示就会是流畅的状态，这需要CPU和GPU共同完成，如果其中一方较为耗时就会导致位图生成和渲染的总时间超出每帧时长，就会造成掉帧卡顿的现象。如下图1-2

                                                                                图1-2 UI卡顿掉帧示意图

五、卡顿掉帧优化策略

由于是因为CPU和GPU工作耗时导致的卡顿掉帧，所以可以从CPU和GPU两方面来进行优化，减轻两者的耗时工作。

- CPU：将CPU的工作放置到子线程完成。如对象的创建、调整、销毁；layout布局计算、文本计算；文本的异步绘制、图片编解码。

- GPU：避免离屏渲染。视图的圆角设置、阴影、蒙版、光栅化都会造成离屏渲染增加GPU工作量，可通过CPU的异步绘制机制来完成这类操作，从而减轻GPU压力。

 

NSLog(@"END...");