倒数计时器降低页面速度:如何为单个页面创建多个正在运行的倒数计时器?

时间:2019-07-25 14:54:25

标签: javascript timer

我正在尝试创建一个在页面上同时运行多个倒数计时器的网站,包括可能显示毫秒的时间。

到目前为止,我一直在使用 setInterval()函数,但是仅运行了几个 setIntervals()后,页面开始变慢,秒数开始变慢下降和滞后等等,这是行不通的。

timeanddate.com,Toggl或Harvest这样的专业网站如何允许您同时使用多个倒数计时器,而又不会降低页面的速度,而这些倒计时总是与当前时间完美同步的?没有滞后或问题吗?

我想一次在页面上同时运行25个倒数计时器,而不会减慢页面速度,或者不必每秒向服务器发送数百个请求?

我正在尝试创建一个个人的“待办事项”应用程序,该应用程序为每个任务设置计时器,我希望看到一整天所有任务的计时器都在运行。

1 个答案:

答案 0 :(得分:0)

我将首先开始使用moment.js,因为它使您使用javascript的时间变得非常快。

现在,当您创建任务时,您可以使用moment.js存储时间戳记该任务的到期时间。

然后您有一个全局计时器,它每秒获取一次时间。

毫秒级是一个坏主意,因为事件循环会减慢应用程序本身的时间。 (每秒不会是100%准确的,但是它将获得正确的时间,每秒钟浏览一次)。

此全局计时器将触发更新每个任务计时器的功能,将当前时间与任务到期时间进行比较。

无需25个计时器!只需一个处理函数的计时器即可计算两次差!