前端库--CDN节点

小咪咪 2022-12-25 12:56 90阅读 0赞

原文网址：[前端库--CDN节点\_IT利刃出鞘的博客-CSDN博客][--CDN_IT_-CSDN]

# 其他网址 #

[CDN公共库、前端开发常用插件一览表(VendorPluginLib) - sochishun - 博客园][CDN_VendorPluginLib_ - sochishun -]  
[常用 JavaScript 库 CDN 加速服务 | 小影志][JavaScript _ CDN _ _]  
[推荐13个常用前端公共库CDN服务资源 - 云+社区 - 腾讯云][13_CDN_ - _ -]

# 简介 #

**为什么使用前端CDN公共库**

> 使用前端CDN增加网页的并行载入速度，减少本地服务器的负担，节省流量。我们把静态资源放到自己的服务器上面固然好像安全可靠，不过我们不是每台服务器的速度都像cdn速度一样快；根据雅虎的性能建议，把静态资源放到不同的域名下还能加快加载速度(一个浏览器对与同一域名的并行下载的个数默认是2个， HTTP.1.0中规定的是4个。这样，我们可以使用不同的域名来提升下载的速度)。一般的js和css公用库我们都可以找到CDN资源。js放的位置由你决定，雅虎的建议是放在紧靠</body>前面(将脚本放在底部加载，即使请求时间较长，对页面的影响也很小。体验最佳)。

**使用**

> 前端CDN公共库调用方法和使用本地网站的资源一样，如：<script src="http://lib.sinaapp.com/js/jquery/3.1.0/jquery-3.1.0.min.js"></script>  
> 但是你也许会担心CDN某天会连不上，那你也可以在添加一个本地静态资源的调用：
> 
>     <script src="http://lib.sinaapp.com/js/jquery/3.1.0/jquery-3.1.0.min.js"></script>
>     <script type="text/javascript">
>         !window.jQuery && document.write('<script src="/static/js/jquery/3.1.0/jquery-3.1.0.min.js"><\/script>'); // 如果某天CDN不可用，就加载本地资源替代文件
>     </script>

# CDN大全 #

<table> 
 <tbody> 
  <tr> 
   <td style="width:188px;"><strong>CDN</strong></td> 
   <td style="width:63px;"><strong>是否可搜索</strong></td> 
   <td style="width:75px;"><strong>速度/稳定</strong></td> 
   <td style="width:110px;"><strong>齐全度</strong></td> 
   <td style="width:586px;"><strong>简介</strong></td> 
  </tr> 
  <tr> 
   <td colspan="5" style="width:188px;"><strong>国内</strong></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://www.bootcdn.cn/" title="bootcdn" rel="nofollow">bootcdn</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;">Bootstrap 中文网开源项目免费 CDN 加速服务。运营时间最长、用户量最大</td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="http://www.staticfile.org/" title="七牛云存储" rel="nofollow">七牛云存储</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://cdn.bytedance.com/" title="字节跳动静态资源公共库" rel="nofollow">字节跳动静态资源公共库</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="http://lib.sinaapp.com/" title="新浪云计算CDN公共库" rel="nofollow">新浪云计算CDN公共库</a></td> 
   <td style="width:63px;">×</td> 
   <td style="width:75px;">⍻</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://cdnjs.loli.net/ajax/libs/" title="cdnjs公益版" rel="nofollow">cdnjs公益版</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;">如果您使用 cdnjs.com 只需要替换 cdnjs.cloudflare.com 为 cdnjs.loli.net 即可</td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="http://cdnjs.net/" title="cdnjs山寨版" rel="nofollow">cdnjs山寨版</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">⍻</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://libs.qq.com/" title="腾讯网静态资源公共库" rel="nofollow">腾讯网静态资源公共库</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">×</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="http://jscdn.upai.com/" title="又拍云" rel="nofollow">又拍云</a></td> 
   <td style="width:63px;">×</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">×</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://cdn.baomitu.com/" title="奇舞团" rel="nofollow">奇舞团</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;">奇舞团的。比较小众</td> 
  </tr> 
  <tr> 
   <td colspan="5" style="width:188px;"><strong>国外</strong></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://cdnjs.com/" title="cdnjs" rel="nofollow">cdnjs</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">⍻</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
  <tr> 
   <td style="width:188px;"><a href="https://developers.google.com/speed/libraries/" title="谷歌" rel="nofollow">谷歌</a></td> 
   <td style="width:63px;">√</td> 
   <td style="width:75px;">√</td> 
   <td style="width:110px;">√</td> 
   <td style="width:586px;"></td> 
  </tr> 
 </tbody> 
</table>

**以下是已经不可用的cdn节点（不在上边列表中）**

> [百度静态资源公共库][Link 1]  
> [百度开放云平台CDN公共库][CDN]  
> [360网站卫士常用前端公共库CDN服务][360_CDN]

[--CDN_IT_-CSDN]: https://knife.blog.csdn.net/article/details/110457309
[CDN_VendorPluginLib_ - sochishun -]: https://www.cnblogs.com/sochishun/p/7071705.html
[JavaScript _ CDN _ _]: https://c7sky.com/category/javascript-libraries-cdn.html
[13_CDN_ - _ -]: https://cloud.tencent.com/developer/article/1355006
[Link 1]: http://cdn.code.baidu.com/
[CDN]: http://developer.baidu.com/wiki/index.php?title=docs/cplat/libs
[360_CDN]: http://libs.useso.com/