这篇文章不会深究界面渲染原理和底层绘制机制,只讨论 iOS 中 UIImageView 的一些使用上的性能优化。Xcode 为我们提供了很多牛逼的性能检测工具,今天我们会使用模拟器自带的 UI 性能检测功能,来优化我们的 UIImageView 性能。
首先,我们得知道什么情况下会引发 UI 性能问题,才能针对性的去处理这些问题。
当我们给 UIImageView 设置带有 alpha 通道的图片(有透明度的 png 格式图片)的时候,当我们拉伸或者缩放图片去适应 UIImageView 显示的时候,并且有时候如果我们做用户头像的时候会用图层的 cornerRadius 属性设置圆角,让图片看起来更加美观,这些情况都会造成性能问题。我们使用模拟器来一一测试这些问题。
在模拟器 Debug 选项下面,有下图所示的几个选项:
Color Blended Layers (透明图片、混合模式)
这个选项基于渲染程度对屏幕中的混合区域进行绿到红的高亮,性能越差的区域就越红(也就是多个半透明图层的叠加)。由于重绘的原因,混合对 GPU 性能会有影响,同时也是滑动或者动画帧率下降的罪魁祸首之一。
Color Misaligned Images (尺寸拉伸、缩放)
会使用黄色高亮那些被压缩或者拉伸以及没有正确对齐到像素边界的图片(也就是非整型坐标),这些中的大多数通常会导致图片的不正常缩放,如果把一张大图当缩略图显示,或者不正确地模糊图像。
Color Copied Images (图片拷贝)
有时候寄宿图片(layer.content)的生成是由 Core Animation 被强制生成一些图片,然后发送到渲染服务器,而不是简单的指向原始指针,这个选项把这些图片渲染成蓝色。复制图片对内存和 CPU 使用来说都是一项非常昂贵的操作,所以应该尽可能的避免。
Color Offscreen-Rendered Yellow (离屏渲染)
这里会把那些需要离屏渲染的图层高亮成黄色,这些图层很可能需要用 shadowPath 或者 shouldRasterize 来优化。离屏渲染主要是针对 UITableViewCell 的优化,让还没有显示出来的 Cell 先绘制好。
混合模式
我们用两种方式加载同一张带 alpha 通道的透明图片,注意绘制图片的图片上下文也需要是不透明的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
|
override
func
viewDidLoad
(
)
{
super
. viewDidLoad
(
)
let image =
UIImage
( named :
"avatar"
)
let width : CGFloat = 150
let size =
CGSize
( width : width
, height : width
)
let x : CGFloat =
( UIScreen
. main
. bounds
. size
. width - width
) * 0.5
|