图片预加载

图片预加载是为了提高用户在浏览很多图片时的体验效果，比如我们在做图片翻转显示等待特效的时候，为了让图片在转换的时候不出现等待，我们最好是先让图片下载到本地，然后在继续执行后续的操作。与图片懒加载相反，一个是提前加载，一个是迟缓甚至不加载。懒加载对服务器前端有一定的缓解压力作用，预加载则会增加服务器前端压力。

 

理解：一般浏览器加载图片是按需加载，就是当你请求图片时才给你加载你需要的图片；

　　      预加载就是在你请求之前将图片加载下来，当你请求时直接从浏览器缓存中响应给你；

　　　  懒加载就是在你请求图片时不给你加载，当你到了指定位置时再给你加载。

 

方法：现有的预加载方法是一次加载全部图片和一次加载部分图片，视项目而定。（待补充......）

 

js预加载图片使用new Image()基本够用了

new Image().src = 'http://img02.taobaocdn.com/tps/i2/T1iQhUXnxpXXXXXXXX-171-48.png'; //淘宝
new Image().src = 'http://static.paipaiimg.com/module/logo/logo_2011_02_22.png'; //拍拍
new Image().src = 'http://co.youa.baidu.com/picture/services/images/logo.png'; //有啊
new Image().src = 'http://img1.t.sinajs.cn/t35/style/images/common/header/logoNew_nocache.png'; 

 

预加载css、js、图片方法介绍及各浏览器测试效果：http://www.jb51.net/article/42085.htm

new Image预加载图片详解：http://www.cnblogs.com/mz121star/archive/2012/11/01/javascript_preloadimages.html

预加载常见的三种方法：http://www.jb51.net/article/57579.htm