所见即所得编辑器原理实战:源码与渲染永不失真的三层一致性设计(Markdown/CodeMirror 装饰)摘要:做 Markdown 所见即所得编辑器,真正的难题不是"渲染好看",而是一致性——用户看到的渲染形态与磁盘上的 Markdown 源码,在任何交互下都不能失真。本文以 MarkPin 为实例,拆解一套三层一致性体系:视觉层(符号隐没与活动行回显)、几何层(符号零占位,用 font-size: 0 根治符号占位撑版式)、数据层(复制吸附回源码 + 源码保真标记)。三层里有两层是被用户报告的 bug 逼出来的:符号 opacity: 0 仍占布局宽度导致版式错乱,渲染态复制丢格式标记导致 **bbb**