PDF 压缩听起来简单，但很多人遇到压缩后文字模糊、图片失真、或压缩效果不理想的问题。今天聊聊纯前端 PDF 压缩的核心问题和解决方案。
压缩的常见场景
| 场景 | 说明 |
|---|---|
| 邮件附件 | PDF 太大无法通过邮件发送 |
| 网站上传 | 表单或 portal 有文件大小限制 |
| 存储节省 | 归档大量 PDF 节省磁盘空间 |
| 分享传输 | 通过微信等应用分享大文件 |
技术方案：pdf-lib 压缩 PDF
核心实现
import { PDFDocument } from 'pdf-lib'
async function compressPdf(
arrayBuffer: ArrayBuffer,
quality: number = 80
): Promise<Uint8Array> {
const pdfDoc = await PDFDocument.load(arrayBuffer, {
updateObjectStreams: true
})
// 启用对象流压缩
const saved = await pdfDoc.save({
updateObjectStreams: true,
objectsPerTick: 50
})
return saved
}
关键点：对象流压缩
pdf-lib 支持通过 updateObjectStreams 启用对象流：
await pdfDoc.save({ updateObjectStreams: true })
这会将 PDF 内部数据结构压缩为流格式，减小文件体积。
关键点：分块处理
大文件使用 objectsPerTick 防止 UI 卡死：
await pdfDoc.save({
updateObjectStreams: true,
objectsPerTick: 50
})
常见坑位
坑 1：过度压缩导致模糊
质量设置过低会导致文字和图像模糊。
解决方案：
- 文档类使用 80-90% 质量
- 图片类使用 60-70% 质量
- 预览确认后下载
坑 2：压缩效果不明显
部分 PDF 已经是优化过的，压缩空间有限。
解决方案：
- 检查原始 PDF 是否已压缩
- 尝试不同的压缩强度
- 扫描类 PDF 通常压缩效果更好
坑 3：复杂布局变形
包含表单、嵌入式字体或复杂布局的 PDF 可能压缩后出现问题。
解决方案：
- 压缩前检查布局
- 重要文档使用低压缩比
- 复杂 PDF 考虑桌面软件
坑 4：大文件内存不足
超大 PDF（50MB+）可能导致浏览器内存溢出。
解决方案：
- 关闭其他标签页释放内存
- 分批处理大文件
- 使用桌面工具处理超大文件
坑 5：图片重压缩丢失
pdf-lib 本身不直接重新编码嵌入图片。
解决方案：
- 使用 pdf.js 重新渲染页面
- 或在压缩后检查图片质量
- 必要时使用专业工具
和其他转换方式的区别
| 工具 | 处理方式 | 适用场景 |
|---|---|---|
| 纯前端工具 | 浏览器本地处理 | 敏感文档、隐私优先 |
| 在线转换工具 | 上传服务器处理 | 普通文档 |
| Adobe Acrobat | 桌面软件完整处理 | 复杂文档、专业需求 |
纯前端的优势是隐私安全，适合处理敏感文档。
使用建议
- 控制压缩强度：根据文档类型选择合适的质量
- 预览效果：压缩后抽查几页确认质量
- 敏感文档本地处理：不要用上传式工具
- 保留原始文件：压缩前务必备份
总结
- PDF 压缩核心是质量平衡和对象流优化
- 文档类建议 80-90%，图片类 60-70%
- 纯前端方案适合私密文档
- 复杂文档建议使用桌面软件
搜索「PDF压缩」即可找到纯浏览器端工具，文件不上传服务器。
