关于视图在切圆角时候的导致的性能下降的一些探讨

iOS 中有的时候我们控件要做成圆形 或者是切成圆角，这个时候我们一般都会使用.layer.cornerRadius  ->  clipsToBounds = YES 的属性来切，这样完全能达到我们的效果，但是如果一个界面上需要切圆角的控件很多，并且列表很长的时候，尤其是像 tableView 那样如果每一个 cell 上都有大量的控件需要切，那么就会非常卡顿，帧数严重下降 。其实原因就是这样设置会触发离屏渲染，比较消耗性能。注意：png 图片 UIImageView 处理圆角是不会产生离屏渲染的。（ios9.0 之后不会离屏渲染，ios9.0 之前还是会离屏渲染）。这里先说下离屏渲染： ###### iOS 的渲染机制： CPU 计算好显示内容提交到 GPU，GPU 渲染完成后将渲染结果放入帧缓冲区，随后视频控制器会逐行读取帧缓冲区的数据，经过可能的数模转换传递给显示器显示。GPU 屏幕渲染有以下两种方式： On-Screen Rendering 意为当前屏幕渲染，指的是 GPU 的渲染操作是在当前用于显示的屏幕缓冲区中进行。 Off-Screen Rendering 意为离屏渲染，指的是 GPU 在当前屏幕缓冲区以外新开辟一个缓冲区进行渲染操作。 由以上可以看出离屏渲染需要重新开辟新的缓存空间，必定要更加消耗资源。 通过查资料目前知道了设置了以下属性时，都会触发离屏绘制： shouldRasterize（光栅化） masks（遮罩） shadows（阴影） edge antialiasing（抗锯齿） group opacity（不透明） 复杂形状设置圆角等 渐变 我用一个现有的小 DEMO 来测试下，因为这个 demo 中没有切圆角，但是有阴影，一样可以出发离屏渲染，所以效果是一样的，在 tableView 中的自定义 cell 类中我设置了阴影如图：

使用 Instruments 测试得到当前帧数在二三十左右

同时屏幕是也出现了黄色图层

所有黄色的高亮的图层都进行了离屏渲染，也表示这些图层存在着问题，影响性能。而且帧数过低也会直接影响我们对 APP 的体验。

# 如何避免离屏渲染：

• 方法一：使用光栅化，.layer.shouldRasterize = YES;   ->  .layer.rasterizationScale=[UIScreen mainScreen].scale; 设置光栅化，可以使离屏渲染的结果缓存到内存中存为位图，使用的时候直接使用缓存，节省了一直离屏渲染损耗的性能。但是如果 layer 及 sublayers 常常改变的话，它就会一直不停的渲染及删除缓存重新创建缓存，所以这种情况下建议不要使用光栅化，这样也是比较损耗性能的。
• 方法二：最简单的方法，就是图片不作处理，直接覆盖一张中间为圆形透明的图片（推荐使用）这种方法 GPU 计算多层的混合渲染 blending 也是会消耗一点性能的，但比第一种方法还是好上很多的
• 方法三：Core Graphics 绘制圆角。这种方式 GPU 损耗最低，可以用 UIimageView 添加个点击手势当做 UIButton 使用。 UIGraphicsBeginImageContextWithOptions(avatarImageView.bounds.size, NO, [UIScreen mainScreen].scale); [[UIBezierPath bezierPathWithRoundedRect:avatarImageView.bounds cornerRadius:50] addClip];[image drawInRect:avatarImageView.bounds]; avatarImageView.image = UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext(); 这段方法可以写在 SDWebImage 的 completed 回调里，在主线程异步绘制。也可以封装到 UIImageView 里，写了个 DSRoundImageView。后台线程异步绘制，不会阻塞主线程。目前这种方法只用在 imageView 上，其他地方呢不知道怎么用，不过这种方法会耗费大量的 CPU 资源和占用内存，本人不太建议使用。

最后给大家测试下，因为我之前的 demo 没有切圆角，而是使用的阴影，所以我就用第一种方法给大家测一下。

然后运行，打开 Instruments，然后看屏幕

图层都是绿色没问题，我们再来看帧数，几乎到 60 ，效果很明显。

由此可见以后大家再切圆角的时候多注意下，刚才就研究了这么多，有什么问题及时与我交流吧。。。

UI 性能优化