javascript canvas html5性能问题

Question

所以我在用画布做一个有趣的老游戏。火狐很慢，但是chrome有firebug，我发现这几乎是用javascript开发时的一个要求。那么第一个问题:如果没有firebug的帮助，人们是如何开发这些复杂的游戏的？

第二项质询。有什么性能技巧可以帮助绘图函数(或者一般只是javascript )执行得更快？在我看来，这就是瓶颈(至少对firefox而言)。

最后一个问题。通过在firebug中进行性能分析的实验，我可以看到一些人称之为“坏做法”的性能提升，例如:我将代码组织到一个函数列表中，每个函数做一件事。这比我只是转储beginPath()和closePath()之间的所有代码要慢，但是这样做会导致意大利面状的代码，并且很难理解。你是如何管理余额的？

Answer 1

我正在使用100%的Chrome进行开发，然后测试其他浏览器。

Chrome有一个内置的检查器，(在我看来)比firebug更好。更容易进行堆栈检查、单步执行和对象检查。

在页面上单击鼠标右键，然后单击“检查元素”。(或按CTRL SHIFT + I)

然后单击"Scripts“选项卡。您将在右侧看到调用堆栈、作用域变量、断点、调用堆栈等。将鼠标悬停在变量上不仅可以看到它们的值，还可以查看它们的嵌套值。

Answer 2

对于你的最后一个问题--优化没有错--唯一不好的是过早优化。如果你发现了一个问题，而解决它的唯一方法就是降低代码的可读性，那么你就必须在可读性/可维护性和性能之间进行权衡。如果性能是头号因素，那么一定要把你漂亮的分解过的代码变成丑陋的意大利面代码。但只有在你用尽了其他选择之后。