渐进式jpg

渐进式:从模糊变清晰,有利于用户体验,但是低版本IE不支持,会在图片完全加载完之后,突然显示!

基线式:支持所有浏览器,从上到下加载,用户体验一般!

*使用渐进式jpg,在ps中选择“另存为web格式”,在右侧勾选上“连续”!

在fw中,图像选项,勾选上“渐进式增强”!

下表为其在各个浏览器下测试的结果:

浏览器(特定测试版本)渐进jpeg前景渲染渐进jpeg背景渲染

Chrome

渐进地 (相当快!)渐进地 (相当快!)

Firefox (v 15.0.1 Mac, 12.0 Win)渐进地 (相当快!)文件下载后立即地(慢)

Internet Explorer 8文件下载后立即地(慢)文件下载后立即地(慢)

Internet Explorer 9渐进地 (相当快!)文件下载后立即地(慢)

Safari (v 6.0 Desktop, v 6.0 Mobile)文件下载后立即地(慢)文件下载后立即地(慢)

Opera (v 11.60)文件下载后立即地(慢)文件下载后立即地(慢)

结论很简单,Chrome + Firefox + IE9浏览器下,渐进式图片加载更快,而且是快很多,至于其他浏览器,与基本式图片的加载一致,至少不会拖后腿。

渐进式图片其他的补充:

1. 你永不知道基本式图片内容,除非他完全加载出来;

2. 渐进式图片一开始大小框架就定好,不会像基本式图片一样,由于尺寸未设定而造成回流——提高的渲染性能;

3. 渐进式图片也有不足,就是吃CPU吃内存。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,845评论 1 92
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,081评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,131评论 19 139
  • 文/果巴大叔 目录:逆风飞扬 点阅上一章逆风飞扬(17) 叮铃,大清早一条短信过来了,睡眼朦胧的刘强用力睁...
    果巴大叔阅读 433评论 3 5
  • 今天启动 Chrome (版本 56.0.2924.87) 突然出现意外退出的情况,表现为: 打开时应用内提示是否...
    roamr阅读 8,538评论 0 4