layer的光栅化可以将绘制完的位图缓存下来以减少GPU压力,在合适的时机使用效果十分显著
layer.shouldRasterize = true
关于光栅化的基础知识不了解的同学可以搜一下 百度传送门
真机测试
- 测试机型: iPhone X
- 测试机系统: iOS 13.3.1
- 测试方法: 在视图加载出来之后一直将20个Cell使劲滑到底部再马上滑到顶部,一直重复直至实验结束
- 测试视图:
每个Cell上有个橙色的UIView
,设置了阴影属性。
代码在文章尾部
1. Instruments - Core Animation 对比
shouldRasterize = false
shouldRasterize = true
2. 分析
从图中第二列帧率来看开启了光栅化后帧率比较稳定地处于59/60,而使用前的帧率在56/57左右
第三列的GPU使用率就更明显了,使用后稳定在25%左右,而使用前是83%左右
讨论
看起来光栅化效果非常好,但是如果错误地使用可能会导致更大地消耗。
具体某个视图应不应该开启,准确的实际测验最具有说服力,比如用Instruments里的Core Animatin跑一跑光栅化之后性能是否有提升。
此外,光栅化会缓存,也就意味着它要占据一些额外的内存,大量的光栅化也会对运行时内存造成一定压力
重要的一点是只在不频繁更新 每帧结果 的Layer上开启,否则会触发频繁的缓存刷新。
下图在cellForRowAt
方法中动态将上面例子中的阴影颜色设置为一个随机值
对比上面例子中开启光栅化,这里GPU使用率只提升了2%-3%变但是帧率相比还是降低了不少。因为虽然避免了每帧都去重新渲染,但是快速滑动的时候,频繁的触发了Cell的刷新所带来的阴影重新绘制以及缓存操作
对于性能优化方面来说,如果不知道光栅化好不好用,最简便的方法是用一张png来显示(如果这个图没有很大的话)
下图是把动态绘制的阴影背景用一张png代替之后,测试的结果
测试代码
import UIKit
let cellHeight = CGFloat(90)
let screenWidth = UIScreen.main.bounds.width
let screenHeight = UIScreen.main.bounds.height
class TestViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
let contentView = UITableView(frame: UIScreen.main.bounds, style: .grouped)
contentView.delegate = self
contentView.dataSource = self
contentView.register(TestTableCell.self, forCellReuseIdentifier: "Cell")
view.addSubview(contentView)
}
}
extension TestViewController: UITableViewDelegate, UITableViewDataSource {
func numberOfSections(in tableView: UITableView) -> Int {
return 1
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return 20
}
func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
return cellHeight
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) as! TestTableCell
cell.update(title: "Cell \(indexPath.row)")
return cell
}
}
class TestTableCell: UITableViewCell {
lazy var blockView: UIView = {
let view = UIView(frame: CGRect(x: 12, y: 6, width: screenWidth-24, height: cellHeight-12))
view.layer.shadowColor = UIColor.black.cgColor
view.layer.shadowOffset = CGSize(width: 10, height: 10)
view.layer.shadowRadius = 10
view.layer.shadowOpacity = 1
view.layer.shouldRasterize = true
view.backgroundColor = .orange
return view
}()
lazy var backgroundImageView: UIImageView = {
let view = UIImageView(image: UIImage(named: "fit"))
return view
}()
lazy var titleLabel: UILabel = {
let label = UILabel(frame: CGRect.init(x: 12, y: 20, width: 300, height: 20))
return label
}()
override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
super.init(style: style, reuseIdentifier: reuseIdentifier)
contentView.addSubview(blockView)
contentView.addSubview(titleLabel)
}
required init?(coder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
func update(title: String) {
blockView.layer.shadowColor = Int.random(in: 0...1) == 0 ? UIColor.blue.cgColor : UIColor.orange.cgColor
titleLabel.text = title
}
}