挺乱的,反正就是总结一些最近在折腾的玩意
可编辑块、研究目的与当前实践
文本说明我基本写在链接里了,但为了方便论坛有需要的搜索,挑几行重点在这复制一份:
研究目的: 主要解决 Markdown 容器的编辑、渲染体验(特别在嵌套环境下)
这里有两种不同的做法:
比较
- CodeMirror2
- 逻辑比较像 Obsidian 实时模式的编辑体验。
- 特点:没有 “块” 和 “容器” 的概念,解析结果为多个字符组的数组
- 缺点:在引用块/列表嵌套其他内容的场景时,编辑困难、渲染难看
(例如obsidian的引用块去嵌套代码块时、代码块完全无法被渲染)- CodeMirror
- 逻辑更像 Typora 的编辑体验
- 特点:有 “块” 和 “容器” 的概念,在一个块内,存在一个单独的编辑空间。
这使得在块内的用户编辑体验不会下降! 即便是块再去嵌套其他块
为了以上的研究目的,我弄了一个基于CodeMirror的块型编辑扩展的可行性测试与在线试用Demo: EditableCodeblock App
(仅供实验可行性)
(开发起步 & 测试可行性的阶段,bug究极无敌多)
Obsidian中的尝试
网页版稍丑陋,至于在 Obsidian 中的尝试试验,我之前弄了个录屏,效果会比上面的还要好一些:
见 AnyBlock的实时编辑体验 · any-block/any-block · Discussion #80 · GitHub 该链接底部的视频
测试平台
在研究这东西这一过程中,还有一个副产物:在线版App。
后期可能包装一下。没有obsidian依赖,但markdown-it和cm依赖是有的,供喜欢开发高通用插件的开发者们尝试。主要针对的是渲染型的插件
像我之前开发的anyblock、view chat qq、nodeflow、以及现在在研究的 editable codeblock/block。四个插件都有在用。如:AnyBlock App (近期追加了一个codemirror引擎渲染的标签页,之前是只有markdown-it渲染结果,不过这里未完善,无法实时编辑,还是推荐看前面那个测试Demo。这里只是为了后期重构可实时编辑的anyblock做准备)
优点:
- 快速实验插件效果。与obsidian依赖无关的部分不需要每次去编译 → 移动 → 重启插件 (哪怕有插件可以简化一点这个流程)。在该平台下可以做到每次修改后,快速在网页上试验,像开发网页般顺滑
- 提供在线版给用户实验,可以可以作为插件文档的一个有效补充