構建混合式移動應用的流行框架
什麼是混合移動應用程序?
混合應用程序只是一個普通的移動優化的網站，用CSS，HTML和JavaScript編寫，在webview上顯示（它基本上是一個精簡的Web瀏覽器）。這樣做的好處是，只需要寫一個應用程序，在大多數情況下，不用修改就可以在 Android，iOS 和 Windows Phone 上運行。本文列出的大多數框架都是用Cordova 或 PhoneGap 實現的，它們架起了由 JavaScript 通往設備 API 的橋樑。
本文將對用於構建混合和原生移動應用程序的最流行的 JavaScript 框架進行比較。
1. Ionic
Ionic
Ionic在我們列出來的這些框架裏面是最流行的，可能對很多開發者來說是首選。你可以用框架中的CSS 實現有 native 風格的設計，不過相對於使用完整的 Ionic，更建議搭配 AngularJS 一起開發。使用 Ionic 的一大好處是命令行的交互界面，有很多迷人的功能，包括集成的仿真器金額基於Cordova 的 app 打包器。
正面:
預置的組件
強大的社區
命令行交行界面，有着很多有用的功能
負面:
複雜的開發需要了解AngularJS
2. Onsen UI
Onsen UI
這是一個開源的框架，可以通過組合 native 風格的組件來開發 app。它用起來非常簡單，可以用AngularJS 一起開發，也可以不用。有着完善的文檔，包含了大量例子和佈局，覆蓋了最常見的 app 類型。Onsen UI 的一個不足是目前只發布了一個 iOS 主題，不過下一個版本承諾會推出 Material Design（谷歌推出的一種設計風格）的支持。
正面:
預置的組件
優秀的文檔，包含大量例子
負面:
未包含PhoneGap/Cordova工具，不過可以支持
暫不支持Material Design風格
3. Framework 7
Framework 7
Framework 7比較酷的地方在於它完全是框架無關的(沒有像Angular或者React那樣的外部依賴)，但是確依然可以讓app在組件和動畫方面有着native的風格和體驗。開發者只需要會HTML, CSS和JavaScript就可以開發應用，而不用把代碼搞得很複雜。Framework 7並不包含任何用於仿真或者打包的工具，，所以你需要將其與Cordova或者PhoneGap一起使用。
正面:
簡單易用，只依賴HTML, CSS和JavaScript
性能不錯
可以和任意JavaScript框架結合使用
負面:
未包含PhoneGap/Cordova工具，不過可以支持
4. React Native
React Native
正如項目的名稱表露的那樣，React Native的目的是構建真正native的應用。而不是構建在Webview裏運行的混合模式的應用。開發完全由JavaScript和React來完成。這個框架不太適合web開發的新手，不過其背後有一個龐大的社區，在各個方面都可以爲你提供支持。最近這個框架還發布了Android版，這樣你就可以真正實現跨平臺的應用開發了。
正面:
Native級別的性能
龐大的社區支持
負面:
陡峭的學習曲線
目前開發工具只支持OS X
5. jQuery Mobile
jQuery Mobile
它是所有移動框架的爺爺， jQuery Mobile 的目的不是讓 apps 的外觀像 Android 或 iOS。而是爲了幫助開發可以在所有移動瀏覽器（包括老舊的 Windows Phone，Blackberry 和 Symbian）上良好運行的 web apps。因此，它是非常輕量級的，只依賴 jQuery，很容易學會，同時還提供了良好的觸摸識別和對 PhoneGap/Cordova 的支持。
優點:
支持廣泛的移動瀏覽器
簡單易用
缺點:
樣式陳舊，既不像 iOS 也不像 Android
不包含 PhoneGap/Cordova builder，但支持
6. Native Script
NativeScript
Native script 的最大特點是，用 TypeScript 語言編寫 app 的功能，只需要編寫一次，然後它可以針對不同的操作系統（包括 Android，iOS 和 Windows Phone）產生對應的可執行代碼，打包後，應用是按原生程序的方式運行的，並沒有打開和運行瀏覽器。使用該框架確實需要一些編程技巧，但它詳盡深入的文檔彌補了這方面的不足。
優點:
“編寫一次，到處使用” 的方式
強大的文檔
Cons:
陡峭的學習曲線
較小的社區
7. Famous
Famous
Famous切入web和移動開發的方式有點與衆不同。它使用WebGL把你的HTML的DOM樹組合在一起，把所有的內容在一個canvas裏顯示，有點類似HTML遊戲引擎做的那樣。這種獨特的技術可以讓框架在60 fps的速度下運行app，這已經和大部分native的app一樣流暢了。可惜的是，這個項目現在不再活躍了，也沒有合適的文檔可供參考。
正面:
Native的性能
反面:
開發基本停滯
文檔不全
社區不健全
彙總數據
| 框架 | Native體驗 | 依賴 | 社區 | 文檔 | 工具 |
|---|---|---|---|---|---|
| Ionic | 7/10 | AngularJS (可選) | 9/10 | 8/10 | 強大的 CLI, Ionic SDK |
| Onsen UI | 6/10 | AngularJS (可選) | 4/10 | 9/10 | Monaca Cloud IDE (有免費方案) |
| Framework 7 | 8/10 | 只需HTML, CSS 和JS | 6/10 | 8/10 | 無 |
| React Native | 8/10 | React | 8/10 | 5/10 | Chrom的擴展工具React Developer Tools |
| jQuery Mobile | 3/10 | jQuery | 8/10 | 5/10 | 無 |
| Native Script | 8/10 | TypeScript | 5/10 | 9/10 | 免費的 CLI, 其他的付費可選 |
| Famous | 7/10 | WebGL, AngularJS | 3/10 | 5/10 | 無 |
總結
沒有真正完美的框架 – 每個都有自己的優點和缺點，用哪個取決於你要用他們幹什麼。