文章与发现
全部文章 ↗- 技术/
Quill 编辑器（三）复制粘贴 Clipboard
引言 在一个富文本编辑器中，经常会嵌入很多自定义元素，比如一个 Mermaid 代码块组件、一个带有上传/错误状态的图片组件，或者是一个文件附件。 通常会把这些元素作为一个整体去进行插入、选中、复制、粘贴、删除等行为。 它们自身的 Blot value 中可能包含了很多参数，也都存储在了 DOM 节点上。在不做任何干预
阅读全文 ↗ - 技术/
Quill 编辑器（二）文档模型 Parchment
引言 上一篇文章只介绍了 quill 在存储数据时使用的模型 Delta，但并没有具体说明 DOM 与 Delta 是如何实现互相转换的。实际上，在这个过程中还存在一个中间层，那就是 Parchment。 本文将介绍 Parchment 的几个核心概念，以及 quill 数据渲染与更新的过程。 Parchment 核心
阅读全文 ↗ - 技术/
Quill 编辑器（一）数据模型 Delta
引言 Quill 是一个基于 DOM 方案的富文本编辑器，在页面上使用 DIV + contenteditable=true 元素作为编辑器的容器，文章内容则是一个个 DOM 元素。 比如内容是这样： html 标题 第一段开头 加点带样式的文字 第一段结尾 第二段 数据模型 对于编辑器来说，需要有一种数据模型，能够做
阅读全文 ↗ - 产品/
Arc 浏览器的个人体验
很久以前用过 Arc，当时内测排了好久的队，实际用了也感觉到不习惯。 这周下载回来了，连续使用了几天，体验非常好！ 省流总结：除了没有中文 UI 之外，可以说是个比较漂亮并且很完善的浏览器了。 下面介绍一下我的印象: 1、漂亮得像一个精致的笔记软件。 颜值方面不用多说，所有浏览器里最好看的？而且它的布局很省空间，把收藏
阅读全文 ↗
碎记
16. 兼容 Chrome 84 时的 UnoCSS 预设选择
之前做了一个需要兼容低版本浏览器的业务需求，目标是 Chrome 84。这个版本恰好开始支持 Flex Gap，倒是为 UI 还原省了不少事。 但项目使用的是 UnoCSS 的 Tailwind v4 预设，对浏览器版本的要求比较高。它用到了 @layer、新
继续阅读 ↗15. 选择 markdown-it 而不是 remarkjs
这是一条关于之前吐槽 remarkjs 的后续。 remarkjs 封闭、固执、复杂，很难自定义，让我吃到很多苦头，它唯一吸引我的是树形的 mdast 结构。 于是在一个新的项目中，我用 markdown-it 重写了一套从 markdown 到通用富文本编辑
继续阅读 ↗14. Word 的文字行高是如何计算的
在 OOXML 里有一个段落属性标签 Spacing，该标签上有 lineRule、line 这两个常用的属性，它俩会直接影响文字的行高。 lineRule 可以是 exact（精确值）、atLeast（最小值）、auto（自动），前两个比较好理解，auto
继续阅读 ↗