图片合理的优化方式
Posted 水香木鱼
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了图片合理的优化方式相关的知识,希望对你有一定的参考价值。
图片应该都不陌生吧,在网页中,往往存在大量的图片资源,这些资源或大或小。
当我们页面中DOM中存在大量的图片时,难免不会碰到一些加载缓慢的问题,导致图片出现加载失败的问题。
网络上大部分都在使用 懒加载
的使用方式,只有当 存在图片的DOM
出现在页面上才会进行图片的加载,无形中起到了分流的作用,下面就说一套实践的方案吧
- 小图标使用
SVG
或者字体图标 - 通过
base64
和webp
的方式加载小型图片 - 能通过cdn加速的大图尽量用cdn
- 大部分框架都带有懒加载的图片,不要嫌麻烦,多花点时间使用它
以上是关于图片合理的优化方式的主要内容,如果未能解决你的问题,请参考以下文章