經常使用的 HTML5 移動應用開發框架比較

對於Mobile Web來講，如今是快速成長時代。因爲採用了HTML5和CSS3技術，移動瀏覽器的性能增強了許多，同時，移動app的框架也擴展了，這意味着爲移動設備建立豐富的互動的web體驗的可行性又提高了。採用諸如PhoneGap這樣的封裝軟件，您就可使用native app Store以及單個代碼庫，就能夠分佈式部署iPhone，iPad和Android等不一樣的目標平臺了。 

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

1.  jQTouch  

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

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

只須要遵照MIT的license許可就可使用jQTouch了，MIT lic是做者最喜歡的開源許可之一。 

2.  jQueryMobile  

jQuery Mobile是這個領域的新丁，2010年8月才正式宣佈成立，可是已經迅速進展到功能豐富的Alpha 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。 

3.  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也能夠得到。 

4.  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比性能差不少。 

用一個Alpha 2版本的產品來跟一個1.0版本的正式版相比或許有失公平，可是在用戶具備很強烈的剛性用戶需求時就必須作出選擇了，因而做者選擇了Sencha Touch。做者最初被其強大的性能和寬廣的支持程度所吸引，最終更喜歡其開發風格。隨着開發的深刻，其文檔的漏洞讓做者十分沮喪，可是其普遍的支持程度依舊吸引着做者，漸漸適應了其開發風格。若是他們願意回覆郵件的話，做者頗有意向付費以獲取技術支持。不過如今，Pints的發佈已是一個基於Sencha的app了。 

結論  

做者尚未回答最大的問題呢：一個基於web的app在沒有本地app的狀況下可否hold住局面？若是能夠的話，實現這樣的技術是否值得捨棄原來那種單一代碼庫方式所帶來的代價呢？ 

鑑於兩星期以來Pints的實際應用，做者傾向於說不。Pints在性能和bug方面陷入僵局，平均每隔10-15秒頁面就亂跳，在滾動頁面的時候容易亂跳，動畫效果也不是很連貫。