iOS高级开发

iOS高级开发

UI视图

图像显示原理

基本流程

图像显示是一个从数据处理（CPU/GPU）到临时存储（Frame Buffer），再到信号转换与读取（Video Controller），最终实现可视化输出（Monitor）的流水线过程。这个过程周而复始，以极高的速度运行，从而让我们看到流畅、动态的画面。

处理 (Processing)：中央处理器 (CPU) 负责进行逻辑运算和数据处理，它将图像生成的指令通过总线发送给图形处理器 (GPU)。GPU 是专门为处理图形计算而设计的芯片，它根据指令进行复杂的渲染计算，生成最终的图像数据（像素点阵列）。缓冲 (Buffering)：GPU 将渲染完成的图像数据（即一帧画面）写入到帧缓冲器 (Frame Buffer) 中。帧缓冲器是内存中的一块特殊区域，用于临时存储即将要显示的一整帧图像数据。读取与转换 (Reading & Converting)：视频控制器 (Video Controller) 会以固定的频率（例如每秒60次）持续地从帧缓冲器中读取图像数据。然后，视频控制器将这些数字信号转换为显示器能够识别的模拟信号（如VGA信号）或特定的数字信号（如HDMI、DisplayPort信号）。显示 (Displaying)：最终，显示器 (Monitor) 接收来自视频控制器的信号，并驱动屏幕上的像素点发光，从而将图像呈现给用户。

UIview本身只是负责用户交互，不负责绘制到屏幕

CALayer是Uiview的一个属性，是真正负责显示内容的底层对象。每一个 UIView 背后都有一个对应的 CALayer（即 layer属性）。

内容准备 (CPU 侧)：当需要显示内容时（例如，在 drawRect:方法中绘制“Hello World”文本或自定义图形），系统会创建一个 CALayer。CALayer 包含的视觉信息（如背景色、边框、以及最重要的 contents属性）被准备好。 contents通常是一个指向位图（bitmap）的指针。提交与打包 (Commit)：UIView 的变化（如修改了文本）会导致其对应的 CALayer 树发生变化。所有这些图层信息会被打包，并通过 Core Animation 这个渲染框架提交给 OpenGL (ES) / Metal（现代苹果系统已主要使用 Metal）。渲染与合成 (GPU 侧)：OpenGL (ES) / Metal 驱动 GPU 进行实际的渲染工作。这包括纹理合成、颜色混合、抗锯齿等复杂的图形计算。GPU 将最终计算好的所有图层合成为一帧完整的图像。显示 (Screen)：渲染完成的帧数据被送往屏幕的帧缓冲区。屏幕在下一个刷新周期读取缓冲区中的数据，最终将“Hello World”等画面显示出来。

CPU工作

GPU工作

UI卡顿、掉帧的原因

核心概念

VSync（垂直同步）：这是屏幕硬件的固定刷新信号。图中的每一根竖线都代表一次 VSync 信号。大多数屏幕的刷新率为 60Hz，这意味着它每秒会发送 60 次 VSync 信号，每次间隔为 16.7 毫秒。这个周期是固定不变的。

渲染流水线：为了在每次屏幕刷新时都能显示新的一帧画面，系统需要提前准备好数据。这个准备工作分为三个主要步骤：

CPU： 负责布局计算（Layout）、创建显示数据等。

GPU： 接收 CPU 的指令，进行纹理合成、渲染等操作。

Display： 将 GPU 渲染好的最终图像数据呈现在屏幕上。

原因分析（结合图片）

过程：在一个 VSync 周期内，CPU 或 GPU 的处理任务过于繁重（例如执行了复杂的布局、解码了大图片、进行了耗时的视图绘制），导致它们没能在这个16.7ms的周期内完成工作。结果：当 VSync 信号到来时，Display 没有拿到新帧，无法更新画面。系统只能继续显示上一帧的旧画面，这就造成了一次 “掉帧”。用户就会感觉到画面卡顿了一下。系统会跳过本次刷新，等待下一个 VSync 周期再尝试显示新帧。

总结

简单来说，UI卡顿和掉帧的直接原因就是：CPU 或 GPU 的“工作量”超过了16.7ms这个预算，没能准时交卷，导致屏幕无新内容可显示。

优化方案

面试官

针对UI卡顿、掉帧，基于Tableview都有哪些优化方案?