纯前端 DOM 转 PDF 能力演示文档
这个默认示例不再强调“花哨样式拼盘”，而是更贴近真实业务文档：同一份 DOM 同时覆盖中英混排、长文本、结构化表格、内联 SVG、代码块、数学公式、分页控制和跨页保护容器。这样既能更完整地展示 dompdf.js 的能力，也更容易和 html2pdf.js 拉开最终 PDF 体积差。
文本、字体与可复制性
这一节优先展示 dompdf.js 最值得看的能力：文字仍然是文字，而不是被摊平成整页位图。对业务文档来说，可检索、可复制、可缩放通常比“看起来差不多”更重要。
双语业务摘要
城市更新试点 2026 / Urban Renewal Pilot 目前进入交付前评审阶段。当前版本重点验证多语言段落在 A4 分页、字体嵌入、字宽计算与表格复制中的稳定性，确保导出后的 PDF 能够满足“归档、分发、审阅、检索”四类业务场景。
For the export engine, a realistic stress sample matters more than decorative gradients. The document should contain long paragraphs, dense tables, repeated labels, page boundaries, and inline vector figures so the resulting PDF exposes actual trade-offs in text fidelity, object count, and payload size.
矢量图形与位图样本
默认示例保留一张小位图，只用于验证图片压缩与嵌入；真正的主角切换成内联 SVG 图表和流程示意，更接近 dompdf.js 的优势场景。
内联 SVG 指标图
这类内联矢量图在 dompdf.js 中可以保持清晰边缘与可缩放性，而 html2pdf.js 更倾向于把整页转换成截图。
小位图保留样本
这里仍保留一张通过 Canvas 生成的 JPEG，用来验证图片压缩、尺寸保持与嵌入链路是否稳定，但它不再主导整个演示页面。
布局、裁切、透明度与流程图
这一节主要看复杂盒模型在 PDF 中是否稳定，包括透明叠层、裁切区域、边框圆角、内联代码以及矢量流程框图。
渲染流程示意
裁切样本
这个容器启用了 overflow: hidden。
透明度样本
结构化表格与文本检索
下面的明细表会动态生成较多行，用来同时验证列宽、换行、字体嵌入、复制顺序和多页表格的稳定性。这类内容对 dompdf.js 更友好，也更接近真实报告、清单和审计文档。
能力验证矩阵
覆盖段落、编号、日期、金额、状态标签与中英混排字段。
| Region / Division | H1 Performance | H2 Forecast | SLA Status | ||
|---|---|---|---|---|---|
| Revenue | Margin | Revenue | Margin | ||
如果这一整页在导出后仍然可以按正常顺序选中、复制并搜索字段名、编号和日期，那么说明文本对象、字形映射与表格结构都处于比较可用的状态。
定义列表、代码块与数学符号
这部分主要观察预格式文本、符号字体和公式布局。样式会保持克制，避免视觉噪音影响阅读和对比。
Definition List
- Snapshot
- Collect geometry, text runs, style tokens, and image payloads on the main thread.
- Pagination
- Assign lines and blocks to pages while respecting
pageBreakanddivisionDisable. - Emission
- Write native PDF objects, text operators, fonts, and xobjects without third-party PDF libraries.
Preformatted Flow
render(root)
-> collectSnapshotData(root)
-> normalizeTextRuns(snapshot)
-> worker.postMessage(snapshot)
-> wasm.render_pdf(snapshot)
-> Blob(application/pdf)数学和符号样本
欧拉恒等式：
eiπ + 1 = 0
高斯积分：
∫-∞+∞ e-x² dx = √π
贝叶斯定理：
P(A | B) = P(B | A) · P(A) / P(B)
分段函数：
f(x) = x²2x + 13 - x if x < 00 ≤ x < 1x ≥ 1
分页压力测试与附录
这部分故意堆叠较长的正文和多条记录，让输出自然跨页。对于 html2pdf.js 来说，每一页更像一张大截图；对于 dompdf.js 来说，文本密度增加并不会线性放大到同样程度。
强制分页样本
冻结 DOM Snapshot 字段，确保文本、图片、布局与分页控制信号都能稳定进入 Worker。
重点回归中文字体、数字、英文单词、代码片段、数学符号与复制顺序。
用真实长度的文档内容拉开最终 PDF 体积差，并确认分页切点不漂移。
divisionDisable 样本
这个模块带有 divisionDisable 属性。跨页时它应该整体移动到下一页，而不是被从中间切断。真实业务里，签字区、报价摘要、审批意见、票据封面等模块通常都需要这种保护。
如果这个卡片在页边界处被截开，说明复杂容器在分页合并和块级迁移上的策略还需要继续修正。