js公共库-最全免费CDN公共库-加速你的JS-js图片延迟加载

来源:js图片加载技术实例 浏览:3188次 时间:2019-03-23
做网站找雨过天晴工作室

js公共库-最全免费CDN公共库-加速你的JS-js图片延迟加载

雨过天晴工作室在制作网页的过程中,有些js的调用本地化的过程中发现很依赖网站空间的速度,这样有些效果就会延迟甚至不加载,于是很多js在公共库里面可以直接调用,这样既能加速网页,又能节省网站空间和流量,这里收集了目前比较流行的JS公共库。

I. 开源静态文件 CDN

我们的目标是提供这样一个仓库,让它尽可能全面收录优秀的开源库,并免费为之提供 CDN 加速服务,使之有更好的访问速度和稳定的环境。同时,我们也提供开源库源接入的入口,让所有人都可以提交开源库,包括 JS、CSS、image 和 swf 等静态文件。(staticfile介绍)


下面是我找到的几个常用的cdn库,以jquery为例。

II. 新浪SAE公共资源 推荐指数★★★ 支持https

http://lib.sinaapp.com/js/jquery/2.0.3/jquery-2.0.3.js
http://lib.sinaapp.com/js/jquery/1.8.2/jquery.min.js
http://lib.sinaapp.com/js/jquery-mobile/1.3.1/jquery.mobile-1.3.1.js
更多版本: http://lib.sinaapp.com/

III. Microsoft Ajax CDN 推荐指数★★★ 支持https

http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js
http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js
http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.22/jquery-ui.j
更多版本:http://www.asp.net/ajaxlibrary/cdn.ashx

IV. Google Ajax CDN 推荐指数★ 支持https

https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js
https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js
更多版本:https://developers.google.com/speed/libraries/?hl=zh-CN
谷歌抽风的可以使用下面360提供的谷歌缓存

V. 百度libs 推荐指数★★★★

http://libs.baidu.com/jquery/1.9.0/jquery.js
http://libs.baidu.com/jquery/2.0.0/jquery.min.js
http://libs.baidu.com/jquerymobile/1.3.0/jquery.mobile-1.3.0.js
更多版本:http://developer.baidu.com/wiki/index.php?title=docs/cplat/libs#jQuery

VI. 又拍云JS库 推荐指数★★ 支持https

http://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.3.min.js
http://upcdn.b0.upaiyun.com/libs/jqueryui/jquery.ui-1.10.3.min.js
更多版本:http://jscdn.upai.com/

VII. BootCDN(此为Bootstrap中文网与又拍云存储联合推出,使用又拍云服务器 推荐指数★★★★ 支持https

http://cdn.bootcss.com/jquery/jquery-2.0.3.min.js
http://cdn.bootcss.com/jqueryui/jquery.ui-1.10.3.min.js
更多版本:http://www.bootcdn.cn/

VIII. CDNJS by CloudFlare 推荐指数★ 支持https

http://cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js
更多版本:http://cdnjs.com/

IX. Jsdelivr 推荐指数★ 支持https

http://cdn.jsdelivr.net/jquery/2.1.0/jquery.js
http://cdn.jsdelivr.net/jquery/2.1.0/jquery.min.js
更多版本::http://www.jsdelivr.com/

X. staticfile(使用七牛云存储)推荐指数★★

http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.js
http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.js
http://cdn.staticfile.org/jquery/2.1.1-rc2/jquery.min.map
更多版本:http://www.staticfile.org/

XI. Bootstrap中文网(使用又拍云存储) 推荐指数★★ 支持https

http://cdn.bootcss.com/jquery/2.1.1-rc2/jquery.js
http://cdn.bootcss.com/jquery/2.1.1-rc2/jquery.min.js
http://cdn.bootcss.com/jquery/2.1.1-rc2/jquery.min.map
更多版本:http://open.bootcss.com/

XII. 360前端公共库 推荐指数★★★★

http://libs.useso.com/js/jquery/2.1.1-rc2/jquery.js
http://libs.useso.com/js/jquery/2.1.1-rc2/jquery.min.js
http://libs.useso.com/js/jquery/2.1.1-rc2/jquery.min.map
更多版本:http://libs.useso.com/
值得一提的是360还提供了和谐使用Google公共库&字体库的调用方法,可以使用它们的cdn缓存谷歌的资源

XIII. 点点网CDN 推荐指数★★

http://t.libdd.com/js/libs/jquery/jquery-1.7-latest.js
http://t.libdd.com/js/libs/jquery/jquery-1.6-latest.js
http://t.libdd.com/js/libs/jquery/jquery-1.5-latest.js
更多版本:http://doc.diandian.com/template/resource-hosting/

XIV. LimCDN(使用七牛云存储)推荐指数★★ 支持https,证书存在问题(已挂)

http://libs.limcdn.com/ajax/libs/jquery/1.2.3/jquery.js
更多版本:http://www.limcdn.com/

XV. MiniCDN

地址:http://www.minicdn.com/
使用了亚马逊(Amazon)和盛大云(GrandCloud)等多个CDN。


提示:

  • 如果你使用 CDN 服务,建议准备一个备胎,万一 CDN 服务挂了,可以从自己的服务器上读取

    		
    		
    		
    1. <script src="http://cdn.staticfile.org/jquery/2.1.0/jquery.min.js">
    2. <script>window.jQuery || document.write('<script src="/jquery.min.js">')</script>
  • 支持https的可以使用协议相对URL,防止https访问时浏览器安全提示。


js图片加载技术实例  js图片延迟加载,lazyload.js


<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.3.2.min.js"></script>
<SCRIPT src="https://cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js" type=text/javascript></SCRIPT>
<script type="text/javascript" charset="utf-8">
      $(function() {
          $("img").lazyload({ 
  placeholder : "http://ygtqgzs.42824.com/images/loading.gif",
                 effect: "fadeIn"
           });  
      });

</script>
<style>
img a,img{border:0px;}
div{ margin-bottom:10px;}
</style>
<div><a href="#"><img src="http://ygtqgzs.42824.com/images/loading.gif" data-original="images/1.jpg"></a></div>


jquery全部版本调用



(注!jquery-2.0以上版本不再支持IE 6/7/8) 并不是最新的版本就最好的,而是根据您项目需求所适合的版本!

百度引用地址 (推荐目前最稳定的,不会出现延时打不开情况) 

jquery-3.3.1(最新)

官网jquery压缩版引用地址:

jquery-3.3.1下载

jquery-3.2.1

官网jquery压缩版引用地址:

jquery-3.2.1下载

jquery-3.1.1

官网jquery压缩版引用地址:

jquery-3.1.1下载

jquery-3.0.0

官网jquery压缩版引用地址:

jquery-3.0.0下载

jquery-2.1.4

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-2.1.4下载

jquery-2.1.1

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-2.1.1下载

jquery-2.0.0

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-2.0.3下载 jquery-2.0.0下载

jquery-1.11.3

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-1.11.3下载

jquery-1.11.1

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-1.11.1下载

jquery-1.10.2

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-1.10.2下载

jquery-1.9.1

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-1.9.1下载

jquery-1.8.3

百度压缩版引用地址:

微软压缩版引用地址:

官网jquery压缩版引用地址:

jquery-1.8.3下载

jquery-1.7.2

百度压缩版引用地址: