首先，感谢您的帮助。 :)
正如您在上面的 fiddle 链接中看到的那样，我正在为 1400 个对象制作动画，试图创建“闪烁效果”。随着用户移动鼠标的速度越来越快，更多的六边形会突然变成完全不透明的，并且具有不同的淡出率。 fiddle 中的版本用足够的颜色填充了空间，但感觉生涩和结 block 。如果我减少 fade_time 变量，它会更平滑但没有足够的完全不透明的六边形。最终目标是用六边形拼写单词。
在 Chrome 中的性能最好，在 FireFox 和 IE 中次之。我在 iPad 上的移动 safari 中测试(使用 Raphael 的 element.touchmove)，结果更糟。
我正在寻找有关可以以不同方式完成哪些代码片段以提高性能的任何建议。
我看到了this answer其他人认为这应该有助于提高性能，但我正在尝试根据光标移动设置动画六边形的数量，但我不确定我是否可以使用计时器来做到这一点。
This answer提到使用 Canvas :
A good alternative would be using Canvas to draw the elements. From my experiments it will be faster than SVG at drawing this many although if you are using some animations, they will be harder to implement than with the RaphaelJS library.
即使代码使用动画，这对人们来说是否是更好的途径？
这是我第一次使用 Raphael.js。一般来说，我在 JS 方面不是很有经验，所以任何帮助都是 wunderbar!
编辑: 编辑:另外，参见 this answer关于 .resize 被调用的次数比提问者想象的要多，这让我想知道 .mousemove 函数的调用次数是否比我预期的多(比我需要的多)。
最佳答案
我认为它会因“重叠”动画而窒息，例如:
- 六边形#6 开始淡化
- 在其淡出一半时，开始另一个淡入淡出
我添加了一条 stop() 指令以避免意外结果。
此外，for() 循环不检查是否有另一个动画正在进行，也不检查某些十六进制是否在循环内被随机选择了两次或更多次。 作为解决这个问题的方法，我添加了一个向量来缓存正在动画的六边形的索引，尽管它似乎没有太大帮助。
要查看它保存了多少(无用的)动画，请取消注释最后一个 console.log()。
此外，您的 getRandomInt() 函数生成了一些 undefined index 错误(因为您的数组索引从 0 到 1399，它返回 0 到 1400 之间的整数...我更改了它。
在这里查看我的附加组件:http://jsfiddle.net/rz4yY/46/
关于javascript - 动画 1400 个 Raphael.js 对象的不透明度会影响动画性能，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12215314/