还是这个地址 https://forum.cocos.com/t/2-0-5/69107/32
其中提到
带有很多ttf文字的界面发生颜色变换或者alpha变换时,会导致严重的渲染性能下降。是因为Label类的_updateColor函数中会被调用_updateRenderData,。从代码上看,根源是因为描边导致的。这个有没有办法优化?
目前我是让项目中所有的描边都是黑色,这样再把_updateColor中的_updateRenderData优化掉,就可以提升很多。代价就是只能用黑色描边。
目前发现有方法实现任意描边,并且提升性能。
几种改动:
-
CCNode.js的opacity的set中,把以下代码中的RenderFlow.FLAG_COLOR去掉:
opacity: { get () { return this._opacity; }, set (value) { if (this._opacity !== value) { this._opacity = value; this._renderFlag |= RenderFlow.FLAG_OPACITY | RenderFlow.FLAG_COLOR; } }, range: [0, 255] }, -
render-flow.js中的以下代码中的COLOR改为OPACITY:
let worldTransformFlag = _walker.worldMatDirty ? WORLD_TRANSFORM : 0;
let worldOpacityFlag = _walker.parentOpacityDirty ? COLOR : 0; -
engine/cocos2d/core/renderer/util/label/ttf.js中
以下代码要删除:_outlineColor.a = _outlineColor.a * comp.node.color.a / 255.0;以下的代码
_context.fillStyle = `rgba(${_color.r}, ${_color.g}, ${_color.b}, ${_color.a / 255})`;改为 _context.fillStyle =
rgb(${_color.r}, ${_color.g}, ${_color.b});
以下的代码_context.strokeStyle = `rgba(${_color.r}, ${_color.g}, ${_color.b}, ${_color.a / 255})`;改为_context.strokeStyle =
rgb(${_color.r}, ${_color.g}, ${_color.b});
综上所述,纹理重建非常花时间。当大量的文字界面做淡入淡出的时候,就会卡得不行。上面所有的改动,就是要优化掉因alpha变换导致的label组件的_updateColor调用的没有必要的纹理重建。这里改了渲染底层的dirtyFlag逻辑, 不知道会不会影响其它的地方。
引擎组一定要看看这个改动有没有副作用。