Thank you. For quick reference, I will put related materials here for anyone who is interested in this topic:

[hkjpotato]

Thank you. For quick reference, I will put related materials here for anyone who is interested in this topic:

• React fiber algorithm link: TBA
• Fre algorithm link: TBA
• Vue3 algorithm link: https://github.com/vuejs/vue-next/blob/master/packages/runtime-core/src/renderer.ts#L2365
• Vue2 algorithm link: TBA
• Inferno (Vue3 is similar to it): https://github.com/infernojs/inferno/blob/5dedf9d4fc67f7a6d9c3d6cc27e7c21ccc707197/packages/inferno/src/core/implementation.ts#L318 (not sure)

related explanation

• https://www.bebopser.com/2020/12/20/vue3source5/#sketch
• http://hcysun.me/vue-design/zh/renderer-diff.html#%E7%A7%BB%E9%99%A4%E4%B8%8D%E5%AD%98%E5%9C%A8%E7%9A%84%E5%85%83%E7%B4%A0-2

Originally posted by @hkjpotato in frejs/fre#259 (reply in thread)

[hkjpotato]

// https://v8.dev/blog/elements-kinds#avoid-creating-holes
https://github.com/facebook/react/blame/main/packages/react-reconciler/src/ReactFiberLane.new.js#L556
https://github.com/facebook/react/pull/20071/files

[hkjpotato]

https://stackoverflow.com/questions/5349425/whats-the-fastest-way-to-loop-through-an-array-in-javascript

[hkjpotato]

https://twitter.com/dan_abramov/status/1120971795425832961?lang=en

I probably misunderstood the relationship between react16/17/18
terms: fiber, time slice, sync and async, concurrent, scheduling, priority.

[hkjpotato]

https://segmentfault.com/a/1190000041268486

before 16: recursive sync , 16: linkedlist while sync
original priority : expirationTime, bug of batch and priority "0.0.0-experimental-5faf377df",
published over a year ago by acdlite npm@andrewclark.io

newer: lane "0.0.0-experimental-3d0895557", *react-18.9.9(
published a year ago by gaearon dan.abramov@gmail.com

---

// This is the entry point for synchronous tasks that don't go through Scheduler 
function performSyncWorkOnRoot {
   ...
   do workLoopSync
}

function workLoopSync() {
  // Already timed out, so perform work without checking if we need to yield.
  while (workInProgress !== null) {
    workInProgress = performUnitOfWork(workInProgress);
  }
}

// This is the entry point for every concurrent task, i.e. anything that
// goes through Scheduler.
function performConcurrentWorkOnRoot(root, didTimeout) {
   ...

function workLoopConcurrent() {
  // Perform work until Scheduler asks us to yield
  while (workInProgress !== null && !shouldYield()) {
    workInProgress = performUnitOfWork(workInProgress);
  }
}

TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary

[hkjpotato]

facebook/react#19804
better explanation

[hkjpotato]

这些用词你不去看过往版本的comments根本不知道在讲啥子
一会asyncmode一会concurrent一会time slice一会resumable。直到现在我还是不是很确定commiting to dom那一步能不能“分片”。
我有一种感觉。react16和15的default是一样的 区别在于一个是硬跑完一个while loop，可能15就是传统recursion吧

[hkjpotato]

基本上onchange这种还是会以workLoopSync执行，不理会scheduler不知道yield，最后会call commit
但是在这个过程中遇到defferred，由于defferred会再次触发一次内部setState，则，这一次的更新是属于concurrent的