I spent a few hours debugging an infinite loop issue today in our Lexical editor. Turns out we had pushed code like this:

editor.registerUpdateListener(() => {
  editor.update(() => {
    // actually just reading the state here
  })
})

This caused an infinite update loop under certain (obscure) circumstances. I'm unclear on why not always, but that's besides the point.

My proposal would be to introduce a check, similar to the one React does for renders, or to the one Lexical already does for node transforms, to error after an unreasonable amount of synchronous update cycles. Debugging infinite loops is a pain in the lower part of the back: your browser (and devtools) become unresponsive, and you have to start over every time to replicate the bug. It also prevents tools like Replay from successfully recording the bug, since they can't finish and upload the recording if the main thread is permanently blocked.

I'm down to contribute this change, btw. I would appreciate some directions to do so, just a few bullet points in the context of this task.