wangeditor与deaftjs的停止维护,2024编辑器该如何做技术选型(一)

wangeditor暂停维护的声明:

9764cd7a19bc6a3b7c636a685e5e33d9.png

wangeditor是国内开发者开发的编辑器,用户也挺多,但是由于作者时间关系,暂停维护。

deaft的弃坑的声明:

32046fd468e09e820921f9a87d3c72ef.png

draft是Facebook开源的,但是也弃坑了,说明设计的时候存在很大的问题,不然也不会从一个坑跳到另一个坑。

那么2024年编辑器该如何进行技术选型?编辑器这条路太卷了,开源编辑器有十几个,但是每个都会有一些问题,如果想做深入开发,做成类似飞书这种编辑器,没有一款能完全符合要求,都需要花很大的精力来扩展功能,光靠热情来维护一款编辑器很难继续下去。需要3-5个人来维护才能做好前端编辑器。那我们来分析一下我看到比较好的编辑器。

Prosemirror

很早之前看到Prosemirror时,哇,就这么点star,编辑器实现时,忽略了它。后来发现很多大厂都在用它实现,比如WPS的智能文档、印象笔记、gamma。后来想了想star少的原因是因为它并不是开箱即用,属于编辑器框架,大多数人驾驭不了。基于它开源的编辑器tiptap star比较高,还有notion style 的编辑器。如果实现类似飞书这种编辑器,prosemirror是不错的选择,能自定义的东西太多了,而且不依赖框架。

0a340581701c955abff479a8a51810a8.png

它的API设计的力度非常细,把编辑器实现的点基本都考虑到了,下面是我打印出来的源码+指南+API参考,看它的厚度就能感受到它的强大。

ad0f583243a34cd6e8cac077fc8390bf.jpeg

技术选型的最大考量点是它的生态和作者,ProseMirror的作者也是CodeMirror的作者,在编辑器领域有非常多的经验,编辑器设计过程中恰恰需要这种经验,能够想到在不同浏览器、不同手机端都有哪些坑,编辑器需要提供哪些API。

还有一点是看编辑器是否实现了表格功能,因为表格功能实现非常复杂,会涉及到自定义选区、单元格合并、修改列表、添加行列、添加表头、caption等。如果一个编辑器官方未提供一个功能强大的表格,请思考一下是不是还要用它。ProseMirror实现了表格,源码A4纸有60页(单面),可想而知它的复杂度。

Quill

Quill是编辑器里Star最多的,也是我最熟悉的编辑器,在早期非常流行,应用非常广,比如微信小程序、知乎、微软、石墨文档等都在用它。发布以来,已经历了12年,是一个比较老的编辑器库,目前稳定版本是1.3.7,中途3年处于停止维护状态,不过现在作者正在筹划发布2.0.0版本。Quill 2位核心成员:

  • luin (子骅)

目前工作于 Slab,一个提供企业知识管理服务的 SaaS 产品。曾就职于石墨文档,管理一个将近一百人的技术团队。偶尔会写一些文章,出版过一本技术书 《Redis 入门指南》。眼下(2022年)主要写一些 WYSIWYG 文档编辑器代码,部分工作会开源到 Quill 项目中。其他时间会写一些 Elixir, Swift, Node.js 项目。

  • Jason Chen

Quill的创建者,Slab的CEO。Slab是个提供企业知识管理服务的 SaaS 产品,它的编辑器使用的正是Quill。

从上面两位作者的经历来看,Quill编辑器由Slab公司使用,那么在很大程度上能够保证它持续维护迭代,除非Slab这家公司倒闭。目前发布了2.0rc-5版本,很快会发布2.0版本。

不过它有一些缺点,但是投入人力后也能够解决,比如石墨文档是很好的实践。最大的坑:

quill未提供一个好用的table,只有一个功能简陋的table,但是它的功能不满足需求,单元格连基本的换行都没有。业界有一个bettertable,介绍得比较好,但是坑一堆,绝对不能用。还有一个table-embled,这个思路是单元格里再放个quill编辑器,感觉有点蠢,slab用的是这个方案。目前石墨实现得不错,也是table-embled方案,不过它内部实现了一个轻量级的编辑器,也就是说单元格里用的并不是Quill。 

