如何找到js的哪个部分正在减慢页面速度

Question

我的页面在本地服务器上占用大约9s，在远程服务器上占用大约20s，我确定问题出在js中，但是我找不到让它变慢的原因，请你帮我找一个解决方案或者任何解决问题的工具？

Answer 1

所有现代主流浏览器现在都内置了js profiling。 Firebug＆amp; Chrome都有良好的客户端脚本分析工具，它们还有http流量监视器，也可以帮助您诊断问题。 IE也有一个。

以下是运行中的firebug Profiler示例

[编辑]在Chrome中，按Ctrl + Shift + J打开JavaScript个人资料页面。

Answer 2

替代内置或添加分析工具（我说的首选方式）：使用计时器。 我已经煮熟了这个：

 function Timer(){
  var start = new Date
      ,ended = 'running ...';
  return {
      start: function(){
              start = new Date; 
              return this
      },
      stop:  function(mssg) {
              var stoppedAt = (new Date - start);
           ended = [(mssg ? mssg+': ' : '')
                           ,(stoppedAt/1000)+' sec (+/- 15ms)'].join('')
              return ended;
      }
      ,toString: function(){
                return ended;
      }
  };
}
//usage:
var timenow = new Timer().start();
// run a function
console.log(timenow.stop('this took '));

您还可以使用包装函数来计算函数的执行时间。类似的东西：

function timedFn(fn){
  var timer = new Timer().start();
  fn();
  console.log(timer.stop('function took '));
}

Answer 3

我将使用Web developer 1.1.8＆amp;添加Firebug添加Firefox Chrome

有关详细信息，请查看此link

关于

<强> Wazzy

Answer 4

您可以将YSlow用于Firebug。从YSlow页面：

  

YSlow分析网页，并根据高性能网页的一套规则提出改进其性能的方法。 YSlow是一个与Firebug Web开发工具集成的Firefox附加组件。 YSlow根据三个预定义规则集或用户定义的规则集之一对网页进行评级。它提供了改善页面性能的建议，总结了页面的组件，显示了有关页面的统计信息，并提供了性能分析工具，包括Smush.it™和JSLint。