网站性能优化：尽量减少向服务器请求的次数 “减少HTTP请求”：
a、CSS/JS文件进行合并
b、ICON图片也进行合并--->雪碧图
c、图片的延迟加载
d、数据的异步加载
e、在移动端，若做一个“简单的”宣传页，尽量把js和css写成内嵌式
图片延迟加载
作用：
保证页面打开的速度（3s之内如果首页打不开就死了）
网站性能优化：尽量减少向服务器请求的次数 “减少HTTP请求”。（CSS/JS文件进行合并
原理：
a、对于首屏内容中的图片：首先给对应的区域一张默认图片占着位置（默认图需要非常小，一般可以维持在5kb以内），当首屏内容都加载完成后（或者也可以给一个延迟的时间），再开始加载真实的图片
b、对于其他屏中的图片：也是给一张默认的图片占位，当滚动条滚动到对应区域的时候，再开始加载真实的图片
扩展：数据的异步加载，开始只把前两屏的数据加载绑定出来，后面的数据不进行处理，当页面滚动到对应区域的时候再重新请求数据然后绑定渲染数据
——————————————————————————————————
首屏延迟图片加载：
//html部分：img标签外要有个包裹容器
<div id="wrap">
<img src="" trueImg="img/1.png" />
</div>
//css部分：外层包裹容器设置背景默认图片；img的src为空，加载时浏览器会出现碎图，所以先隐藏，加载完真实图片后再取消隐藏
#wrap{
background:url(img/2.png) no-repeat center center;
}
img{
display:none;
}
//js部分
window.setTimeout(function(){
var oImg=new Image;//创建一个临时img标签
oImg.src=img.getAttribute("trueImg");
oImg.onload=function(){//代表真实图片能够正常加载
img.style.display="block";
img.src=this.src;
oImg=null;
}
},500);
——————————————————————————————————
其他屏的单张图片延迟加载：
原理：
image.png
window.onscroll=function(){
if(wrap.isLoad){//已经加载过了
return;
}
var A=wrap.offsetHeight+wrap.offsetTop;
var B=document.documentElement.clientHeight||document.body.clientHeight+document.documentElement.scrollTop||document.body.scrollTop;
if(A<B){
//当条件成立，加载真实的图片，第一次加载完成后，在让页面继续滚动的过程中，A<B一直成立，又重新执行下面的操作，导致重复给一个容器中的图片进行加载
var oImg=new Image;
oImg.src=img.getAttribute("trueImg");
oImg.onload=function(){
img.src=this.src;
img.style.display="block";
oImg=null;
};
wrap.isLoad=true;//设置一个自定义属性，告诉浏览器已经把图片加载完了(不管是否正常加载，只要处理过一次以后都不再处理了)
}
}
