- 博客(3)
- 收藏
- 关注
RSS订阅原创 前端性能优化 - 优化图片资源
页面性能优化是前端开发的重要环节，不论工作中还是应对面试都是必不可少的技能，性能优化不是某项单独技术，而是一项项细小调优的积累。从节省流量的角度出发，图片资源是流量开销最大的一块。本篇主要介绍针对资源图片一些优化方案。文章目录图片格式选择（jpg、png）如何使用webp合理的使用尺寸使用svg资源格式压缩iconfont vs 小图标合并请酌情使用DataURLlazyload懒加载使用css3代替图片图片格式选择（jpg、png）jpg和png是目前最常用的位图格式选取原则：优选选择pn
2020-07-31 15:03:15
583
原创 如何使用WebP
webp是google推出的web图片格式。优点显而易见，它为web图片优化而生，在质量相同的情况下，webp格式的体积要比jgp格式小40%。缺点是只有chrome上能放心使用webp，其它浏览器支持的非常差，新版本也已经开始支持，这确实是一个利好消息支持程度略感人，所以如果想webp的话，为不同浏览器做兼容是项必不可少的工作，但如果你的网站中会用到大量的图片资源，多做这一点事绝对是值得的。让我们看一下淘宝是怎么做兼容的Safari下图片路径：https://img.alicdn.co.
2020-07-31 09:48:28
711
1
原创 h5底部留白，适配iphoneX安全区域
参考文章:https://developer.mozilla.org/zh-CN/docs/Web/CSS/env在meta标签中设置viewport-fit=cover<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">css中可以通过safe-
2020-07-23 10:41:23
2135
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人