1. 什么是离屏渲染？

iOS 中对于图层的绘制遵循“画家算法”，对于叠加了多个 layer 的图形，会先绘制最底层的 layer，最后绘制顶部的 layer，底层的 layer 会被上层的覆盖。

“画家算法”示意图

一般情况下，图层被渲染完成后，会放入帧缓冲区，并依次显示在屏幕上。但对于某些特殊的图片数据，无法通过叠加图层的方法来达到预期效果。而当某些图片数据较复杂，无法一次性完成渲染时，会将每一步渲染的结果放入离屏缓冲区，最后组合渲染成所需要的效果，这就是离屏渲染。

2. 离屏渲染检测方法

勾选 Simulater -> Debug -> Color Off-screen Rendered，应用中产生离屏渲染的 view 会有浅黄色背景。

离屏渲染检测方法

3. 什么情况下会触发离屏渲染？

3.1 图片 + 背景色 + 圆角

按照“画家算法”，背景色和图片会依次渲染并叠加显示。但由于设置了圆角，且此时前两个图层已经显示在了屏幕上，不能对边角进行裁剪处理，无法达到圆角效果。此时，需要在各个图层显示在屏幕前，暂存于各个临时开辟的空间（离屏缓冲区），待所有图层渲染完成后，再一起进行圆角裁剪处理，最后显示在屏幕上。

image.png

// 离屏渲染示例代码：
UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
imageView1.image = [UIImage imageNamed:@"avatar"];
imageView1.backgroundColor = [UIColor blueColor];
imageView1.layer.cornerRadius = CGRectGetWidth(imageView1.bounds) / 2.0f;
imageView1.layer.masksToBounds = YES; // 或 imageView1.clipsToBounds = YES;
[self.view addSubview:imageView1];

3.2 开启了 shouldRasterize

关于 shouldRasterize，苹果官方文档解释如下：

When the value of this property is true, the layer is rendered as a bitmap in its local coordinate space and then composited to the destination with any other content.

即为 true 时，设置了该属性的 layer 会被渲染成位图。一般情况下，如果某个view 视图层级较为复杂，且需要不断复用或产生动画效果，可以将其 layer 的该属性设置为 true 以避免频繁重复渲染，提升性能。

3.3 mask(遮罩)

- (void)viewDidLoad {
    [super viewDidLoad];
    // mask
    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 200, 100)];
    view.backgroundColor = [UIColor redColor];
    view.center = self.view.center;
    [self.view addSubview:view];
    
    CALayer *maskLayer = [CALayer layer];
    maskLayer.frame = view.bounds;
    UIImage *maskImage = [UIImage imageNamed:@"2020"];
    maskLayer.contents = (__bridge id)maskImage.CGImage;
    view.layer.mask = maskLayer;
}

image.png

3.4 其它

设置高斯模糊、阴影、组透明度等。

4. 离屏渲染存在的问题

4.1 需要开辟额外的存储空间（最大不能超过），容易产生性能问题；
4.2 渲染时间增加，容易导致掉帧；
4.3 离屏缓冲区空间最大不能超过屏幕像素大小的 2.5 倍，且渲染完后 100ms 内没有被使用时会被丢弃，无法复用。