What tool can I use to find out what JavaScript events are being called when leaving a web page?

Question

I have a set of pages that have tons of JavaScript on it: Table sorting, AJAX calls, autocomplete, dynamically hiding and displaying areas of the page, etc... The problem that I am seeing is when the data on said page gets large a delay (browser freezes) is noticed when leaving the page. This delay happens when the user clicks away, closes the browser, or executes a form submit. I want to see if the problem is caused by JavaScript. What tool could I use to find out? Firebug doesn't seem to work in this scenario.

The only place unload is mentioned in the codebase is in jquery.js and ui.tabs.js (jquery ui)

Answer 1

Are there any onunload event handlers attached (to body, window, form etc.)? If so, it would be a good starting point to investigate.

[Edit]: Apparently jQuery runs a loop unbinding all the events attached to every element. This is to prevent memory leaks in IE (created due to event handler closures referencing the element they are listening to). This could create a delay if your DOM is very complex.

Can you try commenting this portion out in jQuery code and see if that is causing the problem?

[Edit 2]: The window unload seems to have been improved in newer versions of jQuery (1.3+). What version are you using?

Answer 2

Inline Code Finder is a firefox addin (well, really it's a firebug addin) that shows you visually what events are attached where and when they're invoked.