jQuery是前端開發(fā)最常見也是最流行的javascript庫(kù),如何去加載它才能使我們的項(xiàng)目性能更好以及問什么要用CDN?當(dāng)用戶訪問自己的站點(diǎn)時(shí)從服務(wù)器加載文件,每個(gè)服務(wù)器同時(shí)只能下載2-4個(gè)文件,這樣就會(huì)降低文件的執(zhí)行效率,如果多用幾個(gè)服務(wù)器,這樣同時(shí)加載文件的個(gè)數(shù)就是(2-4)*服務(wù)器個(gè)數(shù),所以我們把jQuery放到CDN上就是為了提高網(wǎng)站加載文件的效率。下面就講講常用的jQuery的CDN
CDN介紹:
百度百科上是這樣介紹的:
CDN的全稱是Content Delivery Network,即內(nèi)容分發(fā)網(wǎng)絡(luò)。其基本思路是盡可能避開互聯(lián)網(wǎng)上有可能影響數(shù)據(jù)傳輸速度和穩(wěn)定性的瓶頸和環(huán)節(jié),使內(nèi)容傳輸?shù)母臁⒏€(wěn)定。通過在網(wǎng)絡(luò)各處放置節(jié)點(diǎn)服務(wù)器所構(gòu)成的在現(xiàn)有的互聯(lián)網(wǎng)基礎(chǔ)之上的一層智能虛擬網(wǎng)絡(luò),CDN系統(tǒng)能夠?qū)崟r(shí)地根據(jù)網(wǎng)絡(luò)流量和各節(jié)點(diǎn)的連接、負(fù)載狀況以及到用戶的距離和響應(yīng)時(shí)間等綜合信息將用戶的請(qǐng)求重新導(dǎo)向離用戶最近的服務(wù)節(jié)點(diǎn)上。其目的是使用戶可就近取得所需內(nèi)容,解決 Internet網(wǎng)絡(luò)擁擠的狀況,提高用戶訪問網(wǎng)站的響應(yīng)速度。
優(yōu)勢(shì):
1.不用擔(dān)心自己網(wǎng)站訪客,在任何時(shí)間,任何地點(diǎn),任何網(wǎng)絡(luò)運(yùn)營(yíng)商,都能快速打開網(wǎng)站。
2.各種服務(wù)器虛擬主機(jī)帶寬等采購(gòu)成本,包括后期運(yùn)維成本都會(huì)大大減少。
3.給網(wǎng)站直接帶來的好處就是:流量,咨詢量,客戶量,成單量,都會(huì)得到大幅度提升。
國(guó)外的CDN:
1.Google Hosted Libraries
src=”http://ajax.useso.com/ajax/libs/jquery/2.1.1/jquery.min.js”
2.Microsoft CDN
src=”http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.0.min.js”
3.CDNJS
src=”http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js”
4.jQuery官網(wǎng)
src=”http://code.jquery.com/jquery-1.11.0.min.js”
5.jsDeliver
src=”http://cdn.jsdelivr.net/jquery/2.0.0/jquery-2.0.0.min.js”
從圖中可以看出國(guó)外的CDN最快的是CDNjs
國(guó)內(nèi)的CDN:
1.百度
src=”http://libs.baidu.com/jquery/2.0.0/jquery.min.js”
2.七牛
src=”http://cdn.staticfile.org/jquery/2.0.0/jquery.min.js”
3.新浪
src=”http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js”
4.又拍云
src=”http://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.0.min.js”
5.360
src=”http://libs.useso.com/js/jquery/2.0.0/jquery.min.js”
從圖中可以看出國(guó)內(nèi)最快的是七牛
總結(jié):
除國(guó)外的谷歌和CDNJS的服務(wù)外,國(guó)內(nèi)的庫(kù)均不支持HTTPS環(huán)境,可惜的是國(guó)內(nèi)用戶加載起來比較慢,如果把自己網(wǎng)站架設(shè)在國(guó)外可以優(yōu)先考慮使用。如果CDN加載失敗時(shí),我們需要加載自己本地的jQuery文件,只需要在頭部加上下面的代碼就可以
1 <script type=”text/javascript” src=”//ajax.useso.com/ajax/libs/jquery/1.11.1/jquery.min.js”></script>
2 <script>window.jQuery || document.write(‘<script src=”js/jquery-1.11.1.min.js” type=”text/javascript”><//script>’)</script>
上面的速度測(cè)試是在本地的,與網(wǎng)路和帶寬等有很大的關(guān)系,最好在自己的環(huán)境下重新測(cè)試這幾個(gè)CDN,如果你還有其他CDN可以@me,希望此文能夠幫助你。