幾款開源的Hybrid移動app框架分析

Ionic
Onsen UI

與 ionic 相比

jQuery Mobile
Mobile Angular UI
結論

很多移動開發者喜歡使用原生代碼開發，但這種方式并不是一個銀彈，在需要快速以及低成本開發的時候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 。

---

參考鏈接

[01] http://noeticforce.com/best-hybrid-mobile-app-ui-frameworks-html5-js-css

總結

以上是生活随笔為你收集整理的几款开源的hybird移动app框架分析的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。