时间戳

首页 > 解决方案 > 如何像 Google 文档一样在 quill 编辑器中执行跟踪更改？

node.js - 如何像 Google 文档一样在 quill 编辑器中执行跟踪更改？

问题描述

我已经通过使用 @teamwork/sharedb 和 @teamwork/sharedb-mongo 适配器在后端 NodeJS 中存储更改来在 quill 中实现协作编辑。但是，对于我们如何像谷歌文档建议模式一样实时显示跟踪变化并添加评论功能，我仍然处于两难境地？

标签： node.jsangularmongodbgoogle-docsquill

解决方案

一年后，我将概述我们迄今为止的发现：

带有 OT 的 quill js 方法

我们尝试使用 QuillJS 实现跟踪更改/建议，并且取得了相对较大的进展。但最终它并没有真正起作用，因为 OT（操作转换，用于同步更改的格式）不支持分层结构。CKEditor 的团队更改了 OT 以支持这一点。但不幸的是，这似乎需要做很多工作，而且他们的代码已关闭（https://ckeditor.com/blog/Lessons-learned-from-creating-a-rich-text-editor-with-real-time-collaboration/）。谷歌也用OT解决了它，但他们的代码也没有开放。因此，据我所知，到目前为止，还没有开源解决方案可以用 html 解决跟踪更改/建议。而且似乎没有人愿意这样做，因为努力似乎非常高。所以我们的结论是：我们停止了这种方法。

一段时间以来，我们只是处理其他问题，而将编辑器放在一边（在我们的项目中要做的其他事情太多了）。但就在最近，我们开始了第二种方法，它仍处于起步阶段，但看起来很有希望。

前镜方法

Prosemirror 也有相对定位格式，不过不是 OT，他们叫step。这似乎更加灵活，Prosemirror 的 doc 结构类似于 html 文档的 DOM 结构。这里介绍（https://marijnhaverbeke.nl/blog/collaborative-editing.html）。

对于 Prosemirror，已经有一些解决跟踪更改/建议问题的方法。如果您在此站点（ https://www.tag1consulting.com/blog/evaluating-real-time-collaborative-editing-solutions-top-fortune-50-company ）上向下滚动一点，您会找到一个汇总当前可用的表格解决方案。对于 Prosemirror，这是：

1. Prosemiror 合作

Prosemirror collab 是 Prosemirror 团队提供的解决方案（https://github.com/ProseMirror/prosemirror-collab，此处示例https://prosemirror.net/examples/collab/#edit-Example）。正如您在上面的总结中看到的那样，这种方法并不是最可取的。人们说它不能很好地扩展，而且这种方法效率不高。最近有人试图对此进行一些改进（https://github.com/benaubin/prosemirror-collab-plus）。

2. 使用 CRDT 的 Yjs

另一种方法是使用 Yjs。这甚至可以去中心化，允许离线编辑等。这种方法看起来很有前途，Yjs作者的这篇文章描述了Prosemirror协作方法的优势（https://discuss.prosemirror.net/t/prosemirror-crdts/ 1190/13 )。它基于 CRDT ( https://josephg.com/blog/crdts-are-the-future/ )，它是 OT 的更新替代方案。对于 Yjs，已经存在一个 Prosemirror 绑定（https://github.com/yjs/y-prosemirror），它主要从绝对 Yjs CRDT 位置转换为相对 Prosemirror步骤位置，反之亦然。不幸的是，目前没有用于建议的插件。在这里查看我的帖子（https://discuss.yjs.dev/t/live-tracking-track-changes/293）。

其他方法/灵感

在过去的几周里，我收集了一些使用 Prosemiror 的方法。我认为他们中的大多数人都使用 Prosemirror collab，但实际上我不确定。但无论如何，这些方法可能有助于在 Prosemirror 和 Yjs 上实现它。这是一个基于 Prosemirror 的编辑器列表，允许跟踪更改/建议：

外表

我们正在开发一个开源项目，目前只是在没有安迪资助的空闲时间（https://github.com/openevocracy/openevocracy），因此我们可能只会缓慢进展。但是我们所有的时间和精力现在都集中在编辑器上，我会尽快在这篇文章中更新社区 ( https://discuss.yjs.dev/t/live-tracking-track-changes/293 )有一些新的结果。

我希望这个信息收集有点帮助:)

如果有人有兴趣联手，我们对任何形式的合作都非常高兴！

推荐阅读