前端库--CDN节点

原创

IT利刃出鞘 2022-03-23 16:22:44 博主文章分类：项目(前端) ©著作权

文章标签 jquery javascript 静态资源加载 文章分类 代码人生

©著作权归作者所有：来自51CTO博客作者IT利刃出鞘的原创作品，请联系作者获取转载授权，否则将追究法律责任

简介

为什么使用前端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大全

CDN	是否可搜索	速度/稳定	齐全度	简介
国内
bootcdn	√	√	√	Bootstrap 中文网开源项目免费 CDN 加速服务。运营时间最长、用户量最大
七牛云存储	√	√	√
字节跳动静态资源公共库	√	√	√
新浪云计算CDN公共库	×	⍻	√
cdnjs公益版	√	√	√	如果您使用 cdnjs.com 只需要替换 cdnjs.cloudflare.com 为 cdnjs.loli.net 即可
cdnjs山寨版	√	⍻	√
腾讯网静态资源公共库	√	√	×
又拍云	×	√	×
奇舞团	√	√	√	奇舞团的。比较小众
国外
cdnjs	√	⍻	√
谷歌	√	√	√