欲知前事如何，且看上回分解： iOS性能优化（初级）
小试牛刀
通过对性能初级优化秘籍一段时间的练习，少侠应该对性能优化有了一定的了解，在日常开发编码中有了些性能优化的意识，当产品小师妹提出一个新的交互的时候，想必也定难不倒少侠了。
就列表来说，icon、大标题、小标题、内容，一般APP的很多时候就是这几个元素，排版不同，细致效果不同。这些对于少侠来说都已经不是问题了，无声无息中APP已经如丝般顺滑。看着产品小师妹那敬仰的眼神，牛心潮澎湃，花前月下，海誓山盟马上就要脱口而出。
折戟沉沙
但，江湖风云变幻，折戟沉沙你早有准备。
只是没想到那一天来的这么快。
那一天产品小师妹提出了一个新的需求，除了之前的icon、大标题、小标题之外，现在要加上标签，标签有多个用于各种活动运营，标签的位置要根据标题内容的位置来定，标签要做成圆角加边框，同时列表每一行的高度要根据各项内容来最终确定，内容多就高，内容少就矮，还有icon要圆形加边框顺便带点阴影，巴拉巴拉巴拉巴拉巴拉巴拉。
产品小师妹一口气说了很多，说的你眼冒金星，气息紊乱，差点走火入魔，口吐鲜血，但看着小师妹那一如既往的欣喜加期待的眼神，只好暗暗运力，稳住阵脚，一口答应小师妹的需求。
伊人远去，看着小师妹远去的身影，你疯狂编码，但总有那么一个点无法突破，流畅性始终无法达到要求，不禁陷入了沉思。
卧薪尝胆
初级性能优化秘籍，只能应对初级的性能优化问题。但当前的需求，效果多，子视图多，排版更新频繁，高度每行不一样。初级秘籍已经不能很好的凑效，这可如何是好。
少侠莫慌，老夫看你已经熟练了初级性能优化秘籍，基础已经打牢，现在就将性能优化中级秘籍传授与你罢。
工欲善其事必先利其器，想要战胜对手，你要有趁手的兵器。
在APP里直接的观察看FPS数据：
KMCGeigerCounter
也可以根据 CADisplayLink 自己写一个简易好用的，CADisplayLink 是一个定时器，而且这个定时器的调用频率跟屏幕刷新频率相同。
顶级法宝，当属 Instrument：
若想熟练使用此项法宝，需注意两个地方
- 用release模式，贴近最真是的使用环境，才能获得最准确的数据。
- 用真机测试，模拟器再厉害也还是在模拟，祭出不同型号的真机，才能针对优化。
打开方式： Xcode -> Product -> Profile -> Core Animation 配合TimeProfile 一起使用
查看FPS的同时，还能查看到哪些操作比较耗时，有此傍身，再厉害的敌人也会露出破绽。
百步穿杨
性能优化的步骤：
修改 -> Instrument查看 -> 修改 -> Instrument查看 —> 修改.....
重复以上动作直到性能达到要求
CPU的耗时操作可以在Instrument里查看到，并定位修改优化，但GPU的优化要怎么进行呢？
XCode9之后可以Xcode -> Debug > View Debugging > Rendering 下看到优化的各个选项，模拟器时无法勾选，只有真机的情况下才能勾选。
- Color Blended Layers — 出现图层混合的地方会标注为红色，没有图层混合的地方会显示为绿色，方向是红色越少越好，绿色越多越好。
- Color Hits Green and Misses Red — 当使用光栅化渲染(shouldRasterize)的时候，如果图层是绿色，表示这些缓存被复用，如果图层是红色表示缓存没有被复用会重复创建，这时候会造成性能问题。
Color Copied Images — 如果GPU不支持当前图片格式，那么图片会交给CPU进行预先处理，这张图片会显示为蓝色。
Color Misaligned Images — 检测图片是否被拉伸，当图片色实际大小跟ImageView的大小不相同时，就会发生，显示为黄色，这种操作会比较消耗CPU资源。
Color Offscreen-rendered Yellow — GPU的渲染有两种，On-screen Rendering当前屏幕渲染，是指GPU的渲染在当前屏幕的缓冲区内进行。off-screen Rendering是指在GPU的渲染发生在当前屏幕之外新开辟的缓冲区。开辟新的缓冲区，切换缓冲区等会对性能有较大的影响。
触发离屏渲染有以下几种行为：
- cornerRadius以及masksToBounds同时使用时会触发离屏渲染，单独使用时不会触发。
- 设置shadow，而且shodowPath = nil时会触发。
- mask 设置蒙版会触发。
- layer.shouldRasterize的不适当使用会触发离屏渲染。
- layer.allowsGroupOpacity iOS7以后默认开启；当layer.opacity != 1.0且有subLayer或者背景图时会触发。
- layer.allowsEdgeAntialiasing 在iOS8以后的系统里可能已经做了优化，并不会触发离屏渲染，不会对性能造成影响。
- 重写了drawRect。
少侠熟读了以上招式，便能快速找出对手的破绽。
无坚不摧
找出了敌人的破绽，少侠还要制定详细的应对策略，瞅准时机，方能一招制敌。
老夫这就给你展示制敌之道：
-
Color Blended Layers：
- UIView的backgroundColor不要设置为clearColor，最好设置的和superView的backgroundColor颜色一样。
- 图片避免使用带alpha通道的图片，无论是本地图片还是后台返回图片。什么，设计妹子不同意，少侠这就要靠你的魅力啦。
Color Hits Green and Misses Red： 在初级性能优化中，适当使用shouldRasterize中有详细讲解。
Color Copied Images： 开发过程中注意图片格式
Color Misaligned Images： 尽量把图片大小设置的和UIImageView相同大小。
Color Offscreen-rendered Yellow： 这是性能优化的要点，针对引起离屏渲染的各种情况需要逐一应对
重点来了，离屏渲染的优化招式，少侠看仔细了
- 设置圆角cornerRadius：
UIView： 如果view.layer.contents 为空，直接通过设置view.layer.cornerRadius 以及 view.backgroundColor或者view.layer.border即可设置圆角，不需要设置masksToBounds为YES，此时不会产生离屏渲染。
//设置圆角边框
view.layer.cornerRadius = 3.0
view.layer.borderColor = UIColor.red.cgColor
view.layer.borderWidth = 1.0
// 设置带背景
view.layer.cornerRadius = 3.0
view.backgroundColor = UIColor.green
//或者相同效果的
view.layer.backgroundColor = UIColor.green.cgColor
UILabel： 设置和UIView差不多，有一个区别就是设置label.backgroundColor和layer.cornerRadius不会起效果，需要设置label.layer.backgroundColor和layer.cornerRadius才会起效果。
//设置圆角边框
view.layer.cornerRadius = 3.0
view.layer.borderColor = UIColor.red.cgColor
view.layer.borderWidth = 1.0
UITextField： 自带圆角效果，设置不同style即可达到效果。
UITextView： 和UIView的设置方法相同。
UIImageView： UIImageView的情况比较特殊，上面的几种方法不能实现圆角，必须要layer.cornerRadius和layer.masksToBounds = YES，才能实现圆角。但这个操作必定会产生离屏渲染，为了避免离屏渲染，常用的优化方法有：
-
重绘图片，生成一张带圆角的图片，然后设置到UIImageView上。
func redrawImage(originImage: UIImage, rectSize: CGSize, cornerRadius: CGFloat) -> UIImage? { UIGraphicsBeginImageContextWithOptions(rectSize, false, UIScreen.main.scale) if let context = UIGraphicsGetCurrentContext() { let rect = CGRect(origin: CGPoint.zero, size: rectSize) let path = UIBezierPath(roundedRect: rect, byRoundingCorners: .allCorners, cornerRadii: CGSize(width: cornerRadius, height: cornerRadius)) context.addPath(path.cgPath) context.clip() originImage.draw(in: rect) context.drawPath(using: .fillStroke) let roundedImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return roundedImage } return nil } DispatchQueue.global(qos: .default).async { //在子线程调用redrawImage生成图片 DispatchQueue.main.async { //在主线程设置图片 } } -
在UIImageView上遮盖一张部分透明的，部分遮挡的图片，盖在原来的UIImageView上，曲线实现图片圆角功能。
//生成中间透明 周围遮挡的图片 func getRundedCornerImage(radius: CGFloat, rectSize: CGSize, fillColor: UIColor) -> UIImage? { UIGraphicsBeginImageContextWithOptions(rectSize, false, UIScreen.main.scale) if let currentContext = UIGraphicsGetCurrentContext() { let rect = CGRect(origin: .zero, size: rectSize) let outerPath = UIBezierPath(rect: rect) let innerPath = UIBezierPath(roundedRect: rect, byRoundingCorners: .allCorners, cornerRadii: CGSize(width: radius, height: radius)) currentContext.setBlendMode(.normal) fillColor.setFill() outerPath.fill() currentContext.setBlendMode(.normal) innerPath.fill() let roundedCornerImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return roundedCornerImage } return nil } //将生成的图片 加到需要圆角的图片的上方 -
设置阴影shadow：
设置shadowPath，可以解决离屏渲染问题。
self.shadowView.layer.shadowColor = UIColor.gray.cgColor self.shadowView.layer.shadowOpacity = 0.2 self.shadowView.layer.shadowRadius = 3.0 self.shadowView.layer.shadowOffset = CGSize(width: 1, height: 1) self.shadowView.layer.shadowPath = UIBezierPath(rect: view.bounds).cgPath当然和圆角的解决办法一样，可以使用一张带阴影的图来曲线解决问题。
func getRundedCornerShadowImage(originImage: UIImage, rectSize: CGSize, roundedRadius: CGFloat, shadowColor: UIColor, shadowOffset: CGSize, insetX: CGFloat, insetY: CGFloat) -> UIImage? { UIGraphicsBeginImageContextWithOptions(rectSize, false, UIScreen.main.scale) if let currentContext = UIGraphicsGetCurrentContext() { let rect = CGRect(origin: .zero, size: rectSize) let shadowPath = UIBezierPath(roundedRect: rect.insetBy(dx: insetX, dy: insetY), byRoundingCorners: .allCorners, cornerRadii: CGSize(width: roundedRadius, height: roundedRadius)) currentContext.setShadow(offset: shadowOffset, blur: roundedRadius, color: shadowColor.cgColor) currentContext.addPath(shadowPath.cgPath) shadowPath.fill() let imagePath = UIBezierPath(roundedRect: rect.insetBy(dx: insetX, dy: insetY), byRoundingCorners: .allCorners, cornerRadii: CGSize(width: roundedRadius, height: roundedRadius)) currentContext.addPath(imagePath.cgPath) currentContext.clip() originImage.draw(in: rect.insetBy(dx: insetX, dy: insetY)) currentContext.strokePath() let image = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return image } return nil } -
设置蒙版mask：
设置mask必定会触发离屏渲染。
mask的过程大致来看是和视图混合相反的过程，例如有一张图片，中间有一个圆形空间是透明的，边缘部分是白色，如果视图直接叠加在一张头像上，会呈现出圆形头型的效果，但如果使用mask则会显示出中间白边缘透明的效果。
所以性能敏感的界面中，可以不使用mask，而使用视图混合这种对性能影响更小的方式进行操作。
-
layer.allowsGroupOpacity、layer.allowsEdgeAntialiasing：
这两个操作对性能并不会造成比较大的影响。
-
drawRect：
drawRect会造成较大的内存消耗，并会造成离屏渲染，应尽量避免重写。
炉火纯青
以上招式，少侠可看好了，日后定当好好练习，获得伊人芳心指日可待。
快去找小师妹去罢。
欲知后事如何，且看下回分解： iOS性能优化（中级+）: 异步绘制
