前端框架選擇

轉載自 http://www.cnblogs.com/xiaohuochai/p/7041595.html 

DOM

經常使用方案

• jQuery 
  jQuery是曾經風靡一時的最流行的前端解決方案，jquery特有的鏈式調用的方式簡化了JavaScript的複雜操做，並且令人們再也不須要關心兼容性，並提供了大量的實用方法

• zepto.JS 
  zepto是jQuery的精簡版，針對現代高級瀏覽器的javascript 工具庫，針對移動端設計，去除了大量jQuery的兼容代碼，提供了簡單的手勢，部分API的實現方式不一樣。 若是你會用 jQuery，那麼你就已經會用 Zepto 了。

• mootools 
  mootools源碼清晰易懂，嚴格遵循Command-Query(命令-查詢)的接口規範，沒有諸如jQuery的兩義性接口。還有一個不得不提的特色是，使用選擇器獲取的是DOM原生對象，而不是被包裝過的對象。而它支持的諸多方法則是經過直接擴展DOM原生對象實現的，這也是它的爭議所在

專業領域

• 手勢 : Hammer.JS 
  包括了常見手勢封裝（Tab、Hold、Transform、Swifp）並支持自定義擴展

• 局部滾動 : iscroll.JS 
  移動端position:fix + overflow:scroll的救星

• 高級動畫 : Velocity.JS 
  能夠複雜動畫序列實現，不只侷限於 DOM

• 視頻播放 : Video.JS 
  相似原生video標籤的使用方式，對低級瀏覽器使用flash播放器

---

通訊

經常使用方案

• jQuery

• Reqwest 
  用於瀏覽器異步HTTP請求。支持xmlHttpRequest, JSONP, CORS, JSONP，穩定性高，IE6+支持，Promise/A 和 CommonJS約束

• qwest 
  代碼少、支持XMLHttpRequest二、CORS 跨域、支持高級數據類型（ArrayBuffer、Blob、FormData）

專業領域

• socket.io 
  實時性高，支持二進制數據流，智能自動回退支持，且支持多種後端語言

---

工具包

• es5-shim 
  提供 ES3 環境下的 ES5 支持

• es6-shim 
  提供 ES5 環境下的 ES6 支持

• underscore 
  提供兼容IE6+的擴展功能函數

• Lodash 
  是underscore 的高性能版本，方法多爲 runtime 編譯出來的

• 響應式導航 : responsive-nav.js 
  一個很小的js插件，壓縮以後僅有1.7KB，能幫你建立針對小屏幕的可切換式導航

• stickUp.js 
  一個 jQuery插件，能讓頁面目標元素「固定」在瀏覽器窗口的頂部，即使頁面在滾動，目標元素仍然能出如今設定的位置。

• unslider.js 
  一個超小的（不到 3kb）jQuery輪播（slider） 插件。支持主流瀏覽器、鍵盤導航、自動調整高度和響應式佈局。

---

模板

• 基於字符串的模板(String-based) 
  dustjs、hogan.js、dot.js

• 基於DOM的模板(DOM-based) 
  AngularJS、vuejs、knockout

• 活動模板(Living Template) 
  RegularJS、RactiveJS、htmlbar

---

組件

• Bootstrap 
  封裝了經常使用的組件，是目前最火的組件解決方案，具備移動端first的流式柵格系統，由sass組織，可定製UI

• Foundation 
  在國內知名度不高，具備移動端first的流式柵格系統，由sass組織，可定製UI

• Flat UI 
  [Flat UI] 是基於 Bootstrap作的 Metro 化改造，由Designmodo提供。Flat UI包含了不少Bootstrap提供的組件，可是外觀更加漂亮。在此強烈推薦！

• bootstrap-switch 
  Bootstrap Switch是對Bootstrap控件的擴充。基於選 HTML中基本的選擇框控件實現只有開和關兩種狀態的單選按鈕。

• iCheck 
  基於 jQuery 或 Zepto， 讓不一樣瀏覽器下的複選框（ checkboxes和單選按鈕（radio button）更美觀、功能更強。

• bootstrap-wysiwyg 
  爲Bootstrap定製的微型(5kb)所見即所得（What you see is what you get）富文本編輯器

• chart.js 
  6種圖表類型，基於HTML5 canvas技術，支持全部現代瀏覽器，而且針對IE7/8提供了降級替代方案，不依賴任何外部工具庫，輕量級（壓縮以後僅有4.5k），而且提供了加載外部參數的方法

• messenger 
  很是酷的彈框組件，壓縮以後僅有 2.5kb，依賴於jQuery、underscore、backbone

• bootstrap-datetimepicker 
  日期時間選擇器，依賴於 bootstrap的下拉菜單組件 (dropdowns.less) 的某些樣式，還有bootstrap的sprites(sprites.less and associated images) 中的箭頭圖標。

• Headroom.js 
  爲頁面頂部多留些空間。在不須要頁頭時將其隱藏，例如向下滾動頁面時，隱藏頭部導航欄，向上滾動式再顯示出來

• Button 
  高度可定製的、免費而且開源的按鈕 CSS樣式庫，部分功能須要依賴 jquery，圖標字體須要依賴 font-awesome

---

路由

• page.JS 
  相似 Express.Router 的路由規則的前端路由庫

• Director.JS 
  能夠先後端使用同一套規則定義路由

• Stateman 
  處理深層複雜路由的獨立路優庫

• crossroad.JS 
  老牌路由庫，API功能較爲繁瑣

---

最後推薦一個框架選型網站 https://www.javascripting.com，該網站根據不一樣的需求的選擇，給出當下流行的框架選型