我正在检查我的游戏在跟踪效果下的表现会降低多少。但我注意到的是，我每秒获得了更多的操作。这怎么可能？
这怎么样...
context.fillRect(0, 0, 500, 500); // clearing canvas without any trail effect
……比这还慢？
context.fillStyle = 'rgba(255, 255, 255, 0.1)'; // clearing canvas with trail effect
context.fillRect(0, 0, 500, 500);
测试链接：http: //jsperf.com/canvas-trailing-effect
我想这里有一点初始化问题：画布填充样式在每个测试循环之间没有重置。
在调用 fillRect 之前设置填充样式，您会看到黑色的 fillRect 更快，正如预期的那样。
还要记住 clearRect 会更快地清除画布。
我更新了你的性能测试：
http://jsperf.com/canvas-trailing-effect/2
编辑：我很想知道几个调用的开销，所以我编辑了性能测试以查看 3 / 10 / 20 步所用的时间。
所以我们在 FF (mac OS / imac) 上有：
3 步：1/12000 = 83 ns = 3 * 开销 + 填充时间 10 步：1/8000 = 125 ns = 10 * 开销 + 填充时间 20 步：1/5000 = 200 ns = 20 * 开销 + 填充时间
所以我们的开销接近 6 ns，填充时间接近 60 ns。
所以公式大约是所用时间 = 步数 * 6 +（填充比率）* 60
，这使得 50% 填充 90 ns 需要十个步骤。
这种计算应该在几个浏览器/设备上完成，以便更相关。
此外，该测试将受益于在 rAF 内进行。