#工作中少不了用到富文本的,怎么选是个问题,不至于用一阵又替换一个#
官网 | CKEditor | tinymce | TipTap |
优 | 功能丰富,社区活跃 | 体积相对较小,有不少插件和功能 | 代码结构简单,插件灵活拓展,支持按需引入 |
缺 | 体积较大,加载速度慢,代码结构复杂,学习成本高;CKEditor4存在跨站脚本漏洞 | 社区不够活跃 | 组件较新,资源和支持并不丰富 |
使用场景 | 大型项目,需要定制化场景,对性能要求不那么高的 | 轻量级且加载速度稍快一点点 | 灵活拓展功能,开发时间短 |
差异点 | 支持编辑框拖拽 | 不支持编辑框拖拽 | 不支持编辑框拖拽 支持表情包选择等 |
就个人使用感受来说,三者都需要一定的学习成本,但是TipTap可以最快速地搭建出一个简易的富文本编辑器。
加载速度上来说,CKEditor和tinymce初始渲染时都有明显的一段空白时间,TipTap相对来说更友好一些。
tinymce存在隐性的坑点,暂时用特殊手段规避了,但是本地拖拽图片到编辑框没有解决。
tinymce与CKEditor都有文本和图片一同复制时,图片上传失效的问题。
但是如果是CKEditor作替换的,选择tinymce的话相对来说代码结构差别不大,如果换成TipTap,基本上可以说是颠覆性修改。
三种组件都有用过,总的历程就是:CKEditor->tinymce->TipTap