cocoscreator 2.4.x版本 drawcall优化 第一期(掌握控制drawcall数量的必要知识)

1,测试环境

2,为何drawcall多会影响性能

3, 哪些组件支持渲染

4,影响drawcall的因素

5,一句话介绍如何减少drawcall

6,哪些渲染组件不会被渲染

7,减少drawcall的理论(放在第二期)

8,理论指导实践,实践印证理论,demo实操(放在第三期)

9,总结(放在第三期)

「测试环境」 :

1.Mac 系统

2.cocoscreator 2.4.x版本

「为何drawcall多会影响性能?」

Drawcall: 绘制调用,指cpu调用图形绘制接口命令gpu进行图形绘制

「每一次绘制前,CPU要准备绘制参数(状态)比如色彩通道(color filter),绘图方式(shader)等复杂的数据处理,然后Drawcall,如果有大量drawcall,cpu会很“忙”,而gpu的处理能力很强,这时他可能闲置,不能充分发挥应有的能力,导致性能下降。」

「哪些组件支持渲染:」 因为一个drawcall是一次cpu调用图形绘制接口命令 gpu进行图形绘制渲染的过程,所以需要了解cocoscreator中哪些组件支持渲染,才能更好的控制drawcall

**

  • !#en
  • Base class for components which supports rendering features.
  • !#zh
  • 所有支持渲染的组件的基类
  • @class RenderComponent
  • @extends Component
    */
    let RenderComponent = cc.Class({
    上面的注释介绍 RenderComponent是所有渲染组件的基类,就是说他的子类和孙子类的组件。。。都是支持渲染的组件 可以全局搜索引擎,知道 粒子, 动画,文字(label),遮罩(mask),运动轨迹(MotionStreak),精灵(Sprite),绘图(Graphics)地图(tiledmap)等等, 也可以在 cocoscreator界面 右侧添加组件 -》渲染组件查看

「影响drawcall的因素:」

1,层级(zindex)

2,材质(Material)(shander,贴图(纹理),混合模式(blend))。只有拥有相同材质的渲染节点 才可能进行批处理,贴图,shader 决定了材质,而层级则决定了相同的材质 是否能 进行合并处理 即合并网格(mesh) 合并drawcall.,

「一句话介绍如何减少drawcall:」 绘制状态的变化 是导致drawcall增多的 主要原因。cocoscreator认为要以深度(zindex)优先的方式对渲染组件进行渲染,并且cocoscreator认为相同的材质可以被批量渲染。所以具有相同材质的并且连续的渲染节点 可以合并渲染 减少drawcall.

「连续:」

1,层级相同添加顺序相邻,

2,层级不同 中间层级没有其他材质的渲染组件。比如 a的层级是1 b的层级是3 在 1-3层级之间没有其他材质的 渲染组件.

「影响drawcall的因素:」

「1,渲染节点(zindex)层级」

zIndex是节点的层级是用来对节点进行排序的关键属性,它决定一个节点 在兄弟节点之间的层级,和谁被优先渲染。

1) zIndex 的取值介于 cc.macro.M IN_ZINDEX 和 cc.macro.MAX_ZINDEX 之间

即 - math.pow(2,15). 和 math.pow(2,15)-1之间。

实际操作中一般是 -1 到 n n一般不会超过1000

2)父节点主要根据节点的 zIndex 和添加次序来排序,拥有更高 zIndex 的节点将被排在后面(后被渲染先被渲染的图在后被渲染的图下面),如果两个节点的 zIndex 一致,先添加的节点会稳定排在另一个节点之前。排在前面的节点先被渲染,也就是说两张图层级相同 先添加的会先被渲染 显示出来的结果是 在后被渲染的图的下面。

3)节点在 children 中的顺序决定了其渲染顺序。父节点永远在所有子节点之前被渲染

4)node节点放在Canvas或者父节点的zindex默认值是0

5)决定节点层级的另一个因素是siblingIndex 他的权重低于 zIndex 当我们在编辑器上编辑借点的时候 兄弟节点之间的zIndex相同,为什么会出现一个先被渲染一个后被渲染呢 ,就是因为 siblingIndex 不同,排在前面的siblingIndex要小一些后面的要大一些 最终后面的后选择然 层级就在 前面的上边。 也就是说 zindex 其决定性作用,zIndex相同 就比较siblingIndex来判定最终层级。

「2,材质」

1)纹理(贴图)

2)shander:渲染器,能够读懂的点和颜色的对应关系的程序,简单来说就是绘图的方式)

只有拥有相同材质的物体才可以进行批处理。因此,如果你想要得到良好的批处理效果,你需要在程序中尽可能地复用材质和物体。

如果你的两个材质仅仅是纹理不同,那么你可以通过 纹理拼合 操作来将这两张纹理拼合成一张大的纹理。一旦纹理拼合在一起,你就可以使用这个单一材质来替代之前的两个材质了。

「哪些渲染组件不会被渲染」

cocoscreator 认为 透明度 === 0. 或者 active = false 的渲染组件 不会被渲染。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,053评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,527评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,779评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,685评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,699评论 5 366
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,609评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,989评论 3 396
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,654评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,890评论 1 298
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,634评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,716评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,394评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,976评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,950评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,191评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,849评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,458评论 2 342

推荐阅读更多精彩内容