目录 - Table of Contents

请谨慎使用国内的CDN服务
近期爆出知名CDN服务商 Staticfile、BootCDN、BootCSS、polyfill 等已被黑产所控制,会随机给用户挂广告、劫持站点流量等恶劣行为,请诸位站长一定要小心。

前言

很久之前,本站的主机服务器发生问题,导致了下载速度只剩下10kb,一个页面得加载好几秒钟……
我通过Chrome控制台,检测到是一些JS库拖慢了整个网站的速度。
虽然那些JS库不过5~60k的大小,但当我这破站只有10k限速的时候,你就可以想象整个页面的加载得有多慢了……

没有办法,为了让前端网页的速度能够更快一点,我只能将网站所使用的部分JS库转移到网上的JS公共库CDN加速之上了。
等到转移完毕之后,首页的加载速度果然大幅改善,然而某些不能加速的比如图片、或是自定义的脚本依然会卡网页,不过确实解了当时的燃眉之急。

当然,此刻本站已经不存在加载的问题,但我仍推荐各位中小型网站的站长、个人博客的博主使用一些JS公共库的CDN加速服务。
那么这些CDN加速的服务商有哪些呢?我们又该如何取舍?

首先,我应该选择JS CDN服务吗?

如果你的服务器带宽充足、流量宽裕、延迟又低,那么我是不推荐你使用第三方的服务的!
毕竟第三方服务器并不归你,虽然几率极小,但若是某些服务器宕机,那么很有可能会影响你的网页呈现。
若是你不心疼自己的流量与带宽,一个几十、几百K的JS类库并不会显得有多累赘,更何况浏览器还有缓存效果。
最近甚至爆料出有黑产购买了CDN服务商,非法插入恶意JS代码,用作流量劫持、广告投放等操作。

JS公共库的好处有哪些?

其一,当然是节省流量,只要是稍微出名的CDN服务商,他们所拥有的服务器资源肯定比我等小站主要大得多,也不会在乎那一点儿的数据流量。
其二,降低延迟,在默认情况下,浏览器要等到js文件加载完毕之后,才会执行接下来的代码,解析后面的内容。若是你的网站延迟非常严重,就会降低整个页面的加载速度,而第三方的CDN服务商肯定比我们的网站速度要快,便可提高整个网站的加载速度。
其三,预加载与缓存,若是你的用户在浏览其它网站时就已经加载过相关的JS资源,那么当他浏览你的网站时,便可直接从浏览器缓存内提取数据,而不需要再从远程服务器下载数据了。

如何选择一个JS CDN的服务商?

目前可供选择的JS CDN服务有很多,然而却也是良莠不齐,某些服务商更有半途跑路的先例(说得就是你,360!),还有某些全球知名的CDN,但是国内却无法使用!(比如google...)
所以,选择一个好的CDN服务商十分重要,但也不能一棵树上吊死,谁也不知道这些服务商哪天就会停止服务,或者被qiang掉。

JQuery 版本该如何选择?

如果你的网站不需要兼容旧版本的IE,最好选择最新版的JQuery,否则需要考虑一下JQ的兼容性!
  • 1.4.2:稳定性和兼容性都很出色,插件最多,但性能不如后面的几个版本。
  • 1.7.2:性能提升,插件第二多,ajaxattrapi 有少许修改。
  • 1.8.3:最后一个支持 IE6 的稳定版
  • 1.9.1:开始移除了不少方法,事件绑定推荐使用 on 方法一个代替所有的。
  • 1.12.41.x 时代最后一个稳定版本,仅支持 IE8,不支持 IE6/7
  • 2.x 版本后就不再支持旧版本IE了!

如何同时支持 http 与 https 协议?

在http网页中可以直接调用https协议的JS库,但是在https网页中调用http协议的JS库会被浏览器标记不安全,甚至有可能被屏蔽!
如果您不确定目标用户会使用何种协议,可以省略URL的协议部分,仅使用 // 来声明JS库的位置,大部分浏览器都可以根据当前网站的协议来正确解析出目标位置!
示例: <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

使用SRI来防止CDN上游投毒

面对CDN上游投毒、修改JS库的行为,我们可以使用HTML5的 SRI(Subresource Integrity) 技术来对引用的资源进行哈希校验,当浏览器校验的JS代码与哈希值不匹配时就会拒绝加载。

一个免费的SRI在线校验站点 https://www.srihash.org/

