Question

我正在HTML5中构建一个图形密集型网站，它大量使用了canvas上下文的drawImage（）函数。在Windows 7的IE9中，性能很流畅，但在Firefox 4中，事情变得不稳定。我正试图隔离瓶颈，以便我可以开始优化。

如果我使用Firebug 1.7.0的JavaScript性能分析功能，我可以看到我自己的函数的统计信息，但我也希望看到对内置JavaScript函数的调用。有没有办法在Firebug或其他工具中做到这一点？

作为一种解决方法，我想我可以通过将内容分解为许多微小的函数来使分析粒度更精细，但我宁愿我的设计不会被分析的容易程度所驱动。

更新：回顾这个问题，我发现有问题的内置函数不是真正的JavaScript函数，而是主机提供的函数。在这种情况下，它们是来自浏览器的DOM对象。我以为我会澄清那个技术细节。

Answer 1

最后我使用它Firebug不能让你能够分析本机代码。

你可以做的就是制作你自己的功能，只需要调用你要调用的原生作品。反过来代码：

ctx.fillRect(50,50,50,50);`

分为：

// wrap in function
function fillR() {
ctx.fillRect(50,50,50,50);
};

// call it immediately afterwards
fillR();

然后你可以得到fillR的统计数据。不是最好的解决方案，但它可能足够有用。

Answer 2

您可以尝试使用Mozilla的JS调试器Venkman。目前，addons.mozilla.org上的版本在Firefox 4.0中被破坏了。

您可以通过mercurial获取最新版本，该版本适用于Firefox 4.0：

hg clone http://hg.mozilla.org/venkman/
cd venkman/xpi
./makexpi.py
firefox venkman-0.9.88.1.xpi

Answer 3

在考虑了这个开关几天之后，我想出了一个新的解决方案，写了一篇关于它的博客文章：

此方法执行以下操作：

这些组合步骤提供了一种方法来分析不影响原始脚本代码的DOM函数，除非您正在调试。