有没有简单的方法可以在js中运行协程而不使用第三方库？

Question

尝试做类似Babylon.js的事情https://doc.babylonjs.com/divingDeeper/events/coroutines

    const spawnMeshesCoroutine = function* () {
      spawnTheFirstMesh();
      yield;
      spawnTheSecondMesh();
      yield;
      spawnTheThirdMesh();
    };
    scene.onBeforeRenderObservable.runCoroutineAsync(spawnMeshesCoroutine());

但想知道是否有任何简单的 JS 示例来运行一个更简单的协程，可以在 JS 中处理一些昂贵的任务而不阻塞 UI。

“昂贵任务”的实验：寻找解决方案来为React启用非阻塞60fps自动建议UI

Answer 1

对于那些搜索这个的人。 我不知道如何用框架来做到这一点，但随着时间和更新：

const counter = 0;
const count = true;

function delay(ms) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
async function myAsyncTask() {

await delay(5000);
count = false;
await delay(4000);
count = true;

}

myAsyncTask();

const animate = (t) => {

if (count) counter ++;
if(!count) counter--;

renderer.setSize(window.innerWidth, window.innerHeight);
renderer.render(scene, camera);
};
renderer.setAnimationLoop(animate);

Answer 2

跨多个事件循环运行函数的方法是：

async function spawnFirstMeshAsync() {
  return spawnFirstMesh();
}

async function spawnSecondMeshAsync() {
  return spawnSecondMesh();
}

async function spawnThirdMeshAsync() {
  return spawnThirdMesh();
}

async function spawnMeshes() {
  await spawnFirstMesh();
  await spawnSecondMesh();
  await spawnThirdMesh();
}

在像 Babylon.js 那样与框架同步方面，请查看

requestAnimationFrame

。