百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 编程网 > 正文

所见即所得(WYSIWYG)编辑器调研 所见即所得编辑器是什么意思

yuyutoo 2024-10-12 01:16 5 浏览 0 评论

最近公司内部要优化创作者后台,关于后台编辑器部分,领导委托我做了一个简单的调研。

基于github和百度搜索的数据,收集整理出以下几款编辑器的数据

quill

github repository: https://github.com/quilljs/quill/
github stars: 31.1k
github contributors: 127
官网: https://quilljs.com/

Quill是一个跨平台的功能强大的富文本编辑器。开发者可以通过简单的API来控制编辑器的内容。主流的黑白清新风,美观,功能上虽然不是很多,甚至还没有表格,但它的代码高亮是最完美的,因为它本身就支持了hignlight.js,同样支持行内编辑模式,可自定义。

trix

github repository: https://github.com/basecamp/trix
github stars: 16.5k
github contributors: 37
官网: https://trix-editor.org/

在Web应用程序中编写格式精美的文本。Trix是一个WYSIWYG编辑器,用于编写消息,评论,文章和列表 - 大多数Web应用程序的简单文档。它具有复杂的文档模型,支持嵌入式附件,并输出简洁和一致的HTML。
Trix是来自Basecamp的开源项目,Basecamp是Ruby on Rails的创建者。数百万人信任他们的文本发送到Basecamp,Trix给了他们最好的编辑体验。

大多数WYSIWYG编辑器都是HTML contenteditable和execCommandAPI的包装器,他们是由Microsoft设计,支持在Internet Explorer 5.5中实时编辑网页,最终由其他浏览器进行反向设计和复制。

因为这些API从未完全规定好或文档化,并且因为WYSIWYG HTML编辑器的范围很广,所以每个浏览器的实现都有自己的一组错误和怪癖,需要JavaScript开发人员可以解决这些不一致问题。

Trix通过将contenteditable视为I / O设备来回避这些不一致:当输入进入编辑器时,Trix该输入转换为其内部文档模型的编辑操作,然后将该文档重新呈现回编辑器。这使得Trix可以完全控制每次击键后发生的事情,并且完全无需使用execCommand。

wangEditor

github repository: https://github.com/wangeditor-team/wangEditor
github stars: 12.5k
github contributors: 44
官网: https://www.wangeditor.com/

由一个20个人组合的国内团队维护,轻量级,小巧实用,配置方便,使用简单。可以自定义皮肤功能,免费开源,用户数量也较多。
wangEditor是用javascript编写的 轻量级web富文本编辑器 ,依赖于jQuery和fontAwesome字体库, 支持所有浏览器 。使用 wangEditor 可以轻松创建web富文本框,并可以自定义扩展菜单功能。wangEditor所有源码都已经在github上开源下载。

缺点:Demo、文档不是很全。若想更好的使用,还需阅读一下源码,好在作者代码注释写得很全。

优点:作者一直有更新,并且有活跃的技术QQ群: 164999061(人已满),710646022(人已满),901247714(人已满),606602511,作者能及时的回答问题。源码注释非常好。

wangEditor是我们项目目前在用的编辑器。

ckeditor

github repository: https://github.com/ckeditor/
github contributors: 130+74
github stars: 5.5k+5.2k
官网: https://ckeditor.com/

非常经典的富文本编辑器,官方下载量过千万,有高性能的实时预览,它特有行内编辑功能。

CKEditor 是新一代的 FCKeditor,是一个重新开发的版本。CKEditor 是全球最优秀的网页在线文字编辑器之一,因其惊人的性能与可扩展性而广泛地被运用于各大网站。

可配合使用的扩展有文件管理器 KCFinder。

github上,目前拆分为ckeditor4和ckeditor5两个主要仓库分别维护,以上数据分别取自这两个仓库

summernote

github repository: https://github.com/summernote/summernote/
github stars: 10.4k
github contributors: 278
官网: https://summernote.org/

Summernote 是一个简单灵活的所见即所得的 HTML 在线编辑器,比较容易上手,使用体验流畅,支持各种主流浏览器,基于 jQuery 和 Bootstrap 构建,支持快捷键操作,提供大量可定制的选项。

本次调研中github贡献者最多的一个。

TinyMCE

github repository: https://github.com/tinymce/
github stars: 9.9k
github contributors: 215
官网: https://www.tiny.cloud/

TinyMCE是一个轻量级的,基于浏览器的,所见即所得编辑器,支持目前流行的各种浏览器,支持图片在线处理,插件多,功能非常强大,易于集成,并且拥有可定制的主题。由JavaScript写成。功能配置灵活简单(两行代码就可以将编辑器嵌入网页中),支持AJAX。另一特点是加载速度非常快,如果你的服务器采用的脚本语言是 PHP,那还可以进一步优化。最重要的是,TinyMCE是一个根据LGPL license发布的自由软件,你可以把它用于商业应用。

UEditor

github repository: https://github.com/fex-team/ueditor
github stars: 6k
github contributors: 45
官网: https://ueditor.baidu.com/website/

UEditor 是由百度 web 前端研发部开发所见即所得富文本web编辑器,具有轻量、可定制、注重用户体验等特点。

主要特点:

