Javascript: Unresponsive script error

I get an error message from Firefox "Unresponsive script". This error is due to some javascript I added to my page.

I was wondering if the unresponsiveness are caused exclusively by code loops (function calling each other cyclically or e开发者_运维问答ndless "for loops") or there might be other causes ?

Could you help me to debug these kind of errors ?

thanks

One way to avoid this is to wrap your poor performant piece of code with a timeout like this:

setTimeout(function() {
 // <YOUR TIME CONSUMING OPERATION GOES HERE>
}, 0);

This is not a bullet proof solution, but it can solve the issue in some cases.

According to the Mozzila Knoledgebase:

When JavaScript code runs for longer than a predefined amount of time, Firefox will display a dialog that says Warning: Unresponsive Script. This time is given by the settings dom.max_script_run_time and dom.max_chrome_script_run_time. Increasing the values of those settings will cause the warning to appear less often, but will defeat the purpose: to inform you of a problem with an extension or web site so you can stop the runaway script.

Furthermore:

Finding the source of the problem

To determine what script is running too long, click the Stop Script button on the warning dialog, then go to Tools | Error Console. The most recent errors in the Error Console should identify the script causing the problem.

Checking the error console should make it pretty obvious what part of your javascript is causing the issue. From there, either remove the offending piece of code or change it in such a way that it won't be as resource intensive.

EDIT: As mentioned in the comments to the author of the topic, Firebug is highly recommended for debugging problems with javascript. Jonathan Snook has a useful video on using breakpoints to debug complex pieces of javascript.

We need to follow these steps to stop script in Firefox.

Step 1 Launch Mozilla Firefox.

Step 2 Click anywhere in the address bar at the top of the Firefox window, to highlight the entire field.

Step 3 Type "about:config" (omit the quotes here and throughout) and press "Enter." A "This might void your warranty!" warning message may come up; if it does, click the "I'll be careful, I promise!" button to open the page that contains all Firefox settings.

Step 4 Click once in the "Search" box at the top of the page and type "dom.max_script_run_time". The setting is located and displayed; it has a default value of 10.

Step 5 Double-click the setting to open the Enter Integer Value window.

Step 6 Type "0" and click "OK" to set the value to zero. Firefox scripts now run indefinitely, and will not throw any script errors. Step 7

Restart Mozilla Firefox.

Excellent solution in this question: How can I give control back (briefly) to the browser during intensive JavaScript processing?, by using the Async jQuery Plugin. I had a similar problem and solved it by changing my $.each for $.eachAsync

1. there could be an infinite loop somewhere in the code
   • start by commenting out codes to identify which section is causing it
   • too many loops: there might be a chance that your counter variable name clashes, causing the variable to keep resetting, causing the infinite loop.
2. try as much as possible to create hashes for your objects so much so that read time is O(1) and in a way caching those data
3. avoid using js libs as some of the methods might cause overheads. eg. .htm() vs .innerHTML
4. setTimeout() yes and no -- depends on how you chunkify your codes