AI 时代,一群人在卷编辑器:AI 写作、AI 笔记、AI 知识库,一个比一个炫。
可打开底层看,大家用的还是那几套东西,遇到的也还是那几个老问题:内容存成 JSON,来回转 Markdown 时把你的原文改掉;所见即所得和源码模式是两套编辑器,切一次丢一点;协同一上来,结构就开始出怪事。AI 生成得再快,落到这些框架里照样会丢格式、错位置。
我做 ProseMirror 相关的产品三年了,这些坑基本都踩过。这次我不想再做一个编辑器应用,我想先把编辑器框架这件事做对。这篇讲其中一条线:MSFE(Markdown Source-First Editor),一个源码优先的 Markdown 编辑器框架。
先放成品,打开就能用:msfe.quirekit.com
一、别人是怎么做的
先看看最近几年流行的笔记软件和编辑器,底层都是什么。开源的看了仓库源码,闭源的只采用官方文档和工程博客,官方没说的写“未公开”(截至 2026 年 10 月):
以上仅收集公开信息,方便对照技术路线,不评价产品好坏。每个产品的取舍都有它的场景。
按“编辑时改的是什么”,大致可以分成三类:
- 块编辑 / 富文本:Notion、飞书、思源、AFFiNE、AppFlowy。编辑的是块数据或文档树,体验最接近 Word 和 Google Docs。Markdown 只是导入导出的格式。
- 源码派:Obsidian、妙言、Logseq。改的始终是 Markdown 原文,源码不会被改写。可要么停在“源码 + 高亮 + 预览”,要么做成“实时预览”,标记符号多少都会露出来,离真正的富文本还差一点点。
- 两套编辑器:MarkText、NoteGen、Flowix、Joplin。一套富文本加一套源码,切换时互相转换。富文本体验有了,可每切一次、存一次,都要走一遍“文档树 → Markdown”的转换。
不少主打本地、离线的产品,内容存的是数据库或 JSON,Markdown 主要用在导入导出上。
二、主要问题:转换只能按规定来,你的源码保不住
富文本派要读写 Markdown,就得在 ProseMirror 的 node、mark 和 Markdown 源码之间来回转换。问题是,这个转换只能“按规定转”。
拿最常用的几个实现看(都是看源码得出的):
prosemirror-markdown 1.13.4
- 斜体、粗体写死成 * 和 **,你写的 _斜体_、__粗体__ 存一次就变了。
- 无序列表默认一律变成 *,你习惯的 - 没了。
- 有序列表会被重新编号,1. 1. 1. 存完变成 1. 2. 3.。
- 行尾两个空格的换行,统一改成 \。
- 文本里的 *、[、]、~ 一律加反斜杠转义。
- 遇到它不认识的语法,直接报错。默认的 schema 里没有表格、脚注、删除线。
Tiptap 官方的 @tiptap/markdown(3.30)
- 粗体、斜体同样写死;无序列表一律输出 -;有序列表重新编号。
- 没有对应渲染器的节点,直接输出空字符串,内容就这么静默消失了。
- 官方文档自己也写着:这还是早期版本,批注不支持,表格每个单元格只能放一个子节点。
社区的 tiptap-markdown 已经停止维护。它遇到表达不了的节点,会输出一个 [nodeName] 占位;表格一有合并单元格就降级成 HTML,列对齐信息也丢了。
这些不是 bug,是这个架构必然的结果:文档的权威是那棵 JSON 树,Markdown 只是它的一种“打印方式”。打印方式只有一种,所以你写的那份源码,早在第一次保存时就已经不在了。
对一个人写笔记,可能无所谓。可对这些场景很要命:
- 文档放在 Git 里,改一个字,diff 却是满屏的格式变化;
- AI 只改了一段,整篇的写法却都被“规范化”了;
- 同一个文件还要给 VS Code、静态站点、别的 Markdown 工具用。
三、“Markdown 做不了复杂块”,其实大错特错
常听到一种说法:Markdown 表达不了复杂结构,像多维表格、数据库视图,所以只能存 JSON。Logseq 的联合创始人在 2024 年解释为什么做数据库版本时,也提到 Markdown 的结构化数据支持有限,缺少持久 ID、时间戳这些东西。
持久 ID 这类问题确实存在,后面会讲。可“做不了复杂块”是错的。
Markdown 本来就有一个非常好用的容器:代码围栏。在 MSFE 里,多维表格、流程图、思维导图、白板都存成一个代码围栏,里面放的是可以反复打开编辑的数据:
```quirekit-data-view
{ ...表格的字段、记录、视图... }
```
- 在 MSFE 里,它显示成一个能直接编辑的多维表格;
- 在 GitHub、VS Code 或者任何普通的 Markdown 工具里,它就是一段代码,不会坏,也不会丢;
- 用户点“确定”之后,才把新数据写回同一个围栏。其他行一个字节都不动。
复杂块的问题不在 Markdown,而在你有没有给它设计一个好的落点。
四、Markdown 真正的限制在哪
说 Markdown 无所不能也不诚实。它真正的限制在语法本身,我用 micromark 4.0.2 加 GFM 扩展逐条实测过:
1. 表格单元格里只能放行内内容。 想在单元格里放一个列表或者一段代码?表格当场被拆坏:
| A | B |
| --- | --- |
| - 一
- 二 | x |
解析结果:第一行变成 - 一 和一个空单元格,- 二 | x | 被挤出表格,成了表格外面的一个列表项。代码块放进单元格也一样,整张表都乱了。单元格里想分段,只能写 <br>。
2. 格式不能随便嵌套。
- 行内代码里不能再加粗:`**加粗**` 显示的就是带星号的原文。
- 链接里不能再套链接:[外层 [内层](b) 文字](a),外层链接直接失效,变回普通文字。
- 下划线、文字颜色、高亮、字号,Markdown 里根本没有,只能写 HTML。写在行内的 <u>**粗**</u> 还好,HTML 和 Markdown 都能生效;可一旦写成 HTML 块,比如 <div align="center"> 里面写 **居中加粗**,里面的 Markdown 就不再解析,直接显示成纯文本的星号。
3. 中文标点会让加粗失效,这个最坑中文用户。
这是**“加粗”**后面的字
注意**(重要)**这里
这两行都不会加粗,渲染出来就是原样的星号。原因是 CommonMark 判断 ** 能不能开始或结束强调,要看它两边是不是标点和空白。中文引号、括号是标点,后面又紧跟着汉字,规则就判它不成立。英文写作几乎碰不到这个问题,中文写作却天天碰到。
4. 还有一些是语法层面根本没有的东西:
- 表格没有合并单元格,没有列宽,没有单元格底色;
- 段落没有对齐、缩进、行距、段前段后;
- 块没有稳定的 ID,“引用第 3 段”这种需求,段落一移动就失效;
- 批注、修订没地方挂,没有锚点;
- 方言太多,GFM、各家扩展、各个软件的私有语法,同一份文件换个工具,显示就不一样。
所以我的态度是:
- 语法表达不了的,不假装能表达。 MSFE 不认识的语法,原样留在源码里,不丢也不改;
- 复杂对象,用代码围栏装数据;
- 版式类的需求,比如页面、字体、段落样式,交给导出模板和分页文档去做,不往 Markdown 里硬塞。
五、两套编辑器,又重又不尊重源码
Markdown 派想做所见即所得,最常见的做法是:一套富文本编辑器,加一套源码编辑器,切换时互相转换。
Joplin 桌面端就是 TinyMCE 加 CodeMirror。它的官方帮助页很诚实,直接列出了在富文本编辑器里编辑 Markdown 笔记会出的问题:大多数插件格式会丢;表格没有表头会被补一个空表头;同一个列表里不能混用复选框和普通列表项;Markdown 里的 HTML 可能丢;引用式链接会被改成行内链接。
MarkText 是自研的 Muya 加 CodeMirror 5,读入用 marked 转成 HTML,写出用 turndown 再转回 Markdown。
两套编辑器意味着:
- 包体积和内存翻倍,两套快捷键、两套撤销历史、两套插件;
- 每切一次视图,就做一次“Markdown → 树 → Markdown”,这正是第二节说的那条有损的路;
- 光标、选区、滚动位置在两边对不上,切过去还得重新找刚才写到哪了。
六、协同:ProseMirror 的 Yjs 协同,坑比想象中多
富文本派做协同,基本都走 Yjs 加 y-prosemirror(Tiptap 的协同也是这套)。我们做 Word 级文档时专门测过,也翻了上游的文档和 issue:
上游自己承认的问题(y-prosemirror 的 CAVEATS 和 issue):
- 结构不合法时,直接删节点。 两个人并发修改,可能产生不符合 schema 的结构,比如一个引用块里的段落被两个人同时删光了。绑定的处理是把整个父节点删掉,离线久了的用户尤其容易中招。
- 远端每次更新都整篇替换。 作者在 issue 里原话是 “y-prosemirror replaces the complete document with every change”。结果是 transaction 的位置映射失效,本地的装饰、插件状态都得自己用相对位置重建。
- 拆段、合段、提升没有原生表示。 拆段在 Yjs 里是“删掉原段落的尾巴,再插一个新节点”,并发时语义就可能跑偏。
- 撤销要换掉。 不能用 ProseMirror 自带的 history,要换成 Yjs 的 UndoManager。Tiptap 文档也要求开协同时关掉 StarterKit 里的撤销重做。
- 远端更新时恢复选区可能抛错,导致这次更新在本端被跳过,两边状态分叉(v1.3.7,issue 还开着)。
- v1 和 v2 的数据格式不兼容,新旧客户端不能同时编辑同一篇文档。
我们自己实测的(Yjs 13.6.33 + y-prosemirror 1.3.7、Tiptap 的 y-tiptap 3.0.9、Yjs 14 预发布版,三组结果一致):
这些不是部署问题,换个服务器、多加几台机器都解决不了。根子在“树形文档怎么映射成 CRDT”这件事上。
MSFE 的协同为什么没有这类问题:MSFE 协同的是 Markdown 源码本身,一个 Yjs 文本。任何一段文本都是合法的 Markdown,所以不存在“结构不合法要删节点”;结构是从文本重新解析出来的,所以也不存在“拆段合段没有表示”。两个人在同一个地方改,结果可能需要人看一眼,比如把同一行表格改成了不同的样子,但内容不会因为结构冲突凭空消失。撤销是协同撤销,只撤你自己的修改。
七、为什么一定要尊重源码
说到底,就一句话:你写下的那份 Markdown,就是文档本身。
- Git 友好:改一个字,diff 就是一个字;
- AI 友好:大模型读写的本来就是 Markdown,它改哪一段就只动哪一段,不会顺手把全文“规范化”;
- 工具自由:同一份文件,可以在 VS Code 里改、给静态站点渲染、给别的工具处理,不被任何一个编辑器锁死;
- 长期可读:十年后它还是一份纯文本。
八、CodeMirror 也能做“富文本”
很多人以为 CodeMirror 只能做源码编辑器,要做所见即所得就得上 ProseMirror。其实 CodeMirror 6 的装饰和 widget 足够做出“看起来就是富文本”的效果:标题变大、标记符号藏起来、表格画成表格、公式渲染成公式、代码围栏里的数据渲染成流程图和多维表格。可底下的文本一个字都没变。
MSFE 本身就提供三种可以编辑的呈现:文档视图(标记符号全部隐藏,看起来就是富文本)、实时预览(编辑到哪里,哪里露出 Markdown 标记)、源码视图。它们是同一个 CodeMirror 实例上的不同呈现,不是三套编辑器。切换时不做任何转换,选区和撤销历史都还在,改的永远是同一份 Markdown。
QuireKit 的 MD Editor 就是在 MSFE 上面拼出来的成品:加上工具栏、斜杠菜单这些界面,再加一个只读的阅读视图,用来渲染同一份源码。
文档视图:标记全部隐藏,看起来就是富文本。
实时预览:光标在哪一行,哪一行就露出 Markdown 源码,比如这里的公式行变成了 LaTeX,其他地方照常渲染。
源码视图:同一份内容,就是这份 Markdown。
源码优先也有代价:每次输入都要更新语法树,文件一大就慢。
这个问题我其实不是第一次碰到。之前我做过一个开源项目 Incremark,专门解决 AI 流式输出时 Markdown 的增量渲染:模型每吐出一段文字,不重新解析整篇。做 MSFE 时我发现,编辑器的增量解析和流式渲染其实是同一个问题,而且在解析器这一层能做得更彻底。于是我直接改了 Lezer 的增量解析,在它上面重写了新版 Incremark。现在 MSFE 编辑、MD Editor 的阅读视图、AI 流式回复的显示,用的都是同一套解析。Incremark 的来龙去脉,以及我为什么放弃了第一版,后面单独写一篇细讲。
具体的优化是给 Lezer 的 Markdown 增量解析加了“复用证明”,解析器会记下哪些区间是原样复用的,编辑器据此直接跳过没变的部分。1 MiB 的文档连续输入 20 次:
证明不成立的地方,会退回完整比较,所以正确性不受影响。
九、为什么要封装成框架
上面这些,单独做一个编辑器应用也能做。我把它做成框架,是因为这些问题每个做编辑器的人都会碰到,没必要每人重新踩一遍。
MSFE 的写法是 Tiptap 风格的,装上什么扩展,就能编辑什么:
import { createMsfeEditor } from '@quirekit/msfe-core'
import { StarterKit } from '@quirekit/msfe-starter-kit'
const editor = createMsfeEditor({
parent,
documentId: 'note-1',
markdown: '# Hello\n\n**Markdown** stays the source.\n',
mode: 'live',
extensions: [StarterKit],
})
editor.getMarkdown() // 永远是那份源码
- 内核不依赖 Vue 或 React,也提供 Vue、React 组件;
- 现成的扩展有:标题、加粗、链接、图片、代码块、公式和 Mermaid 等扩展语法、HTML 和 HTML 沙箱、流程图、思维导图、白板、多维表格;
- 协同(含 Hocuspocus 服务端)也是扩展。
这些都是 MIT 开源。AI 读写文档、改动以“待审阅”的形式显示,以及批注,是商业组件,开发和评估免费。
十、MD Editor 和周边生态
不想自己拼的,直接用 MD Editor:工具栏、四种视图、斜杠菜单、表格、公式、图表都配好了,几行代码就能放进 Vue 项目。
<script setup lang="ts">
import { MdEditor } from '@quirekit/md-editor/vue'
import '@quirekit/md-editor/styles.css'
</script>
<template>
<MdEditor markdown="# Hello" label="Document" />
</template>
周边的编辑器也都是独立的包:公式编辑器(LaTeX 和 Word 公式互转)、流程图、思维导图、白板、Mermaid / PlantUML / Graphviz 文本绘图、多维表格,以及给 AI 边生成边显示用的流式 Markdown 渲染(Incremark)。所有界面都来自同一套 UI 组件库,亮色暗黑一键切换。
十一、专业场景:Word 和 PDF,两套方案
Markdown 写完,总有人要 Word、要 PDF。这里我们给了两套方案。
开源方案(@quirekit/md-editor-basic-export,MIT):用成熟的开源库来转。Markdown 转 Word 用 md-to-docx,Word 转 Markdown 用 Mammoth 加 Turndown,PDF 用 pdfmake,全在浏览器里完成。MSFE 特有的内容会降级:流程图、思维导图、白板导出成预览图,其他嵌入块变成占位。每一处降级都会写进导出报告,不会悄悄丢掉。
商业方案:不走“Markdown 转 HTML 再转 Word”这条路,而是把 Markdown 转进和我们分页文档编辑器 Classic 同一套文档模型,再交给 Classic 的排版引擎输出 Word、PDF 和 OFD:
- 能定模板:页面、字体、段落样式写成导出模板,同一份 Markdown 可以按公司模板、论文模板、公文模板导出;
- 公式是 Word 原生公式,不是图片;
- 自定义块能往返:流程图、思维导图在 Word 里显示为图,同时把原始数据带进文件。再导回 Markdown 时,能恢复成可以继续编辑的块;
- 有损就说出来:每次转换都会给出报告;开严格模式的话,只要有一点损失就直接拒绝;
- 和富文本打通:因为用的是同一套模型和排版,Markdown 导出的 PDF、OFD,和分页文档编辑器里看到的版式一样。导出的 Word,也能在 Classic 里接着按页编辑。
顺便说一下 Classic
Classic 就是上面提到的那个分页文档编辑器,是 QuireKit 的另一条线:基于 ProseMirror,自己排版、真正分页,画在 Canvas 或 SVG 上。它解决的是另一类问题,有机会单独写一篇。官网首屏就是它,可以直接上手试:quirekit.com
最后
QuireKit 不是某一个编辑器,而是一整套编辑器生态:两套 Tiptap 风格的编辑器框架(ProseMirror 线和这篇讲的 CodeMirror 线 MSFE),上面是分页文档、块编辑器、Markdown 编辑器,以及一堆周边编辑器,共用一套 UI 组件库。开源部分全部 MIT,闭源商用也可以。
目前还是 alpha,API 还会变,欢迎来试、来挑刺:
- MSFE:msfe.quirekit.com
- 在线体验:quirekit.com
- 文档:docs.quirekit.com
- GitHub:github.com/quirekit/qu…
觉得这个方向有意思的话,点个 Star 就是对我最大的支持。也很想听听:你们做 Markdown 编辑器时,被哪个坑卡得最久?
本文由 AI图鉴自动抓取并翻译,版权归原作者所有;如需查看原文请点下方链接。
In the AI era, a group of people were in the volume editor: AI writing, AI notes, AI knowledge base, one more than the other.
But if you open the bottom, you're still using the same set, and you're still having the same old problem: The content is stored in JSON, changing the original text as it turns around Marktown; the result and source mode are two sets of editors, one cut at a time; together, the structure starts to get weird. AI is created as fast as possible, and drops in these frames in the wrong format.
I've been doing Prose Mirror related products for three years, and these pits have basically been stepped on. I don't want to do any more editor applications this time, but I want to get the editor frame right. This is one of the lines: the MSFE (Markdown Source-First Editor), a source code-prioritized Markdown Editor Framework.
First put the product and open it: msfe.quirekit.com
I. How does someone else do it?
Let's take a look at the notes software and the editor that's been popular in recent years. Open sources looked at the warehouse code, closed sources used only official documents and engineering blogs, and did not say "unpublished" (as of October 2026):
The above information is collected only in the public domain, so as to facilitate control over technical routes and not to evaluate whether products are good or bad. Each product has its scenario.
Depending on what has been changed during editing, it can be broadly divided into three categories:
- Block Editor / Rich Text: Notion, Flying Book, Thinking, AFFINE, AppFlowy. Edits a piece of data or document tree with the closest experience to Word and Google Docs. Markdown is just an imported export format.
- Source: Obsidian, great speech, Logseq. The change is always the original Markdown and the source code will not be rewritten. But either stop at " Source + Highlight + Preview ", or make a " Real Time Preview ", the tags will come out at least a little bit closer to the real rich text.
- Two sets of editors: MarkText, NoteGen, Flowix and Joplin. A set of rich text plus a set of source codes to convert each other when switching. Rich text experience is available, and every time you cut, you save it, you have to go through the conversion of the Document Tree Markdown.
Many of the main local, offline products are stored in databases or JSON, Markdown, mainly for import export.
II. MAIN ISSUES: The conversion can only take place as required and your source code cannot be preserved
To read and write Markdown, the rich text pie has to switch back and forth between ProseMirror's node, mark and Markdown source code. The problem is that the conversion can only be “as required”.
Take a few of the most common realizations.
prosemirror-markdown 1.13.4
- Italics, bolds, * and **, you wrote italics, bolds, it changed once.
- You're used to it.
- Ordered lists will be renumbered, 1.1.1. Upon deposit, become 1.2.3.
- Two rows at the end of the line.
- All text *, [,], ~ are transposed in reverse.
- Facing a grammar that it doesn't know, reporting a mistake. There are no tables, footnotes, strikeout lines in the default schema.
Tiptap Official @tiptap/markdown (3.30)
- Bold and italics also die; unsequenced tables always output -; orderly list renumbering.
- Without the node of the rendering, directly output empty strings and the content just disappears.
- The official document itself states that this is an early version, not supported by comments, and that only one sub-point can be placed in each cell in the table.
The community tiptap-markdown has stopped maintaining it. It encounters an unexpressed node, and outputs a [nodeName] place; as soon as a consolidated cell is in the table, it is downgraded to HTML and the line alignment information is missing.
These aren't bugs, they're the result of this architecture: the authority of the document is that JSON tree, Markdown, is just one of its "printing methods." There's only one way to print it, so the source code you wrote was gone when you first saved it.
It doesn't matter to write a note to a person. But these scenes are deadly:
- Document in Git, change one word, diff is a full screen change in format;
- AI has changed only one paragraph and the entire text has been “standardized”;
- The same document will also be used for VS Code, static sites, other Markdown tools.
"Marktown Can't Do Complex." It's a big mistake.
It is often said that Markdown does not express complex structures, like multi-dimensional tables, database views, so he can only save JSON. In 2024, the co-founder of Logseq, explaining why the database version was being made, also mentioned the limited structured data support of Markdown, the lack of durable ID, time stamping.
There's a problem like that, I'll talk later. But it's wrong to "can't do complicated pieces."
Marktown had a very good container: code fence. In MSFE, multi-dimensional tables, flow charts, mind maps, whiteboards are stored in a coded fence, with data that can be re-opened repeatedly:
```quirekit-data-view
{... field, Records, View on Table...}
```
- In MSFE, it is shown as a multidimensional table that can be directly edited;
- In GitHub, VS Code, or any ordinary Markdown tool, it is a code, not bad, not lost;
- New data will be written back to the same fence only after the user point has been “established”. None of the other lines were moved by byte.
The problem with complex blocks is not in Marktown, and you didn't design a good spot for it.
What's the real limit?
Say Marktown can and can't be honest. It's really limited to the grammar itself, and I've done this article by article with micromark 4.2 plus GFM:
1. Only the contents of the cells in the table shall be released. Want to put a list or a code in a cell? The form was broken on the spot:
| A | B |
| --- | --- |
- One.
- Two.
Parsing results: the first line becomes - one and an empty cell - two | x| is squeezed out of the table and becomes a list item outside the table. The same goes for the code blocks in the cells. The whole table is messed up. cell.
2. Format cannot be simply embedded.
- The line code cannot be thicker: `** Crude** ' shows the original text with an asterisk.
- There can be no longer a link in the link: [Terrestrial] [Inner Layer] (b) text] (a), the outer link directly lapses and becomes normal text.
- Underlined, text colours, highlighted, fonts, not in Marktown, only HTML. Fortunately, both HTML and Markdown are effective; once written in an HTML block, such as <div align= "center", it says ** in ** and Markdown in ** is no longer deciphered and is shown as an asterisk in plain text.
3. The Chinese pamphlet, which is the most popular Chinese user, would invalidate the addition.
That's the word after "heavy."
Attention** (important)** Here
Neither line is thicker, and it's the original asterisk. The reason is that Common Mark's judgment ** can begin or end with an emphasis on whether it's marked and blank on either side. The Chinese quotation marks, brackets, followed closely by the Chinese word, and the rule does not justify it. English writing is hardly a problem, and Chinese writing is daily.
There are other things that are not at all at the grammar level:
- The table does not merge cells, does not have column width and does not have a cell base colour;
- Lack of alignment, indentation, line spacing, preceding paragraph;
- There is no stable ID, the requirement of “citing paragraph 3” is invalidated as soon as the paragraph is moved;
- Notes, amendments have no place to hang, no anchor;
- There are too many dialects, and the GFM, the extension, the private grammar of the software, is different from the same document, changing the tool.
So my attitude is:
- It's not grammatical, it's not supposed to be. The syntax not known to MSFE remains in the source code without loss or change;
- Complex objects, with code fences for data;
- The needs of the layout type, such as pages, fonts, paragraph styles, are placed in the export template and page break document, without pressing into Marktown.
Five, two sets of editors with no respect for the source code.
The most common approach for Markdown is to have a rich text editor with a source editor and switch to one another when switching.
Joplin desktopend is TinyMCE plus CodeMirror. Its official help page is honest and lists directly the problems of editing Markdown notes in a rich text editor: most plugin formats are lost; tables without a header are filled with an empty header; a check box and a normal list item cannot be used in the same list; HTML in Markdown may be lost; quote links are changed to a line link.
MarkText is a self-study Muya plus CodeMirror 5, read marked to HTML, write to turndown and return to Markdown.
Two sets of editors mean:
- Double volume and memory, two sets of shortcuts, two sets of revocation history and two sets of plugins;
- Each time a view is cut, do "Markdown" tree and "Markdown" -- that's the damaged road in section II;
- Cursors, electoral districts, rolling positions cannot be matched on either side.
VI. Synergy: Yjs of ProseMirror, more pits than expected
Yjs plus y-prosemiror (Tiptap) is the same. When we did the Word level document, we measured it, and we looked up the document and issue:
Upstream self-acknowledged issues (CAVEATS and issue):
- Directly delete nodes when the structure is illegal. Two people simultaneously amended it, which could result in structures that did not match the schema, such as a paragraph in a reference block that was deleted by both. The binding process was to remove the entire parent node and the long-standing users of offline were particularly vulnerable.
- Every update at the far end is replaced by the whole text. "Y-prosemirror addresses the system with every change." As a result, the location map of Transaction failed and local decorations and plugins were rebuilt in relative positions.
- There are no original indications of stripping, banding, promotion. In Yjs, stripping is “deleting the tail of the original paragraph and inserting a new node” and semantics can be transmissible.
- Undo it. Prose Mirror's own history cannot be replaced by Yjs' UndoManager. Tiptap document also requests to turn off the undo in StarterKit when working together.
- Rehabilitation of the constituency at the remote end of the update may be incorrect, resulting in this update being bypassed at this end, with a fork on both sides (v1.3.7, issue still open).
- v1 and v2 data formats are incompatible and old and new clients cannot edit the same document simultaneously.
Our own measurements (Yjs 13.6.33 + y-prosemirror 1.3.7, y-tiptap 3.0.9, Yjs 14 prepublish, three sets of results agree):
These are not deployment issues, and the replacement of servers and the addition of additional machines cannot be solved. The root is on how the tree document is mapped into CRDT.
Why is there no such problem with MSFE synergizing with the Markdown source code itself, a Yjs text? None of the paragraphs are legal Markdown, so there is no " structure that is not valid to delete nodes "; the structure is re-deciphered from the text, so there is no " unspecified segment ". The change between the two persons in the same place may result in the need for a glimpse, for example, of changing the same line of tables to a different picture, but the content will not disappear because of structural conflicts. It's a coordinated withdrawal, only your own modification.
Why do you have to respect the source code?
After all, just one sentence: the Markdown you wrote was the document itself.
- Git friendly: change one word, diff is one word;
- AI Friendship: LLM reads Markdown, and it changes the paragraph to just the paragraph and does not follow the "standardization" of the whole text;
- Freedom of tools: the same document, which can be modified in VS Code, retrofitted for stationary sites, processed for other tools and not locked to death by any editor;
- Long-term readability: 10 years later it is still a plain text.
Eight, CodeMirror can also do Rich Text.
Many people think that CodeMirror can only be a source editor and that it's up to ProseMirror to get what he sees. In fact, the decorations and widgets of Code Mirror 6 are enough for the effect of "Looks like rich text": the title is bigger, the symbols are hidden, tables are painted, formulae are rendered formulae, data in code fences are rendered flow charts and dimensional tables. But the text below has not changed a word.
MSFE itself provides three editable appearances: document view (all signage is hidden and looks like rich text), real-time preview (where to edit, where to display the Markdown tag), and source view. They're a difference in the same CodeMirror example, not three sets of editors. Toggle without any conversion, constituency and revocation history are still there, and change is always the same markdown.
QuireKit's MD Editor is a finished product that has been created on MSFE: add toolbars, slash menus and a read-only reading view to render the same source code.
Document View: The tag is all hidden and looks like rich text.
Real-time preview: Markdown source code is shown in the line where the cursor is in, like here's formula line becomes LaTeX and the rest is rendered as usual.
Source View: The same content, this Marktown.
Source priority also has a cost: every input updates the syntax tree, and the file is slow.
It's not the first time I've actually had this problem. I've done an open-source project, Incremark, that specializes in the incremental rendering of Markdown when the AI flow output: The model does not resolve the whole text for every text that it spits out. When I did MSFE, I found that the editor's incremental resolution and current rendering was actually the same problem, and that it could be done more thoroughly at the level of the solver. So I went straight to Lizer's incremental resolution and rewritten the new version of Incremark on it. The MSFE editor, MD Editor's reading view, and the display of AI flow responses are used for the same sort of analysis. Incremark's history and why I gave up the first edition and then wrote a separate piece.
The specific optimisation is the addition of a "reuse certificate" to Lezer 's Markdown incremental resolution, whereby the editor skips the unchanged part of the section. Document input for 1 MiB 20 times:
Where there is evidence of non-existence, complete comparisons are returned, so correctness is not affected.
ix. Why do you cover it up?
These can be done with a single editor application. I made it into a framework because every person who did the editing of these problems would encounter it, and there was no need for everyone to step on it again.
MSFE is written in Tiptap style, with whatever extension you can edit:
import { createMsfeEditor } from '@quirekit/msfe-core'
import { StarterKit } from '@quirekit/msfe-starter-kit'
const editor = createMsfeEditor({
parent,
documentId: 'note-1',
markdown: '# Hello\n\n**Markdown** stays the source.\n',
mode: 'live',
extensions: [StarterKit],
})
edito.getMarkdown() // Always the source code
- The kernel does not rely on Vue or React and also provides Vue, React components;
- Existence of extensions such as titles, thicker, links, pictures, code blocks, formulae and Mermaid, HTML and HTML sandboxes, flow charts, thought charts, whiteboards, multi-dimensional tables;
- Synergy (including the Hocuspocus service end) is also extended.
These are MIT open sources. AI Read-and-write documents, changes in the form of “wait-and-see” and notes are commercial components, developed and evaluated free of charge.
X. MD Editor and Peripheral Ecology
If you don't want to spell it yourself, use MD Editor: The toolbar, four views, the slash menu, tables, formulae, graphs are made, and several lines of code are put into the Vue project.
<script setup lang="ts">
import { MdEditor } from '@quirekit/md-editor/vue'
import '@quirekit/md-editor/styles.css'
</script>
<template>
<MdEditor markdown="# Hello" label="Document" />
</template>
The external editor is also a separate package: formulae editor (which rotates the LaTeX and Word formula), flowchart, mind chart, whiteboard, Mermaid / PlantUML / Graphviz text drawing, multi-dimensional tables, and current Markdown rendering (Incremark) for generating side displays for AI. All interfaces are from the same set of UI modules with a bright black switch.
XI. Professional scenes: Word and PDF, two scenarios
Markdown finishes. Someone always wants Word, PDF. Here we offer two sets of programmes.
Open Source Program (@quirekit/md-editor-basic-export, MIT): Rotate with mature open source banks. Markdown Turn Word with md-to-docs, Word Turn Markdown with Mammoth plus Turner, PDF with pdfmake, all done in browser. MSFE-specific content is downgraded: flowcharts, mind charts, whiteboards are exported as previews, and other embedded blocks become places. Each downgrade is written into the export report, and it is not thrown away.
Business scenario: instead of using the "Markdown turn HTML turn Word" route, we'll transfer Markdown into the same document model as our page-by-page document editor, Classic, to the Classic layout engine output Word, PDF and OFD:
- A template can be defined: a page, font, paragraph style is written as an export template, and the same Markdown can be exported by company template, paper template, official template;
- The formula is Word original, not a picture;
- Custom blocks can go and go: flow charts, mind charts are shown in Word as maps, while raw data are brought into the file. When re-exported to Markdown, restores the block to which you can continue editing;
- Disruption: reports are given every time a conversion is made; if a strict pattern is applied, a single loss is directly rejected;
- Connect to rich text: because it uses the same set of models and layouts, the PDF, the OFD exported by Markdown, and the layouts that are seen in the pages document editor. The exported Word can also be edited in Classic by pressing the page.
By the way, Classic.
Classic is the page-by-page document editor mentioned above. It is another line for QuireKit: based on ProseMirror, layouting itself, real page-by-page, drawing on Canvas or SVG. It solves another category of problems and has the opportunity to write a separate one. This is the top screen of the official network.
Finally.
QuireKit is not an editor, but a set of editor ecologys: two sets of Tiptop-style editor frames (ProseMirror and this talk of CodeMirror line MSFE) with page breaks, block editors, Markdown editors, and a bunch of surrounding editors sharing an UI repository. All open source parts MIT are also available for closed source commercials.
It's still Alpha, and API will change.
- MSFE:msfe.quirekit.com
- Online experience: quirekit.com
- Document:docs.quirekit.com
- GitHub:github.com/quirekit/qu…
If it's interesting in this direction, order Star is my greatest support. And I'd like to hear, "When you're making the Markdown editor, which pit you've been stuck with the longest?"
Auto-fetched and translated by AI Atlas. All rights belong to the original author.