一个页面上有大量的图片，加载很慢，你有哪些方法优化这些图片的加载？

2024-04-06 05:37:02

一个页面上有大量的图片，加载很慢，你有哪些方法优化这些图片的加载？

1、使用 Sprites 图片技术

它将一个页面涉及到的所有零星图片都包含到一张大图中去，然后利用 CSS 技术展现出来。这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了，可以减少了整个网页的图片大小，并且利用 CSS Sprites 能很好地减少网页的 http 请求，从而大大的提高页面的性能。

2、压缩文本和图片

压缩技术如 gzip 可以有效减少页面加载的时间。压缩率都可以在大小 70%左右。虽然文本压缩用得比较多，但图片的压缩就比较随意，很多都是直接上传，其实还有很大的压缩空间。

3、延迟显示可见区域外的内容

为了确保用户可以更快地看见可见区域的网页可以延迟加载或展现可见区域外的内容，为了避免页面变形，可以使用占位符标签制定正确的高度和宽度。比如 WP 的 jQueryImage LazyLoad 插件就可以在用户停留在第一屏的时候，不加载任何第一屏以下的图片信息，只有当用户把鼠标往下滚动的时候，这些图片才开始加载。这样很明显提升可见区域的加载速度，提高用户体验。

4、确保功能图片优先加载

先加载图片再加载其它，会使用户体验感好。但速度不会提升

5、图片格式优化

不恰当的图像格式是一种极为常见的减慢加载速度的罪魁祸首。正确的图片格式可以让图片缩小数倍，如果保存为最佳格式。可以节省大量带宽，减少处理时间时间，大大加快页面加载速。

6、使用 Progressive JPEGs

Progressive JPEGs 图片是 JPEG 格式的一个特殊变种，名为“高级 JPEG”。在创建高级 JPEG 文件时，数据是这样安排的：在装入图像时，开始只显示一个模糊的图像，随着数据的装入，图像逐步变得清晰。它相当于交织的 GIF。

一个页面上有大量的图片，加载很慢，你有哪些方法优化这些图片的加载？相关推荐

一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图片的加载，给用户更好的体验。
一个页面上有大量的图片(大型电商网站),加载很慢,你有哪些方法优化这些图片的加载,给用户更好的体验. 图片懒加载,滚动到相应位置才加载图片. 图片预加载,如果为幻灯片.相册等,将当前展示图片的前一张和 ...
面试题系列(10)：一个大型电商网有大量的图片，加载很慢，你有哪些方法优化这些图片的加载？...
A. 图片懒加载,滚动到相应位置才加载图片.原理是这个可以用js监控滚动的位置,当初图片位置出现或者即将出现在可视区域时,进行加载. B. 图片预加载,如果为幻灯片.相册等,将当前展示图片的前一张和后 ...
一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图片的加载，给用户更好的体验。...
a. 图片懒加载,滚动到相应位置才加载图片. b. 图片预加载,如果为幻灯片.相册等,将当前展示图片的前一张和后一张优先下载. c. 使用CSSsprite,SVGsprite,Iconfont.Ba ...
页面上水平飞舞的图片
<html><head><meta http-equiv="Content-Type" content="text/html; charse ...
PDF N-Up Maker:一个把PDF转成小册子或者把多个页面放到一个页面上的工具（免费，免Acrobat，命令行模式）...
N-Up Printing allows you to shrink several pages onto one page(N-Up打印输出允许你缩小若干个页面到一个页面上) Booklet就是小 ...
svg上传服务器无法显示,让WordPress支持上传SVG格式图片并显示在媒体库中的方法...
让WordPress支持上传SVG格式图片并显示在媒体库中的方法发布时间:2020-12-11 14:18:12 来源:亿速云阅读:167 作者:小新这篇文章将为大家详细讲解有关让WordPre ...
页面上有大量的图片，网页加载很慢，可以用哪些方法优化这些图片
对于图片懒加载,可以为页面添加一个滚动条事件,判断图片是否在可视区域内或者即将进入可视区域,优先加载. 如果为幻灯片.相册文件等,可以使用图片预加载技术,对于当前展示图片的前一张图片和后一张图片优先下 ...
一个页面上多个form表单的用json数据格式提交到后台
在项目开发中遇到多个表单需要提交到后台,而且其中包含一些table数据,所以最后经过查询资料总结出以下方法:(我用的前端框架是layui其他的思想应该是一样的) 在看代码之前先说一下我的思路,因为代码 ...
上一个程序员提桶跑路了，我接手后用这些方法优化了项目
作者小三是刚刚毕业不久全栈工程师,写的技术文章基本上是学习过程中笔记整理而来,大家看了之后如果喜欢可以给小弟点点赞哦. 例外小弟还有个程序员交流群,欢迎各位大佬来摸鱼哈.点击加群平常我们在开发和维护 ...

最新文章

热门文章