Createjs：将鼠标悬停添加到容器减慢FPS

Question

链接1 - http://horebmultimedia.com/Sam3/ 链接2 - http://horebmultimedia.com/Sam5/

在上面的链接中，我在每个文件的单独容器中添加了一组数字，你可以在右上角找到FPS。问题是当我在这个链接1中鼠标悬停并点击任何数字时，因为你看到FPS变得越来越慢＆amp;慢，使世界在左侧旋转得更慢。

在这个链接上，链接2，我只添加了一个鼠标和5个鼠标，但是FPS没有太大区别，为什么当我有37个容器时它会落后太多。如果你需要解决，我可以提供我的代码。

Answer 1

我仔细研究了您的代码，但是挖掘整个项目并不是调试优化问题的绝佳方法。

首先要考虑的是，如果您在舞台上启用了mouseOver，我建议您在互动元素上自由使用mouseChildren=false，并在任何非互动元素上使用mouseEnabled=mouseChildren=false。翻转可能是一个很大的原因，因为它需要每秒绘制20次（在您的使用中）。重绘文本和向量可能很昂贵。

// Non-interactive elements (block all mouse interactions)
element.mouseEnabled = element.mouseChildren = false;

// Interactive elements (reduce mouse-checking children individually)
element.mouseChildren = false;

如果他们没有改变，您可以考虑缓存文本元素或按钮图形。我想我在源代码中看到了一些缓存 - 但它通常是一件好事。

-

话虽如此，调试优化可能很难。如果删除所有按钮可以提高性能，请考虑按钮的构造方式以及成本。 *鼠标悬停很贵 *矢量和文字可能很昂贵 *如果使用正确，缓存可以提供帮助，但如果经常发生则可能很昂贵。 *查看tick（）上发生的事情。有时候，代码会不断运行，而这并不是必需的。

-

其他几点说明：

• 这不符合您的想法：_oButton.off("mousedown"); - 您需要传递on()电话的结果。如果您只是打扫卫生，请致电_oButton.removeAllEventListeners()。

• 您不需要将光标设置在mouseover上。光标只有在翻转时才会改变 - 所以只需设置一次，然后摆脱buttonover的东西。

• 为自定义类扩展EventDispatcher可能是有意义的，它为您提供了on()方法，它支持data参数。我可能会建议您在addEventListener

中代替CTextButton内容
• 请注意，RAF不支持帧率属性（它只使用浏览器的RAF速率，通常为60fps）。使用createjs.Ticker.timingMode代替弃用的useRAF。

希望有所帮助。