Detailed explanation of setTimeout precision usage in js

The setTimeout function is mainly a timing function in js. We often use it as a timer. Next I will explain the usage of setTimeout in js in depth.

A few days ago, I just published an article that uses setTimeout to improve the ui response speed. I felt that my understanding of setTimeout was deep enough, but yesterday I accidentally heard that setTimeout actually had a "bug: when setTimeout is 0, the time cannot be precise. It is also said that IE will have a delay of 16 Ms.
Although it has long been possible to think of something like js, it is certainly not very accurate, and this latency has little impact on "Improving ui response speed", but if it is an animation, the impact may be relatively high. I also said that I had to write a small program and tried it.

The Code is as follows:

Copy code

// Timed Length Var OUT_TIME = 0; // Number of cycles Var LOOP_COUNT = 100; $ (Function (){ $ ('A # start'). click (function (){ Var t1 = mst (); LoopOut (LOOP_COUNT, t1 ); }); }); // Recursive loop Function loopOut (I, t1 ){ If (-- I> 0 ){ SetTimeout (function (){ LoopOut (I, t1 ); }, OUT_TIME ); } Else { Var t2 = mst (); Alert (t2-t1 ); } } // Returns the number of milliseconds for the current time point Function mst (){ Return new Date (). getTime (); }

In the above program, When you click the "start" button, the current time t1 will be taken first, and then loopOut will be called. When the loop parameter I is greater than 0, loopOut will be recursively called through the setTimeout time 0 ms, at the same time, I will subtract 1 to form a cycle termination condition. When the cycle is full for 100 times, the current time will be retrieved again, which will be subtracted from t1, that is, 100 of the setTimeout cycle time.
The test results show that "IE has a latency of 16 ms", which is not an error. IE7 and 8, and the final return value is about 1530 ~ 1550. In this example, the latency of one setTimeout is generally DT = 15.4 ms.
In addition, for chrome/safari/firefox, the returned value is about 420 ~ 430, that is, DT = 4.2 ms

When the scheduled length OUT_TIME is increased, the actual scheduled length is valid only when it is increased to the DT of Each browser. That is, DT can be regarded as the "minimum scheduled length"
However, even if the timing length is greater than DT, it is not accurate. If the non-IE length is about 0.2 ms, IE is a little outrageous, for example, when OUT_TIME = 50, the average length of each timer is about 60 ms, which is 10 ms (contempt)

To sum up, although the time value passed in by setTimeout is millisecond, it is not accurate. If the precision requirement is high, it is best to calculate the error of Each browser.

The following two situations are discussed:

1. Since setTimeout has this problem, is there a problem with setInterval similar to it?
The above "loopOut" method can be slightly improved to setInterval:

The Code is as follows:	Copy code
Function loopOut (I, t1 ){ Var si = setInterval (function (){ If (-- I = OUT_TIME ){ Var t2 = mst (); Alert (t2-t1 ); ClearInterval (si ); } }, OUT_TIME ); }

This is because IE once again expresses its excellent performance: When OUT_TIME = 0, the setInterval callback method will only be executed once, and only OUT_TIME> 0 can be executed normally in IE.
In addition, setInterval performs basically the same as setTimeout.

2. Is the setTimeout of node. js accurate?
Remove and slightly modify the code from the code in the click part above, so that the code can be executed in node again. However, to remove the impact of code initialization, another setTimeout is used here, let it be executed ms after the program Initialization

The Code is as follows:	Copy code
SetTimeout (function (){ Var t1 = mst (); LoopOut (LOOP_COUNT, t1 ); },100 );

Test results show that the efficiency of server scripts is much higher than that of browsers. When the number of loops is 100, node. the latency of setTimeout 0 ms in js is about 100000 ms. When the number of loops increases by 0.01, the average latency is reduced to ms.