DevUI 是一款面向企业中后台产品的开源前端解决方案，它倡导沉浸、灵活、至简的设计价值观，提倡设计者为真实的需求服务，为多数人的设计，拒绝哗众取宠、取悦眼球的设计。如果你正在开发 ToB 的工具类产

一道经典的面试题是从 URL 在浏览器被被输入到页面展现的过程中发生了什么，大多数回答都是说请求响应之后 DOM 怎么被构建，被绘制出来。但是你有没有想过，收到的 HTML 如果包含几十个图片标签，这些图片是以什么方式、什么顺序、建立了多少连接、使用什么协议被下载下来的呢？ 在…

我们知道form表单中的input、textarea之类标签是支持内容可编辑的，但并不支持富文本，如果在这些标签里粘贴带格式的内容，会被去格式，只保留文本内容。如果想设置可编辑富文本，有两种方式： 嵌入空页面的iframe，并设置designMode属性值为“on”，这样整个文…

js提供了一个 api：contenteditable 允许我们对内容进行编辑。即在标签中加入contenteditable document对象暴露出一个execCommand方法去操纵当前的可编辑区域。即document.execCommand() 拖蓝区已可以加粗了。

... 19年10月份改版之前，Slate 里是这几个 model，之后改版取消了这些，统一使用新的 Element 模型。 Document、Block、Inline 都是一个 Node 的子类。 type 是节点类型，比如 div p span 等。 data 是 immu…

... 上次介绍了 Leaf、Text、Mark 模型。今天介绍 Point、Range、Selection 模型。 Point是 点 的意思。一个 Range（范围） 由2个 Point组成，即起点和终点。Point的 key是某个Text节点的key，这个key是在单独的作…

富文本编辑器一直是前端领域的一个天坑，但若不是深入接触编辑器开发的工程师，却不一定清楚富文本编辑器到底坑在哪里，作为有幸和编辑器打了一年交道的前端，今天来聊聊Web富文本编辑器的那些事。 这是使用最久的传统富文本编辑器实现方式，这种实现方式的优势很明显，contentedita…

tinymce是一款基础组件十分丰富，不断维护更新的富文本编辑器。在它的Github项目简介中如此描述自己： 简而言之: 我是宇宙第一的编辑器，我支持当前最流行的三个框架。 Tinymce的核心文件和插件、皮肤、主题样式等文件都是分离的，使用时，只需在HTML中引入核心文件（t…

富文本编辑器，能够使web页面像word一样，实现对文本的编辑，通常应用在一些文本处理比较多的系统中。现在业界有很多成熟的富文本编辑器，比如功能齐全啊TinyMCE、轻量高效的wangEditor、百度出品的UEditor等。富文本编辑器很多，但是却很少思考如何从零开始，实现一…