We Keep Coding

Get all URLs opened in browser

I want to keep track from all the browser tabs I have opened. I searched it a bit and found out that I can achieve this with this command (for Chrome) chrome.tabs.query
So, do I need to build an extension for Chrome for this to work or I can achieve this with some Javascript code for example? (I think the first case)
Thanks in advance.

So, do I need to build an extension for Chrome for this to work
Yes. It would be a huge security problem if any website could monitor what happened in all other tabs open in the same browser.
or I can achieve this with some Javascript code for example?
Chrome Extensions are written in JS.

Finding bottlenecks in javascript?

I'm attempting to find a bottleneck in my Javascript. Basically I'm developing a chrome extension written in Javascript which is taking 4-5 seconds to perform a task. There's a lot of code involved in the task and using print statements / chrome built in dev tools just isnt working. The dev tools don't seem to even see my Javascript running. I'm wondering if anyone has any advice / tools they think could be of benefit?

Open your page in Chrome.
Tools -> Developer tools -> Profiles
Start Profiling (3rd button, grey circle on the status bar at the bottom)

Perhaps it'd be a good idea to open the HTML files in Firefox instead of letting Chrome extensions handle it. That'd allow you to use Firebug to determine any causes, which would be very helpful.

I remember Google Chrome has a built-in JavaScript profiler. Or can't you use this for your extension? (I have never built Chrome extensions.)

You can try to use Profiler as it was mentioned before or Timeline.
Timeline will help you if the time was spent in native code.

measure page rendering time on IE 6 or FF 3.x

I have a page constructed using Dojo and I need to measure how long the page takes to complete rendering on my browser (NOT time-to-first-byte, or time-to-last-byte).
In other words, the page (all bytes) might get downloaded to my broswer but the components I'm using (eg. calendar, grid etc) might still initialize and render long after the complete page has been downloaded.
Are there any tools that would allow me to measure when the page and all its components have completely rendered, reliably?

For render times in Firefox try Google Page Speed.
EDIT: in Chrome try the new Google Speed Tracer (Chrome 4 and up), it's amazing

Firebug's profiler & net tab can be helpful. Chrome has similar functionality in their developer tools.
For Internet Explorer you could use dynaTrace.

I've found that "Page Speed" for Firefox is a great plugin, and dynaTrace is definitely the best if IE6 is required.

YSlow will help you with Firebug and as previously mentioned dynaTrace is your best bet for IE.

Can you just do a dojo.connect to a method like postCreate on one of your widgets and get a timestamp?
dojo.connect(dijit.byId("myCalendar"), "postCreate", function(){
console.log(new Date() - start);
});
where 'start' is a global declared in a SCRIPT block in HEAD?
-Adam

How do i find out what is slowing down my page load in IE7

http://shanamccormick.com
The page loads all the images and then says "(1 item remaining) Waiting on http:// shanamccormick com..." How can i see what it is waiting to load here?? and why does it take sooo long?
The index.html file uses a couple small internal JS and one external JS located within my website (jquery.min) The size of the external JS file is 54kb.

IE8 has a Javascript profiler, like Firebug for Firefox.
But I think you need Fiddler to profile the performance of the HTTP request/response.
If you want the Javascript developer tools (including profiler) I recommend moving to IE8, but if you can't,
IE7 has downloadable dev tools, like IE8's built-in capability.

I have a few solutions that might help. I learned of these from another question I asked earlier:
Firebug Lite is a JavaScript file you can insert into your pages to simulate some Firebug features in browsers that are not named "Firefox". Firebug Lite creates the variable "firebug" and doesn't affect or interfere with HTML elements that aren't created by itself.
WebWait is a website timer. Use WebWait to benchmark your website or test the speed of your web connection. Timing is accurate because WebWait pulls down the entire website into your browser, so it takes into account Ajax/Javascript processing and image loading which other tools ignore.
Also, the IE JavaScript Real Performance Tester can test your scripts.
Hope these help!

The page doesn't exist anymore? or is it: shanamccormick.com ? misstype?
Anyway I've found that googles IE8.js (for IE7 and less) (https://code.google.com/p/ie7-js/) takes up to 1 minute to load (on a computer from that time) every page load... could that have been the problem?

JavaScript Troubleshooting Tools in Internet Explorer

I use Firebug and the Mozilla JS console heavily, but every now and then I run into an IE-only JavaScript bug, which is really hard to locate (ex: error on line 724, when the source HTML only has 200 lines).
I would love to have a lightweight JS tool (a la firebug) for Internet Explorer, something I can install in seconds on a client's PC if I run into an error and then uninstall. Some Microsoft tools take some serious download and configuration time.
Any ideas?

You might find Firebug Lite useful for that.
Its bookmarklet should be especially useful when debugging on a user's machine.

Since Internet Explorer 8, IE has been shipping with a pretty impressive set of tools for JavaScript debugging, profiling, and more. Like most other browsers, the developer tools are accessible by pressing F12 on your keyboard.
Script Tab
The Script tab is likely what you'll be interested in, though the Console, Profiler, and Network tabs get plenty of use as well while debugging applications.
From the Script tab you can:
Format JavaScript to make it more readable
Move from source to source of various resources on the page
Insert breakpoints
Move in and over lines of code while stepping through its execution
Watch variables
Inspect the call stack to see how code was executed
Toggle breakpoints
and more...
Console Tab
The console tab is great for when you need to execute some arbitrary code against the application. I use this to check the return of certain methods, or even to quickly test solutions for answers on Stack Overflow.
Profiler Tab
The profile is awesome if you're looking for long-running processes, or trying to optimize your code to run smoother or make fewer calls to resource-intensive methods. Open up any page and click "Start profiling" from the Profiler tab to start recording.
While the profiler is working, you can move about the page, performing common actions. When you feel you've recorded enough, hit "Stop profiling." You will then be shown a summary of all functions ran, or a call tree. You can quickly sort this data by various columns:
Network Tab
The network tab will record traffic on your site/application. It's very handy for finding files that aren't being downloaded, hanging, or for tracking data that is being requested asynchronously.
Within this tab you can also move between a Summary view and a Detailed view. Within the Detailed view you can inspect headers sent with requests, and responses. You can view cookie information, check the timing of events, and more.
I'm not really doing the IE Developer Tools justice - there is a lot of uncovered ground. I would encourage you to check them out though, and make them a part of your development.

I would recommend Companion JS.
This is the free version of Debug Bar but I find it easier to use and have the features I need. Great to test little JavaScript snippets in IE the same way I do with Firebug in Firefox.
EDIT 5 years later: I now uses Internet Explorer integrated developer tools.

IE 8 is supposed to have better tools, but the IE Developer Toolbar is pretty good.

I use both Microsoft Script Debugger and FireBug Lite, depending on what I am debugging. Both are great tools- try them both out and stich with what you're comfortable with.

In IE8 just press F12!

Go to Tools->Internet Options…->Advanced->Enable Script Debugging (Internet Explorer)
then attach Visual Studio Debugger when an error occurs.
If you're using IE 8, install the developer toolbar because it has a built in debugger.