Javascript script causes the IE browser to run slowly

Nicholas teaches you how to avoid the slow running of IE and other browsers due to JavaScript scripts

During web development, the browser prompts that the script runs for a long time and stops or continues. No matter what you choose, I believe you will try your best to keep this dialog box away from your users. But do you know how different browsers determine which scripts are out of control? This article analyzes the causes of this situation from Internet Explorer, Firefox, Safari, chrome, and opera.

[Original article title] What determines that a script is long-running?
[Author] Nicolas C. zakas

The following is a translation of the original text:

The problem that web developers often encounter and must handle in a timely manner is the "prompt box for too long script running time" (or "out-of-control script prompt "), these annoying dialog boxes will appear when your script execution takes too long. The basic principle for Web developers is that users are not allowed to see these dialogs at any time, because this givesCodeThere is a lack of structured impressions. To put it simply, your code is too heavy.

In the case of Brendan eich (the inventor of JavaScript), if it takes seconds for JavaScript to run, it must be wrong. I personally can have a lower limit. No matter what script is executed at any time or in any browser, it should not exceed 100 milliseconds. If the actual execution time is longer than this limit, the process must be broken down into several smaller code segments.

In addition, in fact, few people really realize what causes the script to run too long in different browsers, and I haven't even studied it myself. So I decided to take a good look at the situation where we could see the nasty dialog box. There are two methods to determine whether the script is out of control. One is based on the number of statements executed, and the other is the time spent in script execution. The specific methods used by various browsers to determine that the script is out of control are slightly different.

Internet Explorer

Internet Explorer determines whether a script is out of control, mainly through the total number of statements executed by the JScript engine. By default, the upper limit is 5 million statements, which can be modified through the registry. When the number of statements executed by your script exceeds this limit, you will see the following window.

This dialog box prompts: "There is a script on this page that causes Internet Explorer to run slowly. If you continue running, your computer may become unresponsive ". If it weren't for the pursuit of technical accuracy, it would be a bit too much. The dialog box has two options: Stop or allow the script to continue running. When this dialog box is displayed, the script has been completely stopped. If you choose to continue running the script, the number of statements currently executed will be recalculated, that is, if this value reaches the upper limit again, you will see this dialog box again.

Firefox

Firefox judges whether a script is out of control based on the script engine's continuous code execution time. The default maximum value is 10 seconds. You can modify this value on the about: config page. Note that when a mode dialog box similar to alert is displayed, no timing is required. When the time for the browser to execute the script reaches this limit, Firefox will display a dialog box similar to the following:

The Firefox Dialog Box prompts: "A script on this page is currently busy, or the script has stopped responding. You can stop executing this script, open it in the debugger, or keep it running ". The problems encountered are clearly described, and they are not as terrible as IE said. In this dialog box, you can perform three operations: Stop the script execution, debug the script, or continue the script. Like Internet Explorer, when the script continues to run, statistics on the script duration are reset. The debug script button appears only when you have installed firebug and activated debugging on this page. After you execute the debugging script, you can display the specific location of code segments that have been executed for too long.

Safari

Safari also determines Based on the script engine's continuous script execution time. After studying the source code of WebKit, I found that the default timeout time is 5 seconds. Once this limit is reached, the following dialog box is displayed:

The dialog box prompts: "the script on the page url makes safari lose response. Do you want to continue running the script or terminate the script ". Similarly, it is not a terrible reminder for users. In safari, you can disable the out-of-control script detection function.

Chrome

Chrome is a bit tricky in tracking technology. The out-of-control script detection function seems to be associated with the crash control of tab. I read it carefully.Source codeBut the specific limit is not found, but it is basically determined that this limit is based on time and is estimated to be about 10 seconds (either 5 seconds or 10 seconds, always match safari or Firefox ). I am contacting a friend from the Chrome project team to see if I can get any definite information. Even so, if an out-of-control script exists in the webpage, the user will still see the following dialog box:

There is no doubt that Chrome prompts are more serious than other browsers. Click the "wait" button and the script continues to run until the next limit is reached. You can also click "Kill pages" to close all the information on the page in the memory and replace it with a blank page.

Opera

Opera is interesting: It seems that he has no restrictions on out-of-control scripts. I ran several long tests and even took a few minutes. In this process, the browser was always able to respond normally, which was unexpected. I'm not sure. For the current situation, this method is good or bad, but at least it takes effect, isn't it?

Some Suggestions

No matter what browser you use, you should not see similar prompts at any time. On your website or Web ApplicationProgramBefore the product is released, it is necessary to perform some common performance tests. Many tools can be used in this regard, such as firebug's profiler (only supports Firefox), Yui profiler (supports all browsers), or Internet Explorer 8's profiler. You should not hesitate to find out the scripts that have been executed for more than 100 milliseconds. Even if these scripts are not running properly on Some browsers, these scripts contain some code segments that need to be executed for a long time, these codes should be re-evaluated by performance testing tools. Make sure that you do not use chrome as the bottom line for testing, because chrome executes Javascript at an order of magnitude faster than other browsers (equivalent to Firefox 3.1 and the latest WebKit nightly ). It is best to use Internet Explorer as the bottom line of the test and then test other browsers, because at any time, the JavaScript engine of IE is the slowest. when the problem is fixed on IE, in other browsers, you can also run normally.