大量的EaselJS动画位图的速度 [英] Speed of large amount of animated bitmaps in EaselJS
问题描述
我似乎有一点麻烦，使用EaselJS时，使用大量的动画位图（全部基于相同的spritesheet）。当我一次在我的阶段运行夫妇这些，还有一点问题都没有，但在同一时间运行一个更高的金额他们时，同时移动它们（大约30至40起）左右我开始有他们忽悠了不少，甚至在10左右的FPS
I seem to have a bit of trouble with using a large amount of animated bitmaps (all based on the same spritesheet) when using EaselJS. When I run a couple of these at once on my stage, there is no problem at all, but when running a higher amount of them at the same time (starting at around 30 to 40) whilst moving them around I start to have them "flicker" quite a bit, even at an fps of around 10.
我不使用任何阴影或任何东西沿着这些线路东西。只是用动画位图和移动它们。
I'm not using any shadows or anything else along those lines. Just using animated bitmaps and moving them around.
有谁围绕提高这样的表现有什么好的建议吗？
Does anyone have any good advice around increasing this performance?
推荐答案
在没有看到您的code很难确切地知道在哪里的瓶颈。但这里有几个地方开始寻找（与更琐碎的修复开始）：
Without seeing your code it's hard to know exactly where the bottleneck is. But here are a few places to start looking (starting with the more trivial fixes):
-
请确保您使用的是最新的浏览器。 在最起码，检查发现几张其他浏览器/平台，看看是否有任何性能显著更改。据我了解，EaselJS表现在非硬件加速的画布实现显著恶化。
Make sure you are using a modern browser. In the very least, check across a few other browsers/platforms to see if that has any significant change in performance. From what I understand, EaselJS performance is significantly worse on non-hardware accelerated canvas implementations.
如果可以的话，使用createJS的版本TweenJS比其他的补间图书馆。 TweenJS将自己绑在EaselJS的新浪体育讯北京时间类，这是更有效的。
If you can, use createJS's version of TweenJS over other tweening libraries. TweenJS will tie itself to EaselJS's Ticker class, which is more efficient.
不要叫 stage.update（）除非绝对必要。由于 stage.update（） 是这么昂贵的电话，你应该尽可能吝啬。事实上，你应该不是真的，如果你使用的是新浪体育讯北京时间定期更新阶段调用它。
Do not call stage.update() unless absolutely necessary. Since stage.update() is such an expensive call, you should be as stingy as possible. In fact, you shouldn't really call it at all if you are using the Ticker to regularly update the stage.
缓存明智和积极的。如果您有在舞台上复杂的静态元素，其中的缓存会节省一些周期。然而，有一个开销缓存，以便保存它与很多静态元素或复杂地绘制形状的容器。
Cache wisely and aggressively. If you have complex static elements on the stage, caching them will save some cycles. However, there is an overhead to caching so save it for containers with a lot of static elements or complexly drawn shapes.
比EaselJS检查鼠标悬停频率如果您已启用鼠标移到舞台上，传递一个较低的频率（的文档）。如果你不需要它（如果你只倾听点击），不启用它。监控鼠标旁白是pretty宕昂贵，特别是如果你有大量的在舞台上的元素。
Lower the frequency that EaselJS checks for mouseovers. If you have enabled mouse over on the stage, pass in a lower frequency (documentation). If you don't need it (if you are only listening to clicks), don't enable it at all. Monitoring mouse overs is pretty dang expensive, especially if you have plenty of elements on stage.
设置 stage.snapToPixelsEnabled 为true。这可能会或可能不会帮助。从理论上讲，对全像素渲染位图是更有效，但是这可能会导致一些动画变成锯齿状，我还没有与它周围的发挥足以知道其他利弊。
Set stage.snapToPixelsEnabled to true. This may or may not help. Theoretically, rendering bitmaps on whole pixels is much more efficient, however this may cause some animations to become jagged and I haven't played around with it enough to know what the other pros and cons are.
我能得到30fps的周围600-800 spritesheets不俗的表现和一个4岁的iMac（只是一个快速测试）使用Chrome基本补间。
I was able to get decent performance with around 600-800 spritesheets at 30FPS and basic tweening using Chrome on a 4 year old iMac (just a quick test).
这篇关于大量的EaselJS动画位图的速度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
