标题
一、UITableView相关
1.1、重用机制
代码层
重用机制
重用示意图
重用示意图
1.2、数据源同步
资源竞争
解决方案
-
并发访问、数据拷贝
并发方案
-
串行访问
串行方案
二、事件传递与视图响应链
见文章事件传递与视图响应链
三、图像显示原理
总体图
分工
3.1、CPU工作
CPU工作
- Layout
UI布局、文本计算 - Display
绘制 - Prepare
图片编解码 - Commit
提交位图
3.2、GPU渲染管线
GPU渲染管线
四、UI卡顿&掉帧
4.1、UI卡顿&掉帧的原因
问题1：UI卡顿&掉帧的原因是什么？
UI卡顿&掉帧原因
解释
- 页面滑动流畅性是60FPS，指的是1s有60桢的画面更新，这样人眼看到的就是流畅效果。所以1/60秒(
16.7ms)就会产生一帧画面。 - 在这
16.7ms之内，需要CPU、GPU共同完成一帧的数据。 - 如果CPU + GPU处理时间 >
16.7ms，在下一个VSync信号到来之前，这一桢画面还没有准备好，由此产生了掉帧，看到的效果就是卡顿。
总结：在规定的16.7ms之内， 在下一个VSync信号到来之前，CPU、GPU并没有完成画面的合成，由此造成掉帧卡顿。
4.2、滑动优化方案
4.2.1、CPU
CPU
主要是将上面工作，全部放到
子线程中去做，节省CPU时间。
4.2.2、GPU
GPU
五、UI绘制原理&异步绘制
5.1、绘制原理步骤
绘制原理步骤
-
调用[UIVIew setNeedsDisplay]并没有发生视图的调用工作，而是在之后的某一时机发生，会在当前
runloop即将结束的时候，才调用[CALayer dispaly]进行图形绘制。 -
系统绘制流程
没有重写displayLayer方法，就用系统绘制流程。 -
异步绘制入口
只有重写了displayLayer方法，才会进入异步绘制流程。
5.2、系统绘制流程
系统绘制流程
5.3、异步绘制
异步绘制
- 实现了
displayLayer方法，就可以进行异步绘制。 - 代理负责生成
位图。 - 将
位图赋值给layer.contents。
异步绘制流程时序图
时序图
问题2：什么是异步绘制？
见上图解。
简单总结：
- 程序中某View调用
[setNeedsDisplay]➡️[CALayer dispaly]➡️某View重写displayLayer方法 - 在
displayLayer中生成位图，当前方法在子线程中进行。 - 在主队列中，将
位图赋值给layer.contents。
此时，就完成了UI控件的异步绘制过程。
六、离屏渲染
6.1、概念
概念
问题3：什么是离屏渲染？
- 当我们指定了UI视图的某些属性，标记为在
未预合成之前不能用于屏幕显示的时候，就会触发离屏渲染 。 -
离屏渲染的概念起源于GPU层面
GPU
问题4：离屏渲染何时会触发？
离屏渲染
问题5：为何要避免离屏渲染？
在触发离屏渲染的时候，会触发GPU工作量。而增加了GPU的工作量，有可能导致CPU + GPU耗时超过16.7ms，从而导致卡顿。
七、UI面试图总结
问题6：系统的UI事件传递机制是怎样的？
从事件传递流程回答，着重说hitTest:withEvent:和pointInside:withEvent:。
传递机制
问题7：使得UITableView滚动更流畅的方案和思路有哪些？
-
CPU
CPU
主要是将上面工作，全部放到子线程中去做，节省CPU时间。 -
GPU
GPU
问题8：UIView与CALayer之间的关系是怎样的？
- CALayer为UIView提供显示的内容，只负责内容显示，不参与事件处理。
- UIView作为CALayer的代理，提供交互操作；负责处理触摸事件，参与响应链。
网友评论