V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
benjycui
V2EX  ›  程序员

深入 Slate.js 编辑器 - 引言

  •  
  •   benjycui ·
    benjycui · 2020-11-24 17:41:26 +08:00 · 2024 次点击
    这是一个创建于 1464 天前的主题,其中的信息可能已经有所发展或是发生改变。

    转载自知乎 https://zhuanlan.zhihu.com/p/301221338

    我们是钉钉的文档协同团队,我们在做一些很有意义的事情,其中之一就是自研的文字编辑器。为了把自研文字编辑器做好,我们调研了开源社区各种优秀编辑器,Slate.js 是其中之一(实际上,自研文字编辑器前,我们就使用了很久的 Slate )。

    我们团队的同学把对 Slate 的理解,写成了小册子,想通过连载的形式分享给你,下面是小册子的目录及前言。


    TOC

    • 一行代码实现富文本编辑器
    • Web 富文本编辑器简史
    • Slate.js 设计
      • HTML 中的富文本
      • Slate.js 中的富文本
      • 节点寻址
      • 附录 - 不可变数据
      • 附录 - Memorize
    • Slate.js 是怎么工作的
      • 大脑 - Controller
      • 指令系统
      • Operation
      • 插件体系
      • Normalize
      • Decoration
      • Annotation
    • 模型与视图的同步
      • Tiny Slate.js:实现一个 Mini Slate.js
      • 设计数据结构
      • 设计 Controller
      • 实现编辑器组件
    • Slate.js 生态现状
      • 兼容其他格式
      • 单元测试
      • 移动端编辑器
    • 挑战与变革
      • 难于完美的编辑器
      • 大跃进 - Slate.js 0.50
    • 附录 - 协同理论
      • OT 算法
      • 协同调度
    • 关于作者

    一行代码实现富文本编辑器

    富文本编辑器,指的是用户能够在浏览器中编排富文本(具有风格及排版的文本,如可以设定字体样式,进行图文混排等)。通常,在英文社区,习惯称富文本编辑器为 「 WYSIWYG Editor ( what you see is what you get,所见即所得编辑器)」。 当网站需要一个富文本编辑器时?你是否也会踟蹰在编辑器的选择?是选择百度出品的老牌编辑器 UEditor,它最熟悉国内用户,但是已经长期不更新了,还是选择最流行的 CKEditor,如果愿意花钱,CKEditor 团队还能为你提供企业级的支持;如果你对商业化嗤之以鼻,更愿意拥抱开源社区,近几年,Draft.js ,Slate.js ,和 ProseMirror 等新一代编辑器也纷至沓来。 但是如果有人告诉你「 1 行代码」就能实现一个富文本编辑器,你会相信吗?即便你在一个非常古老的浏览器,不借助任何第三方库,也是可以做到的:

    <div contentEditable>请输入...</div>
    

    这个编辑器已经具备了基础的文本格式化(加粗、斜体),undo/redo 功能了,但是为什么社区的富文本编辑器还是源源不断出现呢?我们先稍微回顾一下 Web 富文本编辑器的历史。


    如果你对协同文档技术感兴趣,也可以通过知乎 https://zhuanlan.zhihu.com/p/301221338 文章中的钉钉群与微信群和我们一同讨论。

    2 条回复    2020-11-24 22:35:26 +08:00
    a408115319
        1
    a408115319  
       2020-11-24 17:56:06 +08:00
    nl101531
        2
    nl101531  
       2020-11-24 22:35:26 +08:00
    语雀的编辑器已经很好用了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1041 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 19:59 · PVG 03:59 · LAX 11:59 · JFK 14:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.