轻量级:

代码精简,加载迅速。

定制化:

全新的分层理念,满足多元化的需求。采用三层架构:

  1. 核心层: 为命令层提供底层API,如range/selection/domUtils类。
  2. 命令插件层: 基于核心层开发command命令,命令之间相互独立。
  3. 界面层: 为命令层提供用户使用界面。
    满足不同层次用户的需求。

浏览器兼容:

兼容Mozilla, MSIE, FireFox, Maxthon,Safari 和Chrome,实现浏览器无差别化。

注重细节:

  • 统一不同浏览器下表格选取方式。
  • 提供黑/白名单的过滤机制。
  • 更好的word支持,实现粘贴转换机制。

稳定性:

经过专业的QA团队测试,通过上千个测试用例,包括自动化用例和手动用例,目前仍然在不断完善中。


以上数据部分均取自github,时间为2021年10月21日
观点部分,只代表个人观点,有什么建议和意见欢迎指正

相关推荐

苹果要求全新App开发四月起必须支持“齐刘海”

今日消息,苹果公司通过邮件告知应用程序开发者,从2018年4月起提交给AppStore的所有新应用必须支持iPhoneX的超级视网膜显示器。这意味着新应用程序的开发者必须确保它们适应“齐刘海”,并...

耗时一年多,QEMU开发者成功在电脑上模拟了初版iPhone OS

IT之家12月24日消息,用户通过黑苹果(Hackintosh)工具,已经可以在非Mac设备上运行macOS系统。但由于种种限制,至今也没有多少人能够在PC上运行iOS系统。现...

下个月的WWDC后,苹果将发布原生Watch SDK测试版本

在近日Re/code举办的CodeConference上,苹果的运营副总裁JeffWilliams称,目前有4000多个AppleWatch应用上线,而未来的苹果表开发者套件,将允许开发者直接获...

苹果再次提醒:4月起强制要求APP进行适配

点击右上角关注我们,每天给您带来最新最潮的科技资讯,让您足不出户也知道科技圈大事!软件适配对于许多厂商来说都是一个比较头疼的事,苹果在握紧AppStore审核权的情况下情况要好许多。最近他们公布了...

苹果Xcode 16首个Beta版发布,AI代码补全最少需16GB内存

IT之家6月12日消息,在苹果WWDC24开发者大会上,苹果发布了iOS18、macOS15Sequoia等最新版本系统更新。与此同时,苹果推出了Xcode16开发工具的首...

传苹果已向特定开发者开放iWatch SDK

|责编:薄志强苹果会不会在这次发布会中发布全新的智能手表产品iWatch还很难说,不少人认为由于iWatch的消息少之又少,很可能这次还是没有iWatch。不过现在又有外媒传出消息称,苹果已经选定了...

苹果发布Swift 6语言:引入新测试框架、增强C++ 互操作性

IT之家9月20日消息,科技媒体devclass昨日(9月19日)报道,苹果公司在发布iOS/iPadOS18和macOS15Sequoia系统之外,还发布了Sw...

发布Siri SDK 之前苹果还是先想想这个问题

今年的GoogleI/O大会上,在预览GoogleHome时,我们就看到了设备可以互相对话的场景是多么惊艳,苹果快点跟上吧。最近因为亚马逊Echo和谷歌GoogleHome的火热...

iOS 17.2 SDK代码确认古尔曼爆料:免开箱更新苹果iPhone系统

IT之家10月27日消息,彭博社的马克古尔曼(MarkGurman)本月早些时候发布报道,称苹果正在研发新的系统,可以让员工在不拆开包装的情况下,升级iPhone的iOS系统。根据国...

《企业应用架构模式》之事件驱动架构

事件驱动架构(Event-DrivenArchitecture,EDA)是一种强调事件流和异步通信的应用程序架构。在该架构中,应用程序被分解为多个小型、可独立部署的组件,这些组件通过事件进行通信...

k8s中常用的controller以及用途和对应机制

controller的用途ReplicaSet、Deployment、StatefulSet:用于无状态和有状态应用的副本管理。DaemonSet:确保每个节点上都运行一个副本的控制器。...

Disruptor框架源码阅读-如何不重复消费

RingBuffer如何保证数据不丢失由于ringbuffer是一个环形的队列,那么生产者和消费者在遍历这个队列的时候,如何制衡呢?1、生产快,消费慢,数据丢失?生产者速度过快,导致一个对象还没消...

C# 控制电脑睡眠,休眠,关机以及唤醒

最近碰到一个关于芯片测试过程中的问题,这颗芯片是用在笔记本端口上,笔记本客户那边会有一个压力测试,就是频繁的电脑电源状态切换,S0(正常使用的开机状态),S3(睡眠模式),S4(休眠模式)以及S5(关...

大厂防止超卖的7种实现,很受用!(大厂防止超卖的7种实现,很受用的产品)

高并发场景在现场的日常工作中很常见,特别是在互联网公司中,这篇文章就来通过秒杀商品来模拟高并发的场景。本文环境:...

臻识车牌识别配制MQTT通讯,解析车号

在物联网项目中,我们的软件与车牌识别通讯,通常使用MQTT通讯更简单。...

取消回复欢迎 发表评论: