CODEWITHSUNDEEP
javascriptjquerygoogle-chromegoogle-chrome-devtools
CaptSaltyJack
CaptSaltyJack

Reputation: 16025

How to tell where a Javascript is taking the most time?

I've got a page that takes about 15 seconds to load, due to a few loops I have going on, cloning DIVs and loading content into them. Is there some way in the Chrome inspector that I can easily see where the hold-up in my script is?

EDIT: I tried the 'Profiles' tab in the inspector, but it doesn't show my actual script. It shows the jquery.js source code which is not useful.

Upvotes: 0

Views: 522

Answers (3)

loislo
loislo

Reputation: 14119

If the problem is related to the performance of javascript then Profiles tab in Safari WebInspector or Chrome DevTools will help you.

The difference between them in the profiling code for Safari JSC and Chrome V8. JSC has Instrumenting profiler, V8 has Statistical profiler. The first one is more precise, the second less affects the performance of the page.

The UI is the same in Safari and Chrome.

There is two different sort orders for the profiling data. Heavy (Bottom Up) and Tree (Top Down). You can change it in the combo-box at the bottom of Profiles page.

If the most time consuming entry is the '(program)' then I'd recommend to use Timeline Panel.

Chrome version of Timeline Panel provides more information.

Upvotes: 0

user1233508
user1233508

Reputation:

Look at the Profiles tab of the inspector. note: this is webkit only

More information on the specific browser profilers can be found...

Chrome: https://developers.google.com/chrome-developer-tools/docs/profiles

FireFox: http://getfirebug.com/javascript

Opera: http://dev.opera.com/articles/view/opera-developer-tools/

Even IE has dev tools: http://blogs.msdn.com/b/ie/archive/2008/09/11/introducing-the-ie8-developer-tools-jscript-profiler.aspx

Upvotes: 4

standup75
standup75

Reputation: 4814

at the beginning of what you want to inspect put:

var startTime = new Date().getTime();

and at the end:

console.log(new Date().getTime()-startTime)

Upvotes: 1

Related Questions