比如应用 https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js 的 SHA384 哈希校验结果到一个JS引用标签:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js" integrity="sha384-SDFvKZaD/OapoAVqhWJM8vThqq+NQWczamziIoxiMYVNrVeUUrf2zhbsFvuHOrAh" crossorigin="anonymous"></script>
其中 integrity 属性就是哈希值,而 crossorigin 属性允许浏览器对跨域的资源进行校验(默认为不允许跨域)。

不建议使用的CDN

下方为已被证实有投毒行为,或者无法访问、服务不稳定的CDN服务商,请尽量避免使用!!!

BootCDN

注意:BootCDN 已被黑产控制,会随机给用户挂广告,已被各大广告拦截软件所屏蔽。
请尽快替换掉 bootcdn.cn 的CDN服务!!!

由Bootstrap中文网支持并维护,类库比较全,同步 cdnjs 仓库。
https://www.bootcdn.cn/
https://www.bootcss.com/

Staticfile CDN

注意:Staticfile 已被黑产控制,会随机给用户挂广告,已被各大广告拦截软件所屏蔽。
请尽快替换掉 staticfile.net 和 staticfile.org 的CDN服务!!!

由七牛云提供服务,同步 CDNJS 源站,同时也支持国内开源的部分类库。
https://www.staticfile.net/
https://www.staticfile.org/

cdnjs.net

https://cdnjs.net/

cdnjs.com 的镜像站。
该站点已提示停止服务,虽然仍可用,但请尽快转移!!!

BeeCDN

一个比较新的JS CDN加速服务,同时支持百度云、腾讯云、阿里云三大服务商。
因为比较新,所以没法判断是否足够稳定,请谨慎使用。
https://beecdn.com/

现在只是 cdnjs.com 的索引网站了,链接的是 cdnjs 官方的资源。

75CDN

一个由360前端团队“奇舞团”所维护的CDN服务,然而不知谁还记得曾经的useso……
360抛弃用户的果决相信大家都记得很清楚,也很难保证这个75CDN会不会在什么时候就与我们“不告而别”,请谨慎使用!
https://cdn.baomitu.com/

https认证过期了都没人管理,看来真的是被放弃了!!!

目前可用的国内CDN

国内CDN虽然速度快一点,但随着互联网时代红利一去不返,以及各种……原因,导致国内的免费CDN基本快死完了。
如果你胆子够大,还是可以尝试一下这些CDN服务的,但需要经常关注这些服务商的生存状况!!!

新浪SAE

新浪的服务稳定性自不必多说,只不过其支持的类库太少,而且也不再更新了。
如果你平常只用老版本的JQ(3.1以下),使用新浪算是最稳定、保守的选择了!
https://lib.sinaapp.com/

今日头条

今日头条发展迅猛,所以也推出了JS加速服务,所支持的类库还是挺丰富的。
然而其用户协议中写明:若是发现用户不符合法规,“当即剔除,终止服务,并上报 中国互联网举报中心”,所以你们都给我小心点!XD
https://cdn.bytedance.com/

百度

百度的速度自然不必多说,然而百度似乎早已经放弃了宣传与支持,其官方页面都已经关闭。
虽然加速服务并未停止,可为了安全起见,我并不推荐各位再使用百度的JS加速服务!
类库接口 https://github.com/Clouda-team/baiducdnstatic/tree/master/libs
调用方法 https://libs.baidu.com/jquery/2.1.4/jquery.min.js

又拍云

类库不全,更新慢,不推荐!
http://jscdn.upai.com/

知乎

unpkg 的镜像站。
https://unpkg.zhihu.com/

阿里云 npmmirror

npmjs 的镜像站。
https://npmmirror.com/

zstatic

一个又拍赞助的小站,站长亲自推荐你使用SRI增加安全性。
https://www.zstatic.net/docs/getting-started.html
https://srihash.zstatic.net/

webcache.cn

运营一年多的新站,不过挂的是CN域名,让人觉得不太稳。
https://www.webcache.cn/

7ED

一个新站,提供不少实用服务。
https://www.7ed.net/start/public-cdn.html

jsdmirror

一个 jsDelivr 的镜像站。
https://cdn.jsdmirror.com/

snrat

由评论区大佬提供,国内走白山云服务器,国外301到cdnjs官方。
https://cdnjs.snrat.com/

国内的CDN服务盘点完毕,下一页介绍国际版的JS CDN服务