Javascript性能:如何检查页面的速度是什么？

Question

我有一个非常慢的页面,没有加载,但在页面上输入表单字段的响应性方面.

页面上没有ajax - 这与网络传输无关.

有哪些好的策略可以发现代码瓶颈在哪里？我在chrome开发人员工具中找不到任何信息来告诉我瓶颈在哪里.

Answer 1

Webkit有一个'profile'选项.打开开发人员工具(ctrl + shift + i),然后单击"配置文件".从那里你可以看到底部的记录按钮(圆圈).单击它并像平常一样使用您的页面.再次单击它以停止并检查函数调用的时间轴!

或者,您可以使用以下方法单独对功

console.time( "Some label" );
console.timeEnd( "Some label" );

Answer 2

在我看来，输入字段上的每个按键都会触发一些事件。你可以做的事情：

如果 Chrome 的分析器不能满足您的需求，请尝试 FireBug 或 IE9 的分析器，它们相当不错。在 IE9 中，您可以看到每个函数调用花费了多少 CPU 时间。
暂时将处理程序从字段中一一删除，并观察性能的任何变化。

让我知道事情的后续！