CDN是Content Delivery Network(內容傳遞網路)的縮寫,運用機制將檔案複製到全球各地的區域性伺服器,當使用者需要內容時,可以依距離就近取得,縮短傳輸時間,提高系統運作的流暢性。近年來,JavaScript Library在網頁開發扮演的角色日益吃重,常常一個網頁中就要載入數十個js檔,且隨著JavaScript功能的豐富化,js檔也愈來愈肥,於是GoogleMicrosoft及一些廠商組織開始提供CDN式JavaScript來源。

對於網頁開發者而言,傳統做法是將要引用的js檔下載統一放在網站的特定目錄下(例如: /inc, /js, /Scripts...),現在則多了CDN的選擇,將網頁的<script>來源由../Scripts/jquery-1.7.2.min.js改成httq://ajax.aspnetcdn.com/ajax/jquery/jquery-1.7.2.min.js後,使用者便可透過CDN的大頻寬快速下載js檔,若使用者先前拜訪其他網站已從該CDN下載過同一js,還可直接使用Cache中的暫存副本,連下載動作都省起來。如此一方面能改善網頁載入速度,一方面還可以減少自家網站流量,省下頻寬費用,除了檔案在自家掌握之外的不確定風險(自家網站的妥善率通常不比Google/Microsoft CDN高,所以不用太擔心,但不適合需客製化或指定特定版本的場合),選用JavaScript Library CDN是不錯的策略。

以下是我開發ASP.NET AJAX專案時常用的CDN來源,整理成冊方便日後參考,順便分享同好: (若未特別註明,將.js改為.min.js就是瘦身壓縮版)

  1. jQuery
    http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.js 
  2. Knockout
    http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js 
  3. jQuery UI
    http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.1/jquery-ui.js
    CSS部分則各版本有別,可參考官方網站說明(jQuery UI Releases on the CDN那一段) ,例如: jQuery UI 1.10.1
  4. jQuery Validate
    http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js
  5. Unobtrusive jQuery Validate
    http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js
  6. Modernizr (使老舊瀏覽器相容HTML5及CSS3的套件)
    http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.0.6-development-only.js
  7. jQuery blockUI (非CDN,借用github)
    https://raw.github.com/malsup/blockui/master/jquery.blockUI.js
  8. Kendo UI
    每次Release時會有,但不會列在官方文件中,自己從Online Demo挖掘吧!
    例如: http://cdn.kendostatic.com/2012.1.515/js/kendo.all.min.js


還有好些熱門度不夠高的JavaScript Library,排不進Google及Microsoft的CDN菜單。CDNJSCloudFlare提供的佛心JS Hosting服務,補足了這一塊缺憾~~

  1. JSON2
    http://cdnjs.cloudflare.com/ajax/libs/json2/20110223/json2.js
  2. underscore.js (一堆工具函數的集合,補JavaScript內建函式庫的不足)
    官網: http://underscorejs.org/underscore-min.js
    或是CDNJS:
    http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js

以上就是我常用的JavaScript CDN私房清單,日後會再繼續更新補充。


Comments

# by 小黑

好酷

# by Truesun

Hi,你好 第一段CDN說明是否可以借我引用呢~會著名出處~謝謝 http://css-truesun.blogspot.tw/

# by Jeffrey

to Truesun, 歡迎引用~

# by Truesun

謝謝黑暗執行緒大~~

Post a comment


71 - 35 =