很多移動開發者喜歡使用原生程式碼開發，但這種方式並不是一個銀彈，在需要快速以及低成本開發的時候Hybrid App（混合應用）就體現了它的優勢。

HTML5 移動UI框架(例如Ionic)讓你建立垮平臺Hybrid App與NativeAPP相似的效果，而使用的則是
HTM5, CSS and JavaScript。如果你已經是一個web開發者了那麼選擇hybird將是一個較好的開發方式。而且只需要編寫一套程式碼就可以在多個平臺中使用。通過Cordova(PhoneGap)提供的javascriptAPI可以訪問到照相機或感測器這類硬體裝置。最後再編譯成原生安裝包發到各應用商店。

目前市面上有需要移動端的UI框架可供選擇，接下來將介紹幾款其中的佼佼者。

Ionic

在近幾年，ionic成為了Hybrid App開發框架中的領軍者，並且ionic的開發小組繼續更新，並保持領先優勢。ionic一直保持免費和開源，而且它還擁有龐大的生態系統，可以在社群中找到大量的資源。

ionic添加了對android材料設計的支援，同時ionic也包括了angular。像其他流行的Hybrid App框架一樣，ionic也可以利用cordova來實現對原生硬體的呼叫。

ionic框架具有可維護性和可擴充套件性，使用了簡單清晰的標記，大量移動端特殊優化的css(Sass),HTML5 and JavaScript 元件。

優點：

• 基於Angularjs
• 預置的類原生元件
• 強大的社群

** 缺點：**

• 需要了解Angularjs
• 外掛更新較慢
• 動畫效能較弱

官方網站

Onsen UI

Onsen UI是相對較新的框架，但是卻給Ionic帶來了衝擊。Onsen採用Apache license開源協。Onsen UI 有通過angular的指令實現了大量的元件也提供基於jQuery的元件 。兩個框架很類似但是還是存在一些不同：

與 ionic 相比

• 兩個框架都依賴與angular指令，但Onsen UI支援jQuery。
• 兩個框架都支援Android 4+, iOS 6+，Onsen UI 支援Firefox OS和桌面瀏覽器。但ionic沒有官方的桌面瀏覽器支援，但還是可以用。
• 都支援分屏顯示技術
• 都是扁平是風格，但個人覺得Ionic更好看點。
• ionic支援SASS而Onsen UI 則是基於 Topcoat Css library。
• Onsen UI 文件較好，但ionic的社群較活躍。
• Onsen UI 有一個自己的IDE called Monaca IDE.

官方網站

jQuery Mobile

jQuery 依然在遊戲領域與其他移動端框架抗衡。jQuery Mobile 建立在jQuery和jQueryUI的基礎上。允許開發者建立webapp獲得與平板、pc上無差別的使用者體驗。因此它無法提供類似移動端原生控制元件外觀和體驗的app.

官方網站

Mobile Angular UI

這是為bootstrap和angular的粉絲而準備的。 通過 Mobile Angular UI ,可以通過bootstrap3和Angular 構建 移動應用。

Mobile Angular UI 提供指令可以構建移動端UI Component 例如 overlays, switches.sidebars,scrollable .

官方網站

結論

目前市面上最常用的幾款開源的移動端框架，總體上來均不錯，但如果是要追求最終app的視覺效果則Ionic與Onsen是較好的選擇，它們的UI看上去更像原生控制元件。如果你是jquery的粉絲，並且不想嘗試使用其他的那麼可以選擇jQuery Mobile 簡單高效。
如果你熟悉angular與bootstarp那麼Mobile Angular UI則是不錯的選擇。

除了開源的框架外還有一些企業級框架這些框架功能強大但需要相應的費用，比如Sencha Touch 與 Kendo UI 。

參考連結