TTFLabel性能问题

Creator 2.x
#1

  • Creator 版本：2.1.0

  • 目标平台： iOS / Android / 微信小游戏

1、设置透明度

当一个界面拥有比较多的TTF字体的Label的时候，在start函数中初始化各label的内容后，对根节点添加FadeIn动画，在一些低端的手机上容易掉帧（动画不流畅）

阅读了一下源代码以及调试发现，设置透明度会导致ttf.js中updateRenderData函数被调用，其中_updateTexture函数内，会用到透明度来重新渲染贴图，估计就是性能问题的原因。

ttf.js  line  249
_context.fillStyle = `rgba(${_color.r}, ${_color.g}, ${_color.b}, ${_color.a / 255})`;

期望的解决方案：参考一下unity，颜色和透明度都可以靠顶点色来实现，这样除了文本内容发生变化需要刷新贴图，改变透明度或者颜色时，就不会有太大的性能问题，而且有利于将文本贴图缓存，所有字渲染到同一个大的缓存贴图里，还能减少Label的drawcall

2、contentDirty机制带来的问题

在start内对label设置内容后，FadeIn会卡，那换Scale总行了吧。但结果是，动画的第一帧会有比较大的延迟，（例如本来应该是0.1/0.2/0.3/0.4/0.5变化，但是实际上是0.3/0.4/0.5）。

对Label的内容进行设置之后，并不会立即计算内容，而是在下一帧渲染之前的visit里面（貌似是的吧）。那么start函数执行后，内容会在下一帧刷新，但是action已经添加了，如果刷新内容消耗的时间比较久，会导致动画掉帧。

目前的解决方法是，start内设置完内容，把根节点的scale设为0，用scheduleOnce在下一帧开始Scale动画。
期望的解决方案：Label给一个强制刷新内容的函数，在start内初始化时主动调用一次，可以避免需要在下一帧开动画的问题。

1赞