39k的Quill编辑器,5年后起死回生,发布了2.0,了不起

Quill编辑器经过五年后重获新生,发布了2.0版本。此次更新包括用TypeScript重写源码、支持嵌套编辑、IME问题修复、改进粘贴处理、官网改版、引入多个注册中心等特性。背后的支持来自盈利公司Slab,其创始人将公司需求与社区结合,保证了Quill的持续迭代。尽管仍存在一些小问题,但Quill的未来前景看好。

很早之前,我写过一篇文章 quill已死,谨慎使用,现在看来它复活了。正如作者所说,开源最大的障碍是可持续性,尤其是编辑器这种项目,有永远改不完的bug,需要投入巨大的精力。Quill能够活过来,我猜最重要的原因是它背靠一个盈利的公司Slab。Slab这家公司是Quill的作者创办的,公司的核心产品就是文档编辑,把公司需求与社区结合起来能够保证Quill持续迭代,开源的好处也能够让业界帮你找出编辑器的bug,让全世界的人帮你出谋划策。

这两年比较火的编辑器BlockSuite,以开源为主,借助开源的力量让自己的产品变得更流行,发展起来会更迅速,投入的研发成本也会降低。

回到正题,那么Quill2.0带来了哪些升级呢?

1.用TS重写

Quill整个源码用TS重写了一遍,这样的好处是不需要第三方@types/quill这种类型包了,直接使用Quill就包含了类型定义。

2.支持嵌套

Quill内部可以再嵌入任意个Quill编辑器,有了这个特性就能够实现更复杂的需求,比如实现与飞书媲美的表格、分栏效果。目前Quill并没有提供功能完善的表格,相信有了这个特性,不久后就会出现好用的表格方案。其实类似飞书这种编辑器,就是由一个个富文本编辑器组合而成,我给大家画个图。每个红框都是一个可编辑的块,都是一个富文本编辑器

029e45ebdaff2549c500cddb4133e5d7.png

3.IME问题的修复

采用InputEvent修复了一些IME的问题,但目前还会存在一些未解的问题。Quill的核心原理是通过MutationObserve来监听DOM的变化,根据变化来规范DOM结构,生成内部文档模型,但是不同场景中,浏览器可能处理的不一样,如果生成的DOM Quill不认识,则会被丢弃,这样就导致用户输入的内容被删除了。比如用户选择一个红色文本,然后进行替换,此时浏览器可能生成个font标签,但是Quill不认font标签,内容就会被删除。为了解决这个问题,现在业界最新的方案就是监听input事件来做规范化的事情,比如Slate、飞书、BlockSuite。Quill也在往这个方向上靠,但是刚起步。

4.粘贴处理

支持了对Google Docs 和 Microsoft Word的处理,富文本编辑器处理的一大难题是处理各种粘贴来源的内容。

5.官网大改版

de9e3a26b5465dc9a8778c174f300698.png

加载速度更快了,风格变得更美观。

6.多个注册中心

Quill的实现采用白名单机制,比如有多少个format,需要提前注册的,以前只有一个全局注册中心。但考虑到同一个页面可能有多个编辑器,每个编辑器用的功能也不一样,比如主编辑器需要全部功能,评论编辑器只需要文本相关的format,如加粗、颜色等。2.0提供了不同的注册中心,用户可自行定义。

7.更多特性

想了解更多的可以参考这个notes:

https://github.com/quilljs/quill/releases/tag/v2.0.0

abb18be45566d2201b7e4b10a171fb5f.png

另外本次修复了大约200个问题,有48位贡献者。

最后

Quill目前虽然还有一些小问题,但是随着2.0的发布,以及slab公司对它的持续投入,真的是起死回生了。大家加油。

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值