很难实现多层级嵌套的DOM结构,比如:

515ed62746123eb6729ef198eb0825da.png

Slate

这个编辑器也比较流行,比如早期的钉钉文档、语雀都基于它实现的,还有如流文档也是基于它实现的,效果不错,能实现的功能非常多,基本能满足复杂需求。不过是React的。

目前最大的风险是它仍然处于beta阶段,主要靠社区来维护。API也在不断变化。

我对Slate没有实际使用过,暂时不做过多评价,后面学习完它的设计原理后,单独写一篇文章。

时间关系,今天就写到这里吧,大家加油。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/308047.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

为数据穿上安全的外衣——零售电商场景下的数据安全体系建设

在电子商务交易过程中,会涉及大量的个人和财务数据的传输和处理,随着电子商务的发展,数据安全风险也成为一个备受关注的问题。 而跨境电商,属于出海业务,涉及到海外不同国家的政策法规,且数据作为电商的业…

等保测评2.0——网络安全等级保护测评的初步了解

一、什么是网络安全等级保护测评? 二、网络安全等级保护,保护的是什么? 等级保护对象:网络安全等级保护工作直接作用的对象。(注:主要包括信息系统、通信网络设施和数据资源等) 计算机信息系统…

数据库系统概论(超详解!!!)第四节 数据库安全性

问题的提出: 数据库的一大特点是数据可以共享 数据共享必然带来数据库的安全性问题 数据库系统中的数据共享不能是无条件的共享。 1.数据库的安全概述 数据库的安全性是指保护数据库以防止不合法使用所造成的数据泄露、更改或破坏 。 系统安全保护措施是否有效…

Linux【实战篇】—— NFS服务搭建与配置

目录 一、介绍 1.1什么是NFS? 1.2客户端与服务端之间的NFS如何进行数据传输? 1.3RPC和NFS的启动顺序 1.4NFS服务 系统守护进程 二、安装NFS服务端 2.1安装NFS服务 2.2 创建共享目录 2.3创建共享目录首页文件 2.4关闭防火墙 2.5启动NFS服务 2.…

基于VC709构建FPGA开发学习平台(一)-系统时钟与LED

一、时钟 1. 系统时钟 板载U34可编程晶振SI570,为用户提供基础时钟,上电后,默认时钟频率为156.25Mhz,可作为free run时钟源,输入到PLL中,生成系统时钟: 约束为: set_property PACK…

Unity给地图物体添加对撞机

在项目/Assets下创建Prefabs文件夹 选择素材拖入层级下,注意此时地图素材有可能看不到,此时选择Tilemap在检查器中修改图层顺序调至最低。 添加对撞机 选择素材,在检查器中点击添加组件Box Collider 2D,将素材拖入Prefabs文件下…

SSL、TLS和HTTPS:网络安全的重要基石

随着互联网的快速发展,网络安全问题日益凸显。为了保护数据在传输过程中的安全,各种加密协议和技术应运而生。SSL(安全套接层)、TLS(传输层安全)和HTTPS(超文本传输安全协议)是三个最…

力扣LeetCode138. 复制带随机指针的链表 两种解法(C语言实现)

目录 题目链接 题目分析 题目定位: 解题思路 解题思路1(粗暴但是复杂度高) 解题思路2(巧妙并且复杂度低) 题目链接 138. 复制带随机指针的链表https://leetcode-cn.com/problems/copy-list-with-random-pointer/ …

【STL详解 —— list的介绍及使用】

STL详解 —— list的介绍及使用 list的介绍list的介绍使用list的构造list iterator的使用list capacitylist element accesslist modifiers 示例list的迭代器失效 list的介绍 list是可以在常数范围内在任意位置进行插入和删除的序列式容器,并且该容器可以前后双向迭…

分类预测 | Matlab实现基于迁移学习和GASF-CNN-Mutilhead-Attention格拉姆角场和卷积网络多头注意力机制多特征分类预测/故障识别

分类预测 | Matlab实现基于迁移学习和GASF-CNN-Mutilhead-Attention格拉姆角场和卷积网络多头注意力机制多特征分类预测/故障识别 目录 分类预测 | Matlab实现基于迁移学习和GASF-CNN-Mutilhead-Attention格拉姆角场和卷积网络多头注意力机制多特征分类预测/故障识别分类效果基…

