关闭

图片问题

标签: 图片
103人阅读 评论(0) 收藏 举报
分类:

目前,图片内容已经占互联网内容的62%,也就是说有超过半数的下载量都是图片,所以图片的大小就影响着网页加载的速度,对性能优化有很大的影响。

现在网页中较常用到的图片格式有:jpg、png、gif、webp等,还有一些我没听说过的。。比如apng、svg(ps:暴露了孤陋寡闻 T T)

贴一张各种图片格式特点的图:

图片使用分析过程:

jpg适合显示照片等颜色丰富的图片

据资料显示:在 Photoshop软件中以JPEG格式储存时,提供11级压缩级别,以0—10级表示。其中0级压缩比最高,图像品质最差。以BMP格式保存时得到4.28MB图像文件,在采用JPG格式保存时,其文件仅为178KB,压缩比达到24:1。经过多次比较,采用第8级压缩为存储空间与图像质量兼得的最佳比例。

当显示一些较为通用的动画时,例如loading图,适合使用gif格式

如果需要清晰的显示颜色丰富的图片,PNG比较好

PNG-8适合显示颜色数较少但需要半透明的情景(如微信动画大表情)

PNG-24不支持透明,颜色丰富的图片推荐使用(如屏幕截图、界面设计图)

PNG-32支持透明,效果最好但尺寸也最大

webp是一种新的图片文件格式,由google推出。在相同质量的情况下,比png文件尺寸更小,但是兼容性不好,有很多浏览器还不支持

在智图上测试的例子:

同质量情况下,jpg格式转化为webp后图片的尺寸有了减小

转化为png:大小为

jpg转png时:若原图颜色单一,则png图片大小会较jpg减小;若颜色丰富,则大小会增加

 

介绍一下jpg的压缩:

JPEG 是通过波的叠加的形式存储图片信息,不是按照像素的形式。

JPEG 的算法的核心是通过在图片的频率空间减少不重要信息,但减少信息就会引入噪声,使图像的质量下降。

 

所谓的频率空间,就是将图片进行二维离散傅里叶变换得到的图片。(感觉很厉害的样子)

我看了一篇知乎上的文章:

想看原文点这里

我理解的意思就是:有一个图片压缩方式:减小频率空间的面积,即减少信息,在一定程度内,对图片质量并无大的影响,肉眼分辨不出;超出这个程度,图片就会变得不清。

这种方式同样可以用在音频、视频压缩


0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:23230次
    • 积分:525
    • 等级:
    • 排名:千里之外
    • 原创:43篇
    • 转载:16篇
    • 译文:1篇
    • 评论:5条
    文章分类
    最新评论