作者:杨振兴PingCodeWiki于2021年11月15日正式上线协同编辑能力。PingCodeWiki于2019年8月上线,到现在已经两年多了。协同编辑的推出标志着PingCodeWiki基本成熟。接下来介绍一下PingCodeWiki的产品逻辑和背后的编辑器技术。内容分为四大部分,包括产品介绍部分和协同编辑技术介绍部分:1.PingCodeWiki产品能力2.富文本编辑器技术演进3.协同编辑技术探索4.知识点base产品思考1.PingCodeWiki产品能力产品定位:企业级知识库产品产品发展轨迹1.1知识生产能力基础编辑能力Markdown快速输入其他除了基础能力,还支持布局,日期,标签,提示框,代码块、附件等功能,支持识别Markdown和HTML(Excel、Word)进行外部数据粘贴。1.2知识传播能力基于内容的传播和共享也是企业知识库管理的重要组成部分,这是PingCodeWiki的一个特点。页面评论实时通知通知开启详情实现内容高效沟通闭环:评论->通知->弹框详情->回复对话&提及会员内容导出目前支持导出Word/PDF/Markdown三种文件formatspagesharingenablesharingViewSharedKnowledgeBaseSharing1.3知识管理能力每个知识库本身就是一个内容单元分层页面树可以很好的组织内容页面级权限控制因为我们专注于企业知识管理,除了基本的编辑体验,传播方便,内容组织我们也关注细粒度的权限控制,比如统一组织下如何与非知识库成员分享内容,知识库成员如何使用页面级权限等。我们仍在探索这个领域。支持团队目前支持页面级权限。共享。首页入口团队分享解决了团队中非知识库成员的内容分享问题。其他我们还提供了页面复制、移动、收藏、模板等基本功能。企业知识管理是一个持久的话题,我们还需要不断完善。1.4多人协同编辑是11月15日刚刚上线的功能,欢迎大家注册体验协同编辑互动![[杨振兴]粘贴上传-2021-11-0915_0131.png](https://atlas-rc.pingcode.com...)提供合作者列表,光标位置支持冲突自动处理支持自动版本历史记录支持离线提醒支持在线后自动同步内容历史版本目前区分临时版本和已发布版本,协同编辑过程中每1分钟更新一个临时版本自动保存。这个近乎实时保存的临时版本是协作编辑内容的快照。一旦编辑的内容被协作者误删,可以通过临时版本找回。2.编辑器技术的演进从2019年开始做Wiki产品,我们的富文本编辑器大概经历了三个阶段:旧版编辑器和新版编辑器theia编辑器想和大家分享其中的一些点,包括每个特点、限制和每个阶段的使用。PhaseServiceTimeCharacteristicsUsage老版本编辑器2020-03~2020-10基于JS的版本Slate已被弃用新版本编辑器2020-10~现在基于TS的版本Slate即将弃用theia编辑器2021-06~现在Minieditor-应用于PingCode全线产品,未来也将应用于Wiki产品。2.1新版编辑器新版编辑器于去年初疫情期间正式上线。当时老版本的编辑器刚刚开始内测,问题很多,但是因为新的基于TS的Slate确实足够吸引人,促使我们决定开发新版本的编辑器,也就是技术驱动。2.2Theia编辑器Theia最初的目标是开源,开源一个小编辑器,让其他PingCode产品可以使用,Angular社区也可以使用。目前Theia已经应用到PingCode的其他产品中,但是代码还没有达到开源的程度,还需要不断的迭代。希望Theia早日开源。3.协同编辑技术探索3.1技术选择OTvsCRDTs3.2Yjs方案方案左边是富文本编辑层,右边是Yjs的框架层,中间是转换层,因为Slateeditor框架的数据模型和Yjs的数据结构是完全不同的数据表达,所以中间层的作用就是将它们的操作相互转换,保证Slateeditor的数据结构和Yjs的数据结构Yjs的可以完全同步。Yjs方案流程图YjsBindings-Slate就是上面说的中间层。从流程图可以看出,每个客户端都会存储一份YjsShareType的数据结构,协同编辑中的消息服务通信也是基于YjsShareType。协同编辑的相应冲突处理也由Yjs数据结构承担。Yjs架构优势3.3技术影响产品功能Yjs从数据结构层面处理协同编辑中的冲突。与OT相比,它无疑更加健壮,对复杂的网络条件有很好的适应性。总体特点如下:CollaborativeFeature技术支持冲突处理基于CRDTs的冲突处理模型协作列表和光标位置Yjs提供感知(Awareness)模块离线编辑基于CRDTs的内容合并自然支持离线编辑支持版本历史Yjs提供基于版本历史onsnapshots(notfulldatastorage)协作者数量上限支持去中心化服务器,理论上支持的协作编辑上限很高。还是挺难的。以下内容仅代表个人观点。4.1分类近年来,文档产品非常流行。我感觉面向企业服务的Sass产品分为三个核心类别:分类代表了产品的共同点和不同点。新一代办公利器石墨、金山、语雀1、简单易用、稳定脑图/绘图/PPT/Excel高度协同编辑|通用点要求更高||泛办公协同|飞文档、钉钉文档||IM+文档+智能||垂直领域办公协同|研发赛道:Confluence||Agile+Wiki+Ecology|当然还有一些比较有代表性的创新产品比如Notion,xxx4.2共同点从我的角度来说,不同品类产品的难点还是有共同点:基本交互,稳定性,交互要尽量满足用户的期望。交互期望高无论是哪一类产品,对编辑体验和稳定性的要求都是一样的,交互能否满足用户期望是一个很大的问题。一是大家的交互习惯都或多或少受到了Word产品的影响。这么庞大的交互系统,搬到Web端的产品都很难。网页编辑的另一个技术壁垒是网页编辑本身已经发展了很多年,在交互上也有很多创新。虽然编辑器技术有了很大的发展,但仍然存在一定的技术壁垒。一个新产品想要突破进入市场,研发时间必须以年为单位。PingCodeWiki我们的PingCodeWiki自2019年以来的大部分时间都在打磨基础交互,以确保内容编辑的稳定性和安全性。这就是为什么我们直到今年下半年才决定支持协作编辑。而我认为我们现阶段的一个重点仍然是打磨基础交互,即努力做到“交互符合用户期望”,突破一些交互冲突。让我举一些困难互动的例子。粘贴格式我们的编辑器通常会识别Markdown和HTML格式进行粘贴,但这两种格式实际上是冲突的。用户粘贴时,粘贴板中可能同时存在Markdown和HTML两种格式的数据,程序无法准确。判断用户真实意图:我要识别Markdown格式,我要识别HTML格式。这个问题一直困扰着我,经常处理结果不符合我的预期。解决方法:当用户选择Markdown&HTML格式同时存在时,会优先识别HTML格式,提示Markdown识别转换。ps:受语雀产品Markdown快捷输入的启发Markdown快捷键输入现在是各种产品的标配,但是这种快捷输入的语法实际上可能和用户实际输入的内容有冲突,比如有序列表的语法:[1.+空格]很可能会出现冲突:用户只想输入1.+空格,默认处理让用户掉入陷阱。我经常被这个问题困扰,我也发现我们同事经常有空格的排版:可能是深受快捷键的困扰。目前我们其实还没有很好的解决办法。我们只是做了一些更严格的限制。当当前节点是标题时,我们不再识别列表的快捷输入。然后最近在用flomo产品的时候,发现他们的交互处理还不错。[1.+空格]被自动识别为列表,如果按[Backspace]键,可以返回到[1.+空格]的状态,有种一下子击中自己预期的感觉。这个很详细。富文本编辑器中这样的交互路径数不胜数,冲突也不少。这是产品需要共同探索解决的问题。4.3差异性我觉得不同形式的文档产品的功能要逐渐同化,但是现阶段各种产品的侧重点肯定是不一样的。这个方向性的问题我觉得自己有点控制不住,所以只说一下。说说我对我们所处垂直研发赛道的理解:持续打磨富文本内容编辑体验,深入企业知识管理,研发场景增强,整合PingCode产品矩阵逐步拓展编辑能力,如支持:流程图、脑图、GanTetu等功能有点干,所以贴了一张PingCode产品矩阵图。从整体上看,Wiki不仅可以承担基础知识的积累,还可以承接其他PingCode产品的链接。一些内容的输出和细节的交流是基于维基页面内容的链接。未来,我们还会考虑通过应用市场的形式,扩大维基的内容生产能力。4.4创新产品我个人认为Notion可以作为文档产品创新的代表。拓展了文档的边界,可玩性很强。另一个是我最近看到的一款国外产品,提出了以文档为中心的办公协作(Almanac),受到资本的高度推崇,变相说明这个领域的现状依然不明朗,创新产品还是有很大的空间的。在攻城战中脱颖而出的机会。关于这篇文章的内容,我们有一个在线直播来分享。如果你有兴趣,你可以了解一下。https://www.bilibili.com/video...立即体验PingCodeWiki的协同编辑
