时隔五年, Quill 2.0 终于发布!重回富文本巅峰!

开发 前端
在一个博客平台上,Quill可能被用来为博客帖子提供一个全功能的编辑界面,包括编辑标题、插入图片和代码块;而在同一个页面上,Quill也可能被用于评论区,提供基本的文本格式化功能,如加粗、斜体和插入链接。

Quill 2.0 来啦!

自最初的 1.0 版本发布以来,Quill 见证了来自快速发展的初创公司、知名品牌和老牌财富 500 强公司的众多成功案例,这些公司已将 Quill 纳入其面向用户的产品的一些最重要和核心的部分

Quill 用户数很多,所以发新版本的时候,无缝衔接很重要,在提高了 Quill 功能的同时,也要让开发人员的使用负担降到最低~

随着 Quill 2.0 的正式发布,GitHub 存储库已从上次发布 Quill 1.3.7 时的 23k star 增加到超过 41k star

图片图片

接下来讲解一下,Quill 2.0 做了哪些更新~

TypeScript的支持

Quill的源代码已经完全迁移到TypeScript,从中我们获得了早期错误检测、改进的可维护性以及更好的工具支持等诸多优势。这使得我们的代码库更为强大,也为Quill和我们的开发者社区带来了更多好处。

在此之前,开发者需要单独安装@types/quill这个包,才能获取到TypeScript的定义。然而,这种方式有时并不够准确,甚至可能与Quill的实际类型不符合,因为这个包是由我们更广泛的社区维护的,因此与核心Quill包的更新也不一定同步。

但是,有了Quill 2.0,这些麻烦和出错的机会都将成为过去。开发者现在可以直接从源头获取类型信息。要进行升级,只需从项目中移除@types/quill包,TypeScript将自动从Quill中选择相应的声明。

图片图片

表格的支持

2.0 从功能上来说,我觉得最大的变化就是支持表格的操作

图片图片

图片

性能提升

Quill 2.0 做了许多性能优化工作,其中最为重要的是提升了对大型内容的渲染速度

  • 这些优化包括增加了 insertBefore 函数,并且尽可能地使用 insertBefore 来提高 setContents 函数的性能
  • 通过对 getRange 函数进行优化,提升了同时渲染多个 Quill 实例的性能,经过优化后,即使在同一个页面上同时渲染了4000个 Quill 实例,其渲染性能也提升了近10倍
  • 优化了 Quill 实例的初始化逻辑,当内容为空时,无需执行 setContents 函数

在渲染4000个 Quill 实例的情况下,经过优化前后加载时间的对比如下:

图片图片

注册多个 Quill 用例

随着Quill变得越来越流行并被广泛使用,我们开始经常看到各种用例,有时一个页面上甚至会同时出现多个实例。

比如说,在一个博客平台上,Quill可能被用来为博客帖子提供一个全功能的编辑界面,包括编辑标题、插入图片和代码块;而在同一个页面上,Quill也可能被用于评论区,提供基本的文本格式化功能,如加粗、斜体和插入链接。

Quill 2.0引入的新注册表(registry)功能支持了这种场景,使得同一个页面上可以存在多个配置各异的编辑器实例,而且它们之间不会互相冲突。欲了解更多关于注册表的信息,请参阅文档

文档:https://slab.com/blog/announcing-quill-2-0/

责任编辑:武晓燕 来源: 前端之神
相关推荐

2024-04-01 06:16:05

2022-02-15 09:00:18

Vue编辑器字符串

2023-12-10 14:28:58

VS Code软件开发代码编辑器

2023-05-11 07:34:36

Yjs协同编辑

2022-02-16 09:55:39

Elastic 8开源索引

2024-11-06 08:08:59

2018-06-07 16:05:46

2020-05-08 15:29:15

编程语言PythonJava

2021-03-12 06:15:09

比特币区块链加密货币

2020-11-02 09:07:41

Pyston v2.0Python

2019-07-31 10:42:23

5G运营商通信

2019-03-20 13:40:21

苹果iPadApp Store

2021-10-25 23:12:06

iOS应用系统

2021-03-04 20:38:49

Open RAN网络通信

2009-04-01 18:01:10

LinuxMonoDevelop

2013-04-08 09:47:50

中国移动高帅富Ophone

2017-02-08 14:30:21

微软微软Azure云计算

2019-05-30 08:43:45

JavaScript富文本编辑器编辑器

2023-11-02 11:33:39

点赞
收藏

51CTO技术栈公众号