渐进式JPEG技术(Progressive JPEGs)

  在前端优化过程当中,一种叫做progressive jpegs的技术正被广泛的应用着。Webpagetest也已将progressive jpegs作为评价的一项指标。我在此简单介绍一下。

优点

  使用递增式编码来存储JPEG文件的好处可以从两个角度来说明:

  用户体验

  一个以progressive方式编码的jpeg文件,在浏览器上的渲染方式是由模糊到清晰的。用户能在渐变的图像当中获得所需信息的反馈。如果内容不是用户所期待的,用户就能提前前往新的页面。

  

  文件大小

  有实验证明,在JPEG文件小于10KB的时候,使用标准型编码(Huffman表已经被优化)的JPEG文件要小于使用渐变式编码的JPEG文件(发生概率为75%)。当文件大于10KB时,渐变式编码的JPEG文件有94%的概率拥有比标准编码的文件更小的体积。

使用方法

  以photoshop为例,操作可按如下步骤进行

  

  在文件菜单中选择”Save for Web”(存储为Web格式)

  

  在”Save for Web”窗口中,勾选”Progressive”,然后保存即可。

        没安photoshop?不要紧,再推荐一个工具——jpegtran(72KB)。基于命令行操作,参数在程序内都有说明,一个典型的命令行是这样的:jpegtran -copy none -progressive source.jpg result.jpg

已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页