Does anyone know a tool for Profiling JavaScript in IE?
List available:
IE8 (Internet Explorer 8 only)
JavaScript Profiler
YUI!
Checkout http://ejohn.org/blog/deep-tracing-of-internet-explorer/ the dynaTrace tool shown here is fantastic and works with IE7.
The Internet Explorer 8 beta (2) has a builtin Javascript profiler (in the developer toolbar). It's worth playing with at least...
JavaScript Profiler is a decent tool.
YUI also provides a profiler.
js-profiler also provide a profiler that is working in any browser and does not depend on any framework.
I don't think debugbar has a profiler.. but it does have a debugger and a console... so you can fake it...
We use Firebugs console.log, console.time and console.timeEnd (I think) a lot.
Firebug also has a built in profiler.
Related
Is there any way to check the current variables value and such using some sort of debugger? I have an error in my code, and I want to see if it is a variable causing it, and if not, I would like to figure out what is. What are some really good debuggers for JS anyone knows of?
You can take a look at Firebug http://getfirebug.com/
I agree with gpmattoo Firebug is great. Internet Explorer has a javascript debugger built in (hit F12) Chrome has one built in too but there is also a Firebug lite that should work if you like Firebug for Firefox
Visual Studio (and Visual Web Developer) has support for JS debugging.
More lightweight, however, you can probably find something that'll plug in to your browser. IE has a JS debugger built-in (as of IE8 I think), Firebug is probably the way to go in Firefox, and I'm pretty sure Chrome also has a built-in debugger.
You can use Firebug under Firefox or the chrome inspector (right click on the page and inspect...) under Chrome.
You will then need to use some logging if the variable is a local one (console.log())
What techniques (other than alert(message);) do you use to debug JavaScript/jQuery? Give particular attention to browser specific techniques.
Tools
console.log(message) - alternative to alert(message); (Nirmal)
browser-safe call (soslo)
jsFiddle - demonstrations (Craver)
BlackBird - writing messages to the screen (Oli)
FireFox
FireBug (Lite)
Venkman's JS Debugger Add-in (Zeus)
Chrome
Built-in development tools (tutorial)
Firebug Lite (extension)
Safari
Built-in tools (overview - jsummers) (more information)
Opera
Dragonfly
Internet Explorer (I had to put it last)
Developer Toolbar
Firebug Lite
Adobe BrowserLab (Mickel)
IETester (Mickel)
MS Expression Web SuperPreview (Rijpstra)
console is your friend, available by default in newer browsers, and you can add a whole lot of debugging to IE with FireBug Lite.
For other browsers:
Chrome has developer tools
Firefox has the excellent Firebug addon
For demonstration/test cases, jsFiddle is also an excellent tool.
If you're concerned about using console.log because not all browsers support this, it's easy to workaround with a couple lines of javascript:
console = console || {};
console.log = console.log || function(){}; //you can change this to do whatever you want, or leave it to just keep js errors from being thrown
I love Blackbird. It's a cross-browser JS logging framework, with support for debug/info/warning/error.
You can display the console at any time with the F2 func key.
http://www.gscottolson.com/blackbirdjs/
If you are looking for an alternative for alert(message);, it is console.log(message);
The requirement is that you need any modern browser or a browser with developer tools installed.
More in testing than debugging domain.
Selenium - for GUI tests
JSUnit - for unit testing
The Chrome Developer Tools are a direct descendant of the Safari (WebKit) Developer Tools.
Refer to question for roundup of all answers.
I sometimes need to debug JS in other browsers, and it would be really nice if they all had Firebug - failing that, what's the closest they have?
Firebug Lite
IE8 - Developer Tools (F12)
IE6,7,8 - Visual Studio/Microsoft Script Debugger/DynaTrace (for tracing JS, not debugging)
Chrome, Safari - Developer Tools.
Firebug Lite - any up-to-date browser, but limited
IE - number of options depending of IE version and do you have Visual Studio
Opera - Dragonfly
Webkit based browsers have inspector and debugger in menu
IMHO Firebug is the best tool but could be used only on Firefox
Opera has the excellent dragonfly developer console, which can profile your code (to find bottlenecks and redundent code) as well as step through breakpoints.
For Safari and Google Chrome, the Developer Tools.
Just right-click anywhere and select "Inspect Element", or use the Ctrl + Shift + J shortcut:
Developer Tools http://img79.imageshack.us/img79/426/devtools.png
Fiddler is the one I use: http://www.fiddler2.com/fiddler2/
There is Charles: http://www.charlesproxy.com/
Also WireShark: http://www.wireshark.org/
How about Firebug Lite? It claims to work in IE, Opera and Safari by simply being a Javascript file.
Firebug can be used in other browser with it's javascript version : hhttp://getfirebug.com/firebuglite
Anyway, in Safari there is Web Inspector which is brilliant.
IE has the developer toolbar.
We are searching for an HTML/JS debugger specifically suited for IE that can handle popup windows as well. We tested Firebug Lite which is good but it has its restrictions when compared to Firebug. We also tried IE Companion but there are some problems when it comes to in-place editing and popups.
Do you recommend a good debugger?
Internet Explorer Developer Toolbar. It is best for IE as of i know so far :)
alt text http://upload.wikimedia.org/wikipedia/en/d/d1/Devtoolbar.PNG
IE8 has one built in, it can run as IE7 also. Hit f12
Is this what you are looking for? It's called the Internet Explorer Developer Toolbar, it's like FireBug... but it's not that good :D
If (like me) you can make do with logging as a debugging tool, log4javascript works well.
Is there a better way to debug JavaScript than MS Script Editor? I am searching for something like Firebug. Firebug Lite doesn't offer this functionality, though.
Use Visual Studio 2008.
The Web Development Helper from Nikhilk is useful as is the Internet Explorer Developer Toolbar (http://www.microsoft.com/en-us/download/details.aspx?id=18359). They are not as good as FireBug though :-(
Though not strictly debuggers, these are useful tools for your arsenal
http://www.debugbar.com/
http://projects.nikhilk.net/WebDevHelper/
I've used IE WebDeveloper. It's not free and not as nice as Firebug, but got the job done for me. http://www.ieinspector.com/dominspector/index.html
I would try and go for DebugBar. It's not as nice as Firebug, but it's very useful for javascript debugging...
There is a blog post that goes over most of the known ways to debug javascript in IE, with pros and cons.
Great article mkoryak
I used visual studio web developer as in this linked article
http://www.berniecode.com/blog/2007/03/08/how-to-debug-javascript-with-visual-web-developer-express/
The only other debugger for JavaScript in the IE context is Visual Studio, but it'll cost you. What problems are you having with the script debugger that leads to think you need a better debugger?
I suspect that what you are after are the additional features that aren't specifically about debugging JavaScript but analysing the HTML DOM that has been modified by the JavaScript and the monitoring of the conversation with the server.
The IE developer toolbar I find particularly invaluable for debugging web apps as is Fiddler.
You can download the Microsoft Visual Web Developer 2008 Express Edition for free.
In newer versions of Internet Explorer (10.0+ I guess) the developer tools are integrated.
The debugger panel there allows you to debug your JavaScript like in Firebug, the Firefox DevTools or the Chrome DevTools.