富文本编辑器应避免伪 sleep，采用 requestanimationframe 统一调度、内存模型暂存状态、视口动态渲染及 id 精准清理来优化性能。
富文本编辑器中不存在 sleep() 函数，JavaScript 是单线程且无阻塞式休眠机制；所谓“局部 sleep”实际是误用概念，真正有效的是异步延迟调度 + 精准范围控制 + 渲染节流。关键不在于让代码“停一下”，而在于让 DOM 更新“等一帧、合一批、动一点”。
用 requestAnimationFrame 替代伪 sleep
直接调用 setTimeout(fn, 10) 或循环等待时间戳，既无法保证渲染时机，又可能打断浏览器合成帧节奏。正确做法是把排版操作封装进 requestAnimationFrame 回调中：
- 每次格式操作（如加粗、缩进）不立即改 DOM，而是记录变更意图（例如：
{ id: 'p-789', bold: true }） - 用
requestAnimationFrame统一收集同一帧内所有变更，合并重复操作（如连续三次点粗体，只记一次） - 在回调中执行最小化 DOM 更新：仅定位到对应 ID 节点，更新其内部结构，不遍历全文档
结合内存模型做“逻辑暂存”
高频排版抖动的根源，是反复读写真实 DOM 触发重排重绘。应将编辑状态抽象为轻量级内存模型（如 JSON 树或 Delta 对象），所有用户操作先更新模型：
宝塔Linux面板11.3.0
下载
宝塔面板11.3.0是一款针对Linux服务器设计的可视化管理工具，通过重构核心模块实现资源占用显著降低，尤其适合低配置服务器环境。它将复杂的命令行操作转化为直观的图形界面，帮助开发者快速完成网站部署、环境配置及日常运维工作，无需专业技术背景即可高效管理服务器。
- 模型节点带唯一 ID，与视图节点一一映射（
<p id="p-456">...</p>↔{ id: 'p-456', type: 'paragraph', children: [...] }） - 用户快速连按 Ctrl+B，只触发模型字段切换（
bold: !bold），不触发任何 DOM 操作 - 待用户操作间隙或下一帧，再 diff 模型与视图，生成精准补丁并批量应用
动态降级非关键路径渲染
对非可视区域或低优先级内容（如折叠段落、预加载草稿），可主动跳过实时渲染：
- 监听滚动位置，只对当前视口 ±1 屏内的 ID 区块启用完整样式计算
- 对刚插入但尚未聚焦的段落，先用简化占位结构（如纯文本+基础标签）渲染，焦点进入后再补全格式
- 在输入过程中临时禁用某些开销大的特性（如实时语法高亮、嵌套列表自动编号），失焦后再恢复
清理冗余节点，压缩重绘影响域
ID 定位后不是终点，而是精准清理的起点。很多抖动来自看不见的“脏节点”：
- 在 ID 节点内执行格式操作前，先运行清理函数：合并相邻文本节点、移除无样式的
<span></span>、折叠空行和零宽字符 - 避免嵌套格式标签（如
<em><strong>text</strong></em>→ 合并为<em strong>text</em>或统一用<span class="bold italic"></span>） - 参考 RoosterJS 的
removeUnnecessarySpan.ts和mergeNode.ts实现逻辑，轻量嵌入即可见效
