幾種常用HTML5移動應用框架的比較
英文原文:Comparing HTML5 Mobile Web Framework
對于 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 是作者最喜歡的開源許可之一。
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
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 也可以獲得。
Titanium Mobile
與 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 了。
結論
作者還沒有回答最大的問題呢:一個基于 web 的 app 在沒有本地 app 的情況下能否 hold 住局面?如果可以的話,實現這樣的技術是否值得舍棄原來那種單一代碼庫方式所帶來的代價呢?
鑒于兩星期以來 Pints 的實際應用,作者傾向于說不。Pints 在性能和 bug 方面陷入僵局,平均每隔 10-15秒頁面就亂跳,在滾動頁面的時候容易亂跳,動畫效果也不是很連貫。