自动化运维工具Ansible

ansible 主要的意义在于可以 提高运维工作效率,降低成本提高准确度 资料 Ansible中文权威指南 离线安装 wget https://github.com/ansible/ansible/archive/refs/tags/v2.16.5.tar.gz tar -zxvf v2.16.5.tar.gz cd ansible-v2.16.5 python setup.py install 主要…

jmeter使用之生成html测试报告

测试的最终结果是需要给出一份报告,那么在用jmeter测试时怎么生成一份报告呢,以下针对jmeter如何生成html报告进行简单介绍 一、首先把测试脚本写好二、利用命令生成html报告 命令:jmeter -n -t 【Jmx脚本位置】-l 【结果文件result.jtl存放…

2001-2022年全国各省产业链现代化水平测算(两种方法)-含原始数据、计算结果及do代码

01、数据简介 各省份的产业链现代化水平是一个综合性的评估指标,它涉及到多个因素,包括技术创新、产业升级、生产效率、产业结构优化等方面。这个指标可以用来衡量一个省份在产业链现代化进程中的发展水平和竞争力。该数据揭示了中国省份在推动产业现代…

【C++题解】 问题:1109 - 加密四位数

问题:1109 - 加密四位数 类型:基础问题、拆位求解 题目描述: 某军事单位用 4 位整数来传递信息,传递之前要求先对这个 4 位数进行加密。加密的方式是每一位都先加上 5 然后对 10 取余数,再将得到的新数颠倒过来。 例…

迈威通信MaxGate800系列工业边缘计算网关,算力硬核中枢的巅峰之作

随着人们对工业物联网领域的深入了解与实践,越来越多的企业开始寻求将计算业务从云端迁移至网络边缘处理与执行。然而,在实际应用中,开发者面临着诸多挑战。为了解决这些问题,迈威通信MaxGate800系列工业智能网关应运而生。 MaxG…

2024年MathorCup数学建模C题物流网络分拣中心货量预测及人员排班解题文档与程序

2024年第十四届MathorCup高校数学建模挑战赛 C题 物流网络分拣中心货量预测及人员排班 原题再现: 电商物流网络在订单履约中由多个环节组成,图1是一个简化的物流网络示意图。其中,分拣中心作为网络的中间环节,需要将包按照不同流…

分布式技术--------------ELK大规模日志实时收集分析系统

目录 一、ELK日志分析系统 1.1ELK介绍 1.2ELK各组件介绍 1.2.1ElasticSearch 1.2.2Kiabana 1.2.3Logstash 1.2.4可以添加的其它组件 1.2.4.1Filebeat filebeat 结合logstash 带来好处 1.2.4.2缓存/消息队列(redis、kafka、RabbitMQ等) 1.2.4.…

ChatGPT深度科研应用、数据分析及机器学习、AI绘图与高效论文撰写

2022年11月30日,可能将成为一个改变人类历史的日子——美国人工智能开发机构OpenAI推出了聊天机器人ChatGPT3.5,将人工智能的发展推向了一个新的高度。2023年4月,更强版本的ChatGPT4.0上线,文本、语音、图像等多模态交互方式使其在…

【opencv】示例-neural_network.cpp 使用机器学习模块创建并训练一个简单的多层感知机(神经网络)模型...

#include <opencv2/ml/ml.hpp> // 引入OpenCV的机器学习模块using namespace std; // 使用标准命名空间 using namespace cv; // 使用OpenCV命名空间 using namespace cv::ml; // 使用OpenCV机器学习命名空间int main() {//创建随机训练数据Mat_<float> data(100, …

部署HDFS集群(完全分布式模式、hadoop用户控制集群、hadoop-3.3.4+安装包)

目录 前置 一、上传&解压 &#xff08;一 &#xff09;上传 &#xff08;二&#xff09;解压 二、修改配置文件 &#xff08;一&#xff09;配置workers文件 &#xff08;二&#xff09;配置hadoop-env.sh文件 &#xff08;三&#xff09;配置core-site.xml文件 &…