前端性能优化 |
您所在的位置:网站首页 › JM图片加载慢最简单三个步骤 › 前端性能优化 |
文章目录
一.大量图片加载优化方案
1.将图片服务和应用服务分离(从架构师的角度思考)
2. 图片压缩方案
3.图片懒加载
实现方案一
实现方案二
4.小图片比较多时
5.http2解决连接数限制
二、图片过大加载优化方案
加载的图片太多或者太大导致页面加载完成慢的问题;图片太多导致向服务器请求的次数太多,图片太大导致每次请求的时间过长,导致用户长时间等待。 一.大量图片加载优化方案 1.将图片服务和应用服务分离(从架构师的角度思考)对于服务器来说,图片始终是最消耗系统资源的,如果将图片服务和应用服务放在同一服务器的话,应用服务器很容易会因为图片的高I/O负载而崩溃,所以当网站存在大量的图片读写操作时,建议使用图片服务器。 浏览器在同一时间对同一域名下的资源的并发请求数目是有限制的,一般在2-6之间,超过限制数目的请求就会被阻塞.一些主流浏览器对 HTTP1.1 和 HTTP 1.0 的最大并发连接数目如图 我们可以借助一些第三方软件来进行压缩,压缩后分辨率不变,肉眼看不失真; 我们项目中对使用的图片基本都会进行压缩再上传。 3.图片懒加载图片懒加载,简单来说就是在页面渲染过程中,图片不会一次性全部加载,会在需要的时候加载,比如当滚动条滚动到某一个位置时触发事件加载图片。 为优化回流,可以先设置占位符 实现方案一 document.documentElement.clientHeight//获取屏幕可视区域的高度 document.docum |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |