如何在不失性能的情况下添加大量圈子？

Question

当我使用createljs构建我的模拟器时，我需要有数千个小圆圈（直径3像素）。 我可以在形状图上画一个圆圈，这是推荐的方法吗？或者我应该使用位图？

对性能方面的最佳方法有什么想法？

此外，是否可以打开或关闭文本抗锯齿？

Answer 1

您可以查看以下文章，了解有关优化画布的信息。

http://www.html5rocks.com/en/tutorials/canvas/performance/

在本文中，我们展示了使用canvas

的不同渲染技术

关于easeljs adobe为从AS3过渡到HTML5的开发人员提供了指南：

http://blogs.adobe.com/digitalmedia/2011/01/getting-started-with-the-canvas-element-and-easeljs/

本文介绍如何从以前的对象定义创建新的Shape实例。

Answer 2

如果您正在寻找性能，请考虑使用Shape.cache(x,y,w,h)缓存您的形状，这在大多数浏览器中提供了一些好处。查看EaselJS Git仓库中的缓存演示。请注意，Safari 6在该示例中具有相反的效果（缓存速度较慢），因为Safari已经对Graphics进行了很棒的优化，并且很难处理GPU上的大量小对象。

如果你的形状随着时间的推移发生了很大的变化，那么缓存可能不是一个好的选择。