應(yīng)用程序框架工具（臺(tái)式機(jī)，手機(jī)，平板電腦等）

前端應(yīng)用程序框架：【^1】

• AngularJS （例如：Angular 1.x.x）+ Batarang
• Angular （例如：Angular 2.0.0 +）+ angular-cli
• Aurelia + Aurelia CLI
• Ember + embercli + Ember Inspector
• Polymer
• React + create-react-app + React開發(fā)工具
• Vue.js + vue-cli & Vue.js devtools
• Riot

原生混合移動(dòng)WebView框架（例如：瀏覽器引擎驅(qū)動(dòng)）：

這些解決方案一般使用Cordova、 crosswalk、或自定義WebView作為使用原生接口的橋梁。

• ionic
• onsen.io

原生混合移動(dòng)開發(fā)Webview環(huán)境/平臺(tái)/工具 （例如：瀏覽器引擎驅(qū)動(dòng)）:

這些解決方案一般使用Cordova、 crosswalk、或自定義WebView作為使用原生接口的橋梁。

• Adobe PhoneGap [$]
• AppBuilder [$]
• cocoon.io [免費(fèi)$]
• ionic hub [免費(fèi)$]
• kony [$]
• Monaca [$]
• Taco

原生桌面WebView應(yīng)用程序框架:（例如：瀏覽器引擎驅(qū)動(dòng)）:

• Electron
• NW.js

各種平臺(tái)應(yīng)用程序框架：

這些解決方案可以讓您在多個(gè)平臺(tái)和設(shè)備上構(gòu)建應(yīng)用程序。

• manifoldJS

原生移動(dòng)應(yīng)用程序框架（又叫做原生JavaScript應(yīng)用程序）

這些解決方案在運(yùn)行時(shí)使用JS引擎解析JS并連接到原生接口。沒(méi)有使用瀏覽器引擎和WebView。 UI由本機(jī)UI組件構(gòu)成。

• NativeScript
• React Native
• tabris.js [免費(fèi)$]
• trigger.io [$]
• weex

參考：

• todomvc.com
• Frontend Guidelines Questionnaire
• Frontend Guidelines

性能：

• js-framework-benchmark

注意：

2017年基于UI應(yīng)用程序構(gòu)建組件時(shí)需要注意inferno、Svelte、 和NX。

建議：

[^1] 如果你是前端/JavaScript應(yīng)用程序開發(fā)的新手，建議從Riot 或 Vue.js開始著手。其次學(xué)習(xí)React。然后Angular 2、 Ember、或者 Aurelia。

如果你開發(fā)的是一個(gè)數(shù)據(jù)交互少的小型網(wǎng)站（基本上是一個(gè)靜態(tài)頁(yè)面），這時(shí)不需要使用前端框架。許多工作可以使用任務(wù)運(yùn)行工具如Gulp 和 jQuery來(lái)替代，同時(shí)可以避免不必要的學(xué)習(xí)和使用復(fù)雜的應(yīng)用程序框架工具。

想要比React更小的框架，可以考慮下Preact。Preact是對(duì)React重構(gòu)核心的議案（類似像Mithril的庫(kù)）， 使用盡可能少的代碼，并對(duì)ES2015提供一流的支持。目前庫(kù)的大小是3kb左右（壓縮和打包之后）。

無(wú)法決定使用React還是Angluar 2時(shí)，請(qǐng)閱讀，"Angular 2 vs React：終極對(duì)決"。

調(diào)查結(jié)果：

下面圖片的來(lái)自 2016前端工具調(diào)查 (4715名開發(fā)者) 和 2016年JS調(diào)查狀況（9307名開發(fā)者）

圖片來(lái)源：https://ashleynolan.co.uk/blog/frontend-tooling-survey-2016-results

圖片來(lái)源： http://stateofjs.com/

圖片來(lái)源：http://stateofjs.com/