iOS离屏渲染

通过iOS图片渲染过程初探Core Animation渲染过程中我们简单的介绍了渲染的原理,在本章我们探讨下,渲染时常见的导致卡顿的现象:离屏渲染
图片或者视图的渲染流程:

element-Rendering.png

  • UIView或NSView的layer层有一个content,指向一块缓存,即backing store
  • UIView或NSView绘制时,会调用drawRect方法,通过context将数据写入backing store
  • 在backing store写完后,通过render server交给GPU去渲染,将backing store中的bitmap数据显示在屏幕上


    layer-structure.jpg

    如上图为CALayer的结构图,CALayer有三个视觉元素:背景色、内容和边框,其中,内容的本质在iOS是一个CGImage,在OS X是CGImage或NSImage

什么是离屏渲染

离屏渲染(Off-Screen Rendering):离屏渲染是相对于当前屏幕渲染来说的指GPU在当前屏幕缓冲区以外开辟一个缓冲区(离屏缓存区,即offscreen Buffer)进行渲染操作。
当前屏幕渲染(On-Screen Rendering):GPU的渲染操作是在当前用于显示的屏幕缓冲区进行。

为什么会产生离屏渲染

有些效果不能直接呈现到屏幕,而需要在缓冲区以外做额外的处理预合成。如图层属性的混合体没有预合成之前不能直接在屏幕中绘制,所以就需要屏幕外渲染。屏幕外渲染并不意味着是软件绘制,但它意味着图层必须在被显示之前在一个屏幕外上下文中被渲染(不论CPU还是GPU)。可以理解为显示的位图需要进行中间操作、汇合后,才能生成需要最终所需要的显示的位图并存入缓冲区,这样的场景就需要离屏渲染了。


Off-Screen Rendering.png

离屏渲染和卡顿

离屏渲染的代价很高,想要进行离屏渲染,首选要创建一个新的缓冲区,屏幕渲染会有一个上下文环境的一个概念,离屏渲染的整个过程需要切换上下文环境,先从当前屏幕切换到离屏,等结束后,又要将上下文环境切换回来,这也是为什么会消耗性能的原因了。虽然离屏渲染的性能消耗很大,但不是所有的离屏渲染都会导致卡顿。
在Core Animation 的渲染管线中我们知道每16.67ms就应该有一个位图被存入缓冲区,但是如果在16.67ms之内未能完成位图的生成工作,VSync 信号就不会被触发,此时屏幕不会去取新的缓冲区位图,就会停止在原视图,这就是卡顿产生的主要原因。离屏渲染被触发意味着位图生成时需要中间状态的位图并且需要多次汇合操作,是一个性能消耗大户,也是卡顿产生的重灾区。

哪些操作会产生离屏渲染?

  1. 为图层设置遮罩,即使用了mask的layer(layer.mask)
  2. shouldRasterize 光栅化
/* When true, the layer is rendered as a bitmap in its local coordinate
 * space ("rasterized"), then the bitmap is composited into the
 * destination (with the minificationFilter and magnificationFilter
 * properties of the layer applied if the bitmap needs scaling).
 * Rasterization occurs after the layer's filters and shadow effects
 * are applied, but before the opacity modulation. As an implementation
 * detail the rendering engine may attempt to cache and reuse the
 * bitmap from one frame to the next. (Whether it does or not will have
 * no affect on the rendered output.)
 *
 * When false the layer is composited directly into the destination
 * whenever possible (however, certain features of the compositing
 * model may force rasterization, e.g. adding filters).
 *
 * Defaults to NO. Animatable. */

Layer打开光栅化后会生成一个存放在离屏缓冲区的位图(“光栅化”),然后使用到了的时候将位图合成到目标中。所以打开光栅化一定触发离屏渲染。
光栅化shouldRasterize使用注意:

  • 如果Layer层不存在复用情景,则没必要设置光栅化属性;
  • 如果Layer层不是静态的,即需要频繁的修改,则没必要打开光栅化;
  • 离屏渲染缓存内容有时间限制,缓存内容在100ms内如果没有被使用,那么缓存内容会被丢弃,无法复用;
  • 离屏渲染缓存空间有限,超过2.5倍屏幕像素大小的位图,也不会被缓存,无法复用
  1. 需要进⾏裁剪的 layer (设置了layer.masksToBounds / view.clipsToBounds)
  2. 将图层layer.allowsGroupOpacity属性设置为YES且layer.opacity小于1.0
  3. 为图层设置了阴影(layer.shadow)
  4. 绘制了⽂字的 layer (UILabel, CATextLayer, Core Text 等)
  5. 使用CGContext在drawRect :方法中绘制大部分情况下会导致离屏渲染
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,348评论 6 491
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,122评论 2 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 156,936评论 0 347
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,427评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,467评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,785评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,931评论 3 406
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,696评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,141评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,483评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,625评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,291评论 4 329
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,892评论 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,741评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,977评论 1 265
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,324评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,492评论 2 348