Why is my js countdown getting slower and slower?
var orderTimeOut = 900000;
var timer = setInterval(() => {
orderTimeOut -= 10;
if (orderTimeOut > 10) {
times = overTime(orderTimeOut);
console.log(times)
}else {
orderTimeOut = 0;
times = "00:00:00";
}
}, 10);
function overTime(time) {
var a = (time % 1000).toString().substr(0, 2);
var b = Math.floor(time / 1000);
var m = b % 60;
m = String(m);
m = m.length >= 2 ? m : "0" + m;
var f = Math.floor(time / (1000 * 60));
f = String(f);
f = f.length >= 2 ? f : "0" + f;
return f + ":" + m + "." + a;
}
this method can count down normally, but it is observed that it seems to run more and more slowly.
has just done the next test, on a page that only runs this method, it is still very Synchronize to compare the time progress of the system.
in the actual project, there are more functions to run, while setInterval will put the event at the end of the current queue, which does look a little stuck.
but it shouldn't actually slow down, if I understand setInterval correctly.
has setInterval , and the browser opens a separate thread and throws this method into the JS queue every few milliseconds.
is fixed every few seconds, but when to execute the placed code is uncontrollable.
if there is a lot of work in the current queue, this method will not be executed for a short time and will seem to slow down. Accordingly, however, this method will be executed many times at a time.
< hr >
add another relatively optimized countdown method.
the total time to receive the countdown T , and note the current time tStart .
uses setTimeout to execute the method at regular intervals, in which the remaining time is calculated by combining the relationship of the three variables (plus the current time).
calls the setTimeout operation again.
whether it's setInterval or setTimeout , the time is definitely wrong.
timer logic is task after execution, check whether timer is out of date, and execute timer callback if it is out of date.
that is, if there is a Synchronize method running, the callback of the timer will be delayed, and if the countdown is too long, the delayed time will accumulate and the real time will not Synchronize.
let i = 0;
setInterval(() => {
if (i === 0) {
console.log('start', Date.now())
let lastTime = new Date().getTime() + 10 * 1000;//10s
while (lastTime > new Date().getTime()) {
}
}
iPP;
console.log(i, Date.now())//10s+
}, 1000)
