一个普通Word文档,为什么99%的开源编辑器都＂认怂＂了?我们选择正面硬刚

其实在很多在线文档系统里，DOCX 导入后的效果之所以容易失真，是因为它们通常只保留了最表层的字号、颜色和段落，而丢失了真正决定版式的细节：

• 分散对齐
• 字符缩放
• 字间距
• 精确行距
• 文档网格
• 页面尺寸与页边距
• 中西文混排规则

在 Web 编辑器领域，中文排版长期被忽视。大多数编辑器仅关注英文排版模型，导致中文文档出现标点溢出、行距不均、分散对齐缺失等问题。

老规矩，先上地址：

JitWord 从底层重新设计了排版引擎，原生支持 GB/T 标点压缩、分散对齐、字符缩放、网格行距等专业排版特性，并实现了与 Word 格式的高保真双向互转。（虽然目前还达不到100%精度，但实测已经是业内top3的方案了）

下面是我们设计的高精度docx解析的技术架构：

核心排版能力

一、分散对齐 — 像 Word 一样均匀分布每个字符

传统 Web 编辑器只有左对齐、居中、右对齐、两端对齐四种模式。JitWord 额外实现了 分散对齐（Distribute），这是中文公文和正式文档中的必备排版方式。

实现原理：

• 精确计算每行可用宽度与文本实际宽度的差值
• 将差值均匀分配到每个字符间隙中：间距 = (行宽 - 文本宽) / (字符数 - 1)
• 实时响应窗口缩放和字体变化，通过 ResizeObserver 动态重排
• 三重 CSS 保障：text-align: justify + text-align-last: justify + text-justify: inter-character

效果： 每个字符等间距分布，行首行尾严格对齐，无论段落宽度如何变化都保持均匀美观。

二、字符缩放 — 灵活调整字符宽度比例

支持 33% 到 200% 共 8 档水平缩放预设，可在不改变字号的前提下调整文本密度。

技术方案：

• 使用 CSS transform: scaleX() 实现无损缩放
• 自动补偿缩放后的布局宽度，确保分散对齐等特性不受影响
• 导出 Word 时精确映射到 w:rPr > w:w 字符缩放属性

应用场景： 表格单元格内容过长时压缩显示、标题需要加宽强调效果、模拟 Word 中的字符缩放格式。

三、CJK 排版四件套 — 原生中文排版规范支持

JitWord 内置四项核心 CJK 排版特性，可从 Word 文档中自动识别并还原：

导入兼容性： 从 Word 文档的 <w:documentLayout> 配置中自动提取 characterSpacingControl、doNotWrapTextWithPunct、noPunctuationKerning、balanceSingleByteDoubleByteWidth 等属性，精确映射到对应的 CSS 排版规则。

四、字间距精细调整

支持以 磅值（pt） 为单位的字间距调整，与 Word 完全一致：

• 预设 9 档：从紧缩 -2pt 到加宽 5pt
• 快捷键支持：每次增减 0.5pt，范围 -5pt ~ 10pt
• 导出 Word 时精确转换为 twentieths of a point（Word 原生单位）

五、网格行距 — 公文排版标准

支持 Word 文档网格（Document Grid）特性，段落基线自动对齐到文档网格，完美还原政府公文 “每页固定行数” 的排版要求。

高保真文档互转

DOCX 导入 — 五阶段 IR 管线

JitWord 采用自研的中间表示（IR）架构，实现从 Word 到编辑器的高保真格式转换：

DOCX 文件 → XMLAST 解析 → DocIR 中间表示 → JitWord JSON 映射 → Schema 合规校验

关键能力：

• 格式完整保留
  
  段落对齐、字间距、字符缩放、行高、缩进等属性逐一映射
• CJK 属性提取
  
  自动识别文档级排版设置（标点压缩、折行规则、网格配置）
• 图片异步持久化
  
  嵌入图片自动提取、上传到服务端，支持降级到 Base64
• 智能降级
  
  docx4js 为主引擎，mammoth.js 作为兼容性备选
• 诊断报告
  
  导入后生成详细报告，标注不支持的特性和有损转换项

DOCX 导出 — 精确格式输出

编辑器内容反向导出为标准 Word 文档：

• 对齐方式精确映射（含分散对齐 AlignmentType.DISTRIBUTE）
• 字间距从 pt 转换为 Word 的 twips 单位（ptValue × 20）
• 字符缩放转换为 Word 百分比（0-400%）
• 支持浮动图片、复杂表格、有序/无序列表、代码块
• 数学公式支持：LaTeX 自动转换为 Word OMML 格式

PDF 导出 — 像素级还原

自研的 PDF 导出引擎，确保所见即所得：

• 逐元素分页
  
  精确计算每个元素的垂直空间占用，智能分页
• 双渲染策略
  
  优先使用 SVG foreignObject（更好的字体支持），自动降级到 Canvas 渲染
• 保真度校验
  
  导出后自动采样校验画布内容，检测空白或异常渲染并触发重试
• 布局锁定
  
  导出时等待字体加载、图片加载、DOM 稳定后再截图
• 图表/脑图静态化
  
  ECharts 图表和脑图自动转换为静态图片嵌入

单位体系统一

全链路采用 磅值（pt） 作为标准单位，与 Word 原生体系一致：

与其他 Web 编辑器的对比

最后总结一下

JitWord 从排版引擎层面解决了中文 Web 排版的核心痛点，通过自研的分散对齐算法、CJK 排版规范支持、五阶段 IR 导入管线和像素级 PDF 导出，实现了 Web 端对 Word 排版效果的真正对标。

无论是政府公文的严格格式要求，还是企业文档的专业排版需求，我们都能提供开箱即用的解决方案。

当然我们还在持续迭代优化，打造更高精度，更智能的AI协同文档系统，让个人和企业能更低成本将传统 Office “搬到”线上。

2.4版本即将上线，访问官网即可第一时间体验～

我的架构专栏