四種常用HTML5移動應用框架

對于Mobile Web來說，現在是快速成長時代。由于采用了HTML5和CSS3技術，移動瀏覽器的性能加強了許多，同時，移動app的框架也擴展了，這意味著為移動設備創建豐富的互動的web體驗的可行性又提升了。

采用諸如PhoneGap這樣的封裝軟件，您就可以使用native app Store以及單個代碼庫，就可以分布式部署iPhone，iPad和Android等不同的目標平臺了。

對于Mobile Web的開發人員來說，切換框架代價很高：因為動畫的轉換，工具欄，按鈕，列表的顯示，以及線下存儲等都很麻煩。因為大部分上述功能都是新技術，以及這些領域的技術還在迅速地改變。作者玩轉了許多Mobile Web的框架并且對它們進行了分析比較，下面將為您講解他的研究發現。


jQTouch

jQTouch易用性強，相關文檔也很全面。它的特色是在 使用HTML,CSS和JavaScript創建iPhone App方面擁有出色的能力。jQTouch使用漸進增強的方案，在您相應的HTML頂層來實現像iPhone那樣的用戶體驗。它簡單易用，提供了一個基礎的小工具集以及動畫方案，開發人員只需要編程控制其動態行為即可。

不過在作者的簡單測試中發現app的性能存在一定的問題，頁面在轉換時可能出現跳轉或者缺失的情況，以及在響應tap事件的時候還有周期性延遲。該項目在技術上還活躍著，不過原作者的進展和部署都顯得太慢了。

只需要遵守MIT的license許可就可以使用jQTouch了，MIT lic是作者最喜歡的開源許可之一。

jQueryMobile

jQuery Mobile是這個領域的新丁，2010年8月才正式宣布成立，但是已經迅速進展到功能豐富的阿爾法2測試版本了。jQuery Mobile跟jQTouch相比很相似，但是更加標準，更有適應性，感覺很像jQTouch的后繼版本，對用戶接口和style的支持范圍更加寬廣了。

jQuery Mobile的性能是不穩定的，（雖然比jQTouch好一些）特別是在響應TAP事件的動畫延遲補償的時候。此外，還缺少一些關鍵的程序hook，所以不能輕松地讓app更加具有動態性能。例如：當一個頁面啟動的時候事件觸發了，這時候卻無法通知響應的代碼頁面將轉向哪個用戶接口，也不能傳遞附加的信息給處理模塊。針對上述問題，創建工作區來解決還是可行的，但是在這里作者希望其將來的版本能從jQTouch那里學習一下，并把現在的功能缺陷處理掉。

jQuery Mobile的相關文檔資料很零散但是有所改進，作者很希望它們能變得像核心jQuery庫那樣具有魯棒性。（請注意，jQuery Mobile是和jQuery UI相輔相成的，并不是建在單純jQuery之上的）

想獲得jQuery Mobile只需獲得MIT或者GPL2 license。

Sencha Touch

這是個與Ext JS框架完全不同的產物，其方案與jQTouch/jQuery完全不同：Sencha生成自己的DOM（基于用JavaScript創建的對象）代替了先前存在的HTML增強方式。如此，使用Sencha工作的感覺不像是web編程，而更像是使用Java或者Flex等技術來做app的樣子。比起jQuery來，Sencha的感覺更像是YUI。作者個人比較偏好漸進增強的方案，盡管其性能還真有些不盡人意的地方。

sencha跟其競爭對手們相比，擴展性強了很多：它擁有大量的用戶接口組件，直接的iPad支持，擁有JSON和HTML5線下存儲技術使得存儲和數據綁定更加方便。（使用Sencha的數據結構來操作app的數據十分酷~它可以實時響應列表的更新）此外，Sencha還是唯一在工具欄上支持內嵌的對象支持，其他方式都是滾輪列表的樣子。

在測試程序中，使用Sencha與jQTouch/jQuery相比，雖然app很明顯地不那么輕量級，但是其性能和可靠性方面明顯提高了，不過其初始化加載時間略慢。

當您使用庫library或者框架frame進行開發的時候，不遵守框架或者用你自己的方式通常都不會獲得成功。但Sencha的支持范圍足夠寬廣，這意味著您可以使用Sencha的開發方式來實現任何需求。作者最開始用的是WebKit的內嵌SQLite數據庫來做線下存儲，但是最終還是因為其復雜性和各種bug問題的煩惱而放棄了，轉而使用了Sencha數據存儲的功能。


在文檔方面，Sencha做的不太好，雖然很廣泛，但是又有很多舊版本的老漏洞沒有及時更新，作者就在這些框架中與bug作斗爭，調試過程浪費了很多時間，因為文檔不夠健全，很多問題難以追蹤或理解。而在開發者論壇響應作者提問的頻率還算較高，不過最終感覺還是不太夠。Sencha提供的付費技術支持起價是$300每年，作者很強烈地打算付費了，但是Sencha的回應是很好奇地打聽為啥這么急著給他們送錢，真搞不懂。

獲取Sencha需要遵守GPL3 license，以及在某種不是GPL標準又很相似LGPL的授權下也能用，以及遵循非商業license也可以獲得。

TitaniumMobile

與Sencha Touch很相似，Appcelerator公司的Titanium Mobile可以讓您使用Javascript API來編寫app。不過與Sencha不同的是，Titanium把你的代碼編譯成Native的iPhone或Android app，這意味著它并不是一個真正的Web框架，而是一個兼容層或者編譯器。（請注意Titanium Mobile的近親Titanium Desktop是一個基于web的，讓您可以使用HTML /js來編寫桌面封裝的本地應用的一款軟件）

