Imposia 文档
把 React HTML 变成可以预览、打印、另存为 PDF 的浏览器页面。
做一个让用户编辑内容并打印的功能,最后往往会得到三份自称是同一份的文档:编辑器渲染内容,预览克隆一份,打印路径又在别处重建一份。于是预览显示 12 页,PDF 却有 13 页,没有人能说清哪个才是对的——因为从来没有人规定过以哪一份为准。
Imposia 消除的正是这个问题。它把你现有的 HTML 和 CSS 在浏览器内排成一份分页文档,而每个输出面——预览、原生打印、另存为 PDF——观察的都是这同一份已完成的文档。
构建第一个页面
安装 React 包,大约十分钟内把 HTML 渲染成 A4 页面。
加载图片与字体
实现 assetResolver——外部资源进入文档的唯一通道。
出版模型
了解预览、打印页面与 PDF 为何始终一致。
API 参考
React 句柄、Core 控制器、Viewer 导航与生命周期规则。
你的 HTML 会经历什么
- 应用把 HTML、CSS 和页面选项交给 Imposia。
- Core 在临时 iframe 中对下一份文档分页。
- 分页完成后,Imposia 一步替换可见文档。
如果分页失败,或更新的任务先一步到来,读者看到的仍是上一次完成的文档。他们绝不会看到排到一半的布局。
一次提交的源内容能产出什么
| 输出 | 获取方式 | 你得到的结果 |
|---|---|---|
| 预览 | React Viewer | 已完成的页面,直接由 canonical iframe 展示 |
| 打印或 PDF | print() | 浏览器原生打印对话框,读者在其中选择打印机或另存为 PDF |
| EPUB | exportEpub() | 可选。由已提交的源内容生成的可重排 EPUB 3.3 Blob |
体积与速度
| 使用路径 | gzip 体积 | gzip 预算 |
|---|---|---|
| Core · PageDocument | 63.2 KiB | 63.5 KiB |
| Core · Publication | 67.5 KiB | 68 KiB |
| Viewer · PageDocument | 11.8 KiB | 13 KiB |
| Client · PageDocument | 71.8 KiB | 72 KiB |
| React · PageViewer | 73.6 KiB | 74 KiB |
体积于 2026 年 9 月 27 日基于 0.6.0 测得,不包含 React 和 React DOM。Core 完整浏览器文件为 gzip 68.4 KiB。为反映分页正确性修复带来的增长,预算上调了 1–1.5 KiB;这不是体积优化。测量方法与预算调整依据。
| 项目 | 结果 |
|---|---|
| 为 99 页的文章分页 | 127 ms |
| 修改该文章中的一个词并重新提交 | 127 ms |
| 提交后的第一帧渲染 | 2.0 ms |
为每个条目都有自己 <style> 的 100 条目 Publication 分页 | 97 ms |
运行时间仍为 2026 年 9 月 24 日在 Apple M4、Chromium 149 上运行 7 次的中位数。先运行 pnpm build,再用 pnpm bundle:size 测量体积或用 pnpm benchmark 测量时间。
认清边界
Imposia 不生成 PDF 字节
print() 打开的是浏览器自身的打印流程。Imposia 没有 PDF 渲染器,没有 Node 或 CLI 渲染器,也没有服务端出版 API。如果你的应用需要在服务器上得到 PDF 字节,Imposia 不是合适的工具——请改用无头浏览器或服务端渲染器。
Imposia 在浏览器中运行,并以 ESM 形式发布。如果这符合你的应用,请继续阅读构建第一个页面。