worker.postMessage会被阻塞?

如下代码所示

<body>
  <button onclick="start()">开始</button>
  <script>
    function line() {
      const start = Math.floor(Date.now() / 1000) * 1000;
      const delay = 5000;
      while (true) {
        const end = Math.floor(Date.now() / 1000) * 1000;
        if (end - start >= delay) {
          return;
        }
      }
    }

    function start() {
      const worker = new Worker("./worker.js");
      worker.postMessage({ type: "init" });

      // setInterval(() => {
      //   console.log("setInterval");
      //   line();
      // }, 1000);

      line();
    }
  </script>
</body>

// worker.js
function init() {
  setInterval(() => {
    console.log("worker---");
  }, 1000);
}

self.addEventListener("message", () => {
  console.log("self");
  init();
});

点击开始,5s后worker.js 才会收到消息,打印出self,然后1s打印1次worker---

但是,如果将line()放在setInterval中worker.js会1s打印1次worker---

不是很理解line()是后调用的,但是postMessage5s后才被触发,还是说是worker中的问题

阅读 1.3k
1 个回答

说明浏览器是等当前事件循环完成再去处理跨线程通讯的,而费时的同步操作 line 会显著延长当前事件循环的时间长度,实现就是这么个实现,也不能说错。
硬要算是个问题的话,那就是浏览器的问题。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