两张 jpg 图片通过 canvas 合并成一张 jpg 后，为什么文件大小远大于原来两张图片之和？
Reign · 2017-10-11 18:33:50 +08:00 · 3284 次点击这是一个创建于 2396 天前的主题，其中的信息可能已经有所发展或是发生改变。
以下两张图片：
https://i.imgur.com/MgbyBoA.jpg ，文件大小：30kb
https://i.imgur.com/mONiRZ7.jpg ，文件大小：55kb
现在通过的 js 来合并这两张图片为一张，代码在 jsfiddle： https://jsfiddle.net/fwsa6r2z/
设置了合并后的图片质量为 1.0，但是为什么合并后的文件大小是 296kb 远大于两张图片大小之和 85kb ？ 求好心 V 友解疑释惑一下，如果我想保证 js 合并后的的图片跟原来图片大小之和一样大，该怎么写这个代码？
第 1 条附言 · 2017-10-11 19:08:32 +08:00
Google 了一个在线工具： http://www.filesmerge.com/merge-jpg，这个工具合并这两个 jpg 后，文件大小刚好是 85kb，这又是为何？
 |
1
foru17 2017-10-11 18:40:01 +08:00
https://stackoverflow.com/questions/9773154/canvas-todataurl-increases-file-size-of-image
the dataURL uses base64 encoding which makes it around 1.37 X larger each browser processes the toDataURL function differently https://stackoverflow.com/questions/11402329/base64-encoded-image-size 跟 Base64 编码有关。 |
 |
2
qdwang 2017-10-11 18:41:48 +08:00 via iPhone
因为质量是 1 没有压缩
原本的两张图片是压缩过的 |
 |
3
Reign OP @foru17 谢谢，既然是“ it around 1.37 X larger ”，为何 296kb/85kb=3.48 ？？
|
|
5
qdwang 2017-10-11 18:47:16 +08:00 via iPhone
你搞两张质量 1.0 的 再合并试试看
|
 |
6
ysc3839 2017-10-12 10:32:50 +08:00 via Android
这个是很难确定的，跟图像的编码算法有关。
没记错的话，canvas 保存的是 png 图片，png 是无损压缩，而 jpg 是有损压缩。 |
Select Language
