Question

所以我一直在做一个项目，突然我的动画，一切都会运行得非常慢。甚至我的超时都落后于严重的毫秒数。现在我找到了导致这种情况的原因，但我想知道的是为什么？

这是我的原始代码：

  ctx.save();
  ctx.beginPath();
  ctx.arc(c.width / 2, - 7.5, c.width / 2, 0, Math.PI * 2, false);
  ctx.clip();
  ctx.beginPath();

  // Mark out some path

  ctx.stroke();
  ctx.restore;

然后我发现我在restore之后错过了括号：

  ctx.save();
  ctx.beginPath();
  ctx.arc(c.width / 2, - 7.5, c.width / 2, 0, Math.PI * 2, false);
  ctx.clip();
  ctx.beginPath();

  // Mark out some path

  ctx.stroke();
  ctx.restore();

现在它神奇地像一个魅力。有人知道为什么？我没有在chrome中遇到问题，我使用的是firefox版本53.0.3（32位）。

哦，顺便说一下，我正在播放一个带有大量过滤器的AoudioBufferedSourceNode，尽管它仍在正常播放。

Answer 1

您的原始代码从未恢复画布状态，因此您的状态堆栈将永远增长。毫不奇怪，最终会让事情陷入困境。 ctx.restore实际上是无操作，它实际上没有做任何事情*。 ctx.restore() 在restore上调用 ctx方法。

* （它评估ctx的当前值，然后尝试在其上查找restore属性...然后抛弃它得到的值[函数引用]而不是而不是用它做某事。所以它不是一个非操作，因为如果[例如] ctx是null或undefined，它会引发错误，但它不会任何有用的东西。）

缺少括号会导致Firefox上的JavaScript运行速度极慢

1 个答案: