How to find which part of js slows the page down

Question

hi my page takes about 9 seconds on the local server and about 20 seconds on the remote server, I am sure that the problem is in js, but I can not find what makes it slow down, can you help me find a solution or any tool to find the problem ?

Answer 1

All modern major browsers now have built-in js profiling. Firebug and Chrome both have good client script profiling tools, and they also have http traffic monitors, which can also help you diagnose the problem. IE also has one.

Here is an example Firebug profiler in action

[EDIT] In Chrome, press Ctrl + Shift + J to open the JavaScript profile page.

Answer 2

An alternative to the built-in or adding to profiling tools (the preferred option, I would say): use a timer. I prepared this file:

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 ')); 

You can also use the wrapper function for the runtime of the function. Sort of:

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

Answer 3

I will add Web Developer 1.1.8 Add for Firefox with Firebug and Chrome

For more information see the link

with considering

Wazzy

Answer 4

You can use YSlow for Firebug. On the YSlow page:

YSlow analyzes web pages and offers ways to improve their performance based on a set of rules for high-performance web pages. YSlow is a Firefox add-on integrated with the Firebug web development tool. YSlow evaluates a web page based on one of three predefined rule sets or a custom rule set. It offers suggestions for improving page performance, summarizes page components, displays page statistics and provides tools for analyzing performance, including Smush.it ™ and JSLint.