這么說來Titanium允許web開發人員使用JavaScript和一點點XML之類的其他相關技術，可以實現高性能、更換皮膚很方便的Native App，而不需要額外去學習Objective-C或者Cocoa Touch等技術了。作者的簡單測試表明其性能不錯，吹散了框架方面的疑云，而且整合起來也不是太難。

不過這個優點也是其致命的缺點，您只能作出Titanium所支持的平臺上面的應用，你被它們的開發工具限制住了。作者想證明這一點只需要換一個不是iPhone的平臺上來跑一下就知道了。同時，Titanium的調試器也不怎么樣，不能使用XCode方式運行或者調試，就算在其仿真器上面程序跑的還算不錯，還是需要作者自己去實際機器上自己再找問題。


分析

在這4個框架上面挑選了3種并編造了自己的app來試一試，過程雖然很冗繁，但是收獲也頗豐。作者很喜歡jQTouch，但是不太相信它會在現有版本上再前進多少了。對于jQuery Mobile，很贊賞其簡單易用性以及其以web為中心的開發方法，不過它的缺點是缺少核心特色，跟Sencha比性能差很多。


用一個阿爾法2版本的產品來跟一個1.0版本的正式版相比或許有失公平，但是在用戶具有很強烈的剛性用戶需求時就必須做出選擇了，于是作者選擇了Sencha Touch。作者最初被其強大的性能和寬廣的支持程度所吸引，最終更喜歡其開發風格。隨著開發的深入，其文檔的漏洞讓作者十分沮喪，但是其廣泛的支持程度依舊吸引著作者，漸漸適應了其開發風格。如果他們愿意回復郵件的話，作者很有意向付費以獲取技術支持。不過現在，Pints的發布已經是一個基于Sencha的app了。


十個最火的HTML5框架


我們將介紹一些流行的HTML5框架，可能你也看到過其它的框架，但是你應該看看這些框架，因為你以前可能沒用過他們中的大部分，還等什么呢？喜歡就收藏吧


LimeJS

LimeJS是一款非常不錯的JavaScript 游戲開發框架。它針對所有的現代觸摸屏和臺式瀏覽器。它的目標，針對創造者，是非常簡單和清晰的：提供一個簡單的方法來創建良好的游戲體驗，而不需要考慮其內在的運作。

LimeJS基于Google開發的JS庫Closure，自帶了函數/類，可幫助開發人員控制時間軸、事件、形狀和動畫。


iio Engine

iio Engine是一款開源的創建HTML5應用的web框架。Iio Engine也是一款輕量級框架（只有35KB），整合了Debug系統,并且跨平臺支持。它不依賴于任何的第三方庫，而且集成了 Box2D。

Zoey

Zoey是使用最廣泛的HTML5-CSS3框架之一。Zoey非常輕便，而且自帶UI組件，如導航、列表、按鈕、控件分組、表格和網格等。Zoey兼容iOS和Android，并且附帶一個覆蓋所有功能的程序框架。

HTML5 Boilerplate

HTML5 Boilerplate是使用最廣泛的框架之一，在HTML5 Boilerplate的幫助下，你可以構建快速而且適應性強的Web程序。它的apache設置改善了網站性能，它可以獨立處理服務器配置，允許你從頭開始創建快速適應的網站。此外，它還是 一個響應式框架，可以滿足移動客戶的需求。

Jo
Jo是一款開源的HTML5移動應用框架，允許開發者創建基于iOS、webOS、Symbian和Android平臺的移動應用。此外，它是一款輕量級的框架，不依賴于任何插件，還兼容其它JavaScript框架。它也與PhoneGap兼容，使你可以創建原生或者Web應用。

Junior

Junior是一款非常受歡迎的、基于HTML5的前端框架。可以幫組開發者快速的創建類似原生應用風格的Web應用。Junior框架使用Zepto，并且整合了Backbone.JS。通過使用CSS3，Junior可以生成平滑的過渡效果，此外，Junior還支持多種UI控件。

Initlializr
Initlializr是一款基于HTML5 boilerplate的框架。Initlializr允許你創建一個干凈的自定義模板，使你可以自定義網站或程序外觀。此外，Initlializr還支持多語言。


Lungo.jS
Lungo.jS是首個自帶HTML5，CSS3和JavaScript功能的移動開發框架，可以幫助開發者創建基于iOS、Android、Blackberry和webOS平臺應用程序。Lungo.JS能夠利用移動設備的最新特性來實現包括單擊、滑動、長按等事件捕捉。


Cartagen
Cartagen是第一個利用HTML5的canvas元素實現的全面的動態網絡地圖框架。使用Cartagen中簡單的樣式表，你可以創建美觀、個性化的地圖。Cartagen采用矢量地圖和客戶端HTML5 框架來渲染地圖。

52 Framework
52 Framework是最流行的HTML5和CSS3的框架之一，允許你實現很多網站上面的功能，并且包含很多資源，如預編碼HTML5視頻播放器和HTML5表單驗證等等。它支持所有現代瀏覽器。

總結

以上是生活随笔為你收集整理的十个最火的HTML5框架与移动应用框架的比较的全部內容，希望文章能夠幫你解決所遇到的問題。

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