由于RangeError导致的数据持久性:最大调用堆栈大小超出(Y.JS)

Question

我正在使用带有hocuspocus和tiptap编辑器的Y.JS，并面临在应用程序上持久化我的数据的问题，并且由于以下错误而触发。

sync.js:86 Caught error while handling a Yjs update RangeError: Maximum call stack size exceeded
at Transaction.js:307:38
at Map.forEach (<anonymous>)
at cleanupTransactions (Transaction.js:307:30)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
at cleanupTransactions (Transaction.js:370:9)
readSyncStep2 @ sync.js:86
readSyncMessage @ sync.js:121
applySyncMessage @ MessageReceiver.ts:70
apply @ MessageReceiver.ts:31
onMessage @ HocuspocusProvider.ts:561

有人能帮忙吗?

尝试关闭一堆东西，但错误仍然出现。

Answer 1

这是Y.js的一个bug。问题是cleanupTransactions()是一个递归函数，所以如果有大量的清理工作要做，它会溢出调用堆栈并崩溃。

我已经在github.com/yjs/yjs的一个分支上坐了几个月修复了这个错误。看到你的问题促使我最终打开了一个关于yjs/yjs的PR来修复这个bug。在PR或相关的讨论问题#522上发表评论，以鼓励维护者合并我的PR或实现替代修复。

如果没有修复此问题，目前无法将Y.js用于大型文档。我碰巧认为我的PR在它的简单性上是相当优雅的:-)，但是维护者可能想要采取不同的方法。

(简短的旁白:因为递归是一个尾部调用，浏览器的Javascript引擎实际上可以优化它，但最常见的浏览器，Chrome，不实现尾部调用优化。你会注意到这个bug不会在Safari中发生，因为Safari/WebKit实际上正确地优化了尾部调用递归。