A. 图片懒加载,滚动到相应位置才加载图片。原理是这个可以用js监控滚动的位置,当初图片位置出现或者即将出现在可视区域时,进行加载。
B. 图片预加载,如果为幻灯片、相册等,将当前展示图片的前一张和后一张优先下载。
C. 使用CSSsprite,SVGsprite,Iconfont、Base64等技术,如果图片为css图片的话。
D. 如果图片过大,可以使用特殊编码的图片,加载时会先加载一张压缩的特别厉害的缩略图,以提高用户体验。
A. 图片懒加载,滚动到相应位置才加载图片。原理是这个可以用js监控滚动的位置,当初图片位置出现或者即将出现在可视区域时,进行加载。
B. 图片预加载,如果为幻灯片、相册等,将当前展示图片的前一张和后一张优先下载。
C. 使用CSSsprite,SVGsprite,Iconfont、Base64等技术,如果图片为css图片的话。
D. 如果图片过大,可以使用特殊编码的图片,加载时会先加载一张压缩的特别厉害的缩略图,以提高用户体验。
上一篇:对前端工程师这个职位的理解
下一篇:HTTP 和 HTTPS
一个页面上有大量的图片,加载很慢,你有哪些方法优化这些图片的加载?1、使用 Sprites 图
于实现了。1 在异步加载之前的代码的和普通加载代码一样,只需要
网站图片优化方法 图像压缩JPEG/JPGPNG (PNG-8 与 PNG-24)WebP# 图像压缩 1.使用
在项目开发中,我们往往会遇到一个页面需要加载很多图片的情况。我们可以一次性加载全部的图片,但是考虑到用户有可能只浏览部分图片。所以我们需要对图片加载进行优化,只加载浏览器窗口内的图片,当用户滚动时,再加载更多的图片。这种加载图片的方式叫做图片懒加载,又叫做按需加载或图片的延时加载。这样做的好处是:1.可以加快页面首屏渲染的速度;2.节约用户的流量。一.实现思路1.图片img标签自定义一个属性dat
举报文章
请选择举报类型
补充说明
0/200
上传截图
格式支持JPEG/PNG/JPG,图片不超过1.9M