常用四種HTML5移動應(yīng)用框架的比較

2012-05-28 10:08:43來源:原文出處作者:范小虎翻譯

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

對于Mobile Web來說,現(xiàn)在是快速成長時代。由于采用了HTML5和CSS3技術(shù),移動瀏覽器的性能加強了許多,同時,移動app的框架也擴展了,這意味著為移動設(shè) 備創(chuàng)建豐富的互動的web體驗的可行性又提升了。采用諸如PhoneGap這樣的封裝軟件,您就可以使用native app Store以及單個代碼庫,就可以分布式部署iPhone,iPad和Android等不同的目標平臺了。

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

jQTouch

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

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

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

jQueryMobile

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

jQuery Mobile的性能是不穩(wěn)定的,(雖然比jQTouch好一些)特別是在響應(yīng)TAP事件的動畫延遲補償?shù)臅r候。此外,還缺少一些關(guān)鍵的程序hook,所以 不能輕松地讓app更加具有動態(tài)性能。例如:當一個頁面啟動的時候事件觸發(fā)了,這時候卻無法通知響應(yīng)的代碼頁面將轉(zhuǎn)向哪個用戶接口,也不能傳遞附加的信息 給處理模塊。針對上述問題,創(chuàng)建工作區(qū)來解決還是可行的,但是在這里作者希望其將來的版本能從jQTouch那里學(xué)習(xí)一下,并把現(xiàn)在的功能缺陷處理掉。

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

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

Sencha Touch

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

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

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

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

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

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

TitaniumMobile

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

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

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

分析

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

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

結(jié)論

作者還沒有回答最大的問題呢:一個基于web的app在沒有本地app的情況下能否hold住局面?如果可以的話,實現(xiàn)這樣的技術(shù)是否值得舍棄原來那種單一代碼庫方式所帶來的代價呢?

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

贊助商鏈接: