3 ms·

I really like this. This feels like what the native APIs would look like if Promises existed in the 90s. One thing that might be improved is removing the `Prom

I really like this. This feels like what the native APIs would look like if Promises existed in the 90s. One thing that might be improved is removing the `Promise.resolve()` that `yieldOrContinue` returns when it is not time to yield. Awaiting non-Promises is totally fine: you just get that value back (the `await` does nothing). Avoiding constructing a resolved promise can help reduce the number of objects that get allocated, especially if you're in a loop doing a lot of work.

astoilkov 3y ago
It's done — https://github.com/astoilkov/main-thread-scheduling/commit/0bbbb9d93a7408df0c1160eecbcf28e4afe9292c https://github.com/astoilkov/main-thread-scheduling/commit/0.... Thanks. A little thing but a great improvement. I'm now wondering why I did that.
- rixtox 3y ago
  You should do some measurement before calling it an improvement. If you read the ECMAScript standard[1] or this blog post from V8[2] about the inner workings of the `await` keyword, you would know even if you `await` a non-Promise value, it would still create a new Promise and put the suspended routine onto the microtask queue. So the change you made won't make a difference. Besides, there is a JavaScript language feature that can give you finer control on routine suspension and resumption, decoupled from any of the microtask or macrotask queue. It's called the generator function. There are some good coroutine libraries based on generator functions, e.g. co.js[3] and redux-saga[4]. You can easily make something similar that can resume the suspended routine according to your scheduling policy that prioritize main thread rendering. [1]: https://tc39.es/ecma262/#sec-promise-executor https://tc39.es/ecma262/#sec-promise-executor [2]: https://v8.dev/blog/fast-async#await-under-the-hood https://v8.dev/blog/fast-async#await-under-the-hood [3]: https://github.com/tj/co https://github.com/tj/co [4]: https://redux-saga.js.org https://redux-saga.js.org
  - astoilkov 3y ago
    Yeah, you are right. I reverted the commit. About the generations, do you imagine a function that accepts a generator function and the user uses yield? Something like: ``` mainThreadScheduling(function *(yieldOrContinue) { yield yieldOrContinue; }) ```

astoilkov 3y ago

It's done — https://github.com/astoilkov/main-thread-scheduling/commit/0bbbb9d93a7408df0c1160eecbcf28e4afe9292c https://github.com/astoilkov/main-thread-scheduling/commit/0.... Thanks. A little thing but a great improvement. I'm now wondering why I did that.

rixtox 3y ago
You should do some measurement before calling it an improvement. If you read the ECMAScript standard[1] or this blog post from V8[2] about the inner workings of the `await` keyword, you would know even if you `await` a non-Promise value, it would still create a new Promise and put the suspended routine onto the microtask queue. So the change you made won't make a difference. Besides, there is a JavaScript language feature that can give you finer control on routine suspension and resumption, decoupled from any of the microtask or macrotask queue. It's called the generator function. There are some good coroutine libraries based on generator functions, e.g. co.js[3] and redux-saga[4]. You can easily make something similar that can resume the suspended routine according to your scheduling policy that prioritize main thread rendering. [1]: https://tc39.es/ecma262/#sec-promise-executor https://tc39.es/ecma262/#sec-promise-executor [2]: https://v8.dev/blog/fast-async#await-under-the-hood https://v8.dev/blog/fast-async#await-under-the-hood [3]: https://github.com/tj/co https://github.com/tj/co [4]: https://redux-saga.js.org https://redux-saga.js.org
- astoilkov 3y ago
  Yeah, you are right. I reverted the commit. About the generations, do you imagine a function that accepts a generator function and the user uses yield? Something like: ``` mainThreadScheduling(function *(yieldOrContinue) { yield yieldOrContinue; }) ```