execCommand废弃
最原始的富文本编辑器是基于浏览器提供的contenteditable属性编辑输入框以及document.execCommand对内容进行操作,最开始大多数的富文本编辑器都是基于此原理扩展写出,但是随着时间的流逝,我们可以在mdn上发现execCommand方法已经废弃,这是不是意味着富文本编辑器用不了了,还是说得另寻歧路?
再造execCommand
如果说execCommand废弃用不了了,我们是不是可以想办法自主造一个execCommand api呢?我们一般会用execCommand实现选中区域加粗加标题甚至修改文字颜色和背景色,那么我们可以在选中文字区域的时候调用这个方法默认创建新的元素标签,比如br,span之类,甚至在创建的元素上添加默认的样式来达到此目的,(简单代码可参考此链接来探究,本文只讨论思路), 当然这个方案可以比较不花费太多精力写出一个简单的api,但是写出一个很靠谱的比较难,写出bug的概率太高。
基于第三方库实现execCommand功能
如果说自主写一个execCommand成本太高,我们应该可以想到使用其他的库来代替execCommand,目前市面上有CKEditor、TinyMCE、ProseMirror、Slate.js都可以实现,目前来说,如果是要开发一款功能丰富,需要定制化的编辑器,那么State.js更好,需要一个能迅速接入并使用的富文本编辑器,那么可以使用 CKEditor, TinyMCE,ProseMirror 这些提供开箱即用功能的编辑器。
猜测
之前看腾讯文档用的是canvas,我目前更认同这种理念-canvas和webGL是下一代编辑渲染技术,但是性能可能是一个无法避免的问题