Baseline JPEG(标准型)和 Progressive JPEG(渐进式)的区别

作者: 分类: 前端 发布于:2016-9-23 14:31 ė913次浏览 60条评论
简介:
JPEG文件有两种保存方式,分别是Baseline JPEG(标准型)和Progressive JPEG(渐进式)。两种格式有相同尺寸以及图像数据,扩展名也是相同的,唯一的区别是二者显示的方式不同。

Baseline JPEG
这种类型的JPEG文件存储方式是按从上到下的扫描方式,把每一行顺序的保存在JPEG文件中。打开这个文件显示它的内容时,数据将按照存储时的顺序从上到下一行一行的被显示出来,直到所有的数据都被读完,就完成了整张图片的显示。如果文件较大或者网络下载速度较慢,那么就会看到图片被一行行加载的效果,这种格式的JPEG没有什么优点,因此,一般都推荐使用Progressive JPEG。

Progressive JPEG
和Baseline一遍扫描不同,Progressive JPEG文件包含多次扫描,这些扫描顺寻的存储在JPEG文件中。打开文件过程中,会先显示整个图片的模糊轮廓,随着扫描次数的增加,图片变得越来越清晰。这种格式的主要优点是在网络较慢的情况下,可以看到图片的轮廓知道正在加载的图片大概是什么。在一些网站打开较大图片时,你就会注意到这种技术。

注:
渐进式图片带来的好处是可以让用户在没有下载完图片就可以看到最终图像的大致轮廓,一定程度上可以提升用户体验。(瀑布留的网站建议还是使用标准型的)
另外渐进式的图片的大小并不会和基本的图片大小相差很多,有时候可能会比基本图片更小。渐进式的图片的缺点就是吃用户的CPU和内存,不过对于现在的电脑来说这点图片的计算并不算什么。

浏览器支持情况
dcfc5c2c-02be-11e5-911e-ece2af1c5e8e.png
即便在浏览器不支持的情况下,由于 Progressive 格式的图片比原图小,加载也会更快。

如何转换
在photoshop中有“存储为web所用格式”,打开后选择“连续”就是渐进式JPEG。
20130724155813.jpg


参考:
http://blog.jobbole.com/44038/
https://github.com/imweb/mobile/issues/4

本文出自 赵金添的前端博客@福州软件外包公司,转载时请注明出处及相应链接。

0
分享本文至:

发表评论

电子邮件地址不会被公开。必填项已用*标注


Ɣ回顶部