如何在HTML5游戏中提高许多对象的性能?

问题描述:

当需要显示许多物体并计算位置,碰撞检测,反应等时,我可以做些什么?我希望一切看起来都很顺利?这是我正在开发的示例。我希望如果我在屏幕上有100个球,我可以顺利地展示它们。但我不知道该怎么做。每个建议都将受到赞赏。

What things can I do when it's necessary to show many objects and calculate position, collision detection, reaction, etc. and I want everything look smoothly? Here's an example I'm developing. I want that if I have 100 balls on the screen, I can show them smoothly. But I don't have any idea of how to do it. Every suggestion will be appreciated.

在HTML5 Rock的 Canvas Performance Tutorial

The basic steps to improve performance in canvas can be seen in this HTML5 Rock's Canvas Performance Tutorial.

并且,如果您可以在没有Box2D的情况下*处理碰撞检测,请检查 四叉树实施。四叉树不直接处理碰撞,但可以通过减少检测碰撞所需的比较量来提高性能。

And, if you are free to handle collision detection without Box2D, check this quad-tree implementation. The quad-tree doesn't deals with collisions directly but can improve performance by reducing the amount of comparisons needed to detect the collisions.

文章建议进一步阅读:

使用空间分区进行广角相位碰撞检测

碰撞检测和响应

使用Box2dWeb制作游戏