移動Web開發13個重要的開發工具
隨著這種需求的日益增長，越來越多的開發者開始關注移動開發工具和開發庫的開發了，他們試圖幫助移動開發者掃平實現夢想的障礙。
雖然這套工具的開發目前尚不成熟，但是HTML5的出現讓大家看到了移動Web開發的光明前景，它讓用戶擺脫了對native軟件的依賴。
首先，web是完全開放的，它不用受到App Store的協議限制。
其次，程序開發人員能夠獲得100%的收益。當然，這也意味著必須找到一種新的獲得收益的方式，這一點并不簡單。但是，一旦找到了合適的方法，程序員就不用再將自己30%的收益拱手讓給Apple了。
第三，HTML5變得越來越強大了，功能也變得更加豐富了。最新的HTML5版本已經能夠支持客戶端在本地保存數據了，目前基本能夠替代native app的功能。換句話說，瀏覽器已經基本能夠取代native apps的地位了。
第四點，HTML5 apps不與具體設備綁定。雖然目前大部分的宣傳還是圍繞著Apple的iPhone，但是HTML5 apps是比較容易遷移到其他平臺上的。雖然可能還沒簡單到按下一個按鈕就完成平臺的遷移，但是起碼和Objective C轉換為Java的工作比起來，還是簡單許多的。
當然，HTML5也不是萬能的。Web apps最大的缺陷就是對網絡連接的依賴。它確實不如native apps響應及時，而native app的開發者常常在討論微秒級的延遲是否會影響用戶的體驗。游戲開發者在使用JavaScript編程前需要再三權衡一下。
目前最大的限制可能就是工具本身的開發。Apple的開發工具能夠看到native apps的結構，而移動瀏覽器卻很難深入了解上面運行的應用程序的代碼結構。現在已經有一些開發工具和開發庫來幫助程序員簡化web開發的難度。下面介紹一些移動web開發中著名的相關項目。
移動web開發工具：ChocolateChip-UI（下載）
由于移動設備上的屏幕通常都比較小，因此為移動設備設計一個有效的UI顯得尤為重要。Enter Robert Biggs是一個來自Northern California的Web程序員，他開發的ChocolateChip-UI成為使用HTML開發移動界面的優秀示例。
開發中使用的WAML（Web Application Markup Language）是基于HTML5封裝的編程語言。使用WAML提供的標簽（如<slider>或是<stack>）能夠極大地簡化開發者的工作。可以在JavaScript中使用WAML并在支持HTML5的智能手機上運行。
程序員可以將HTML、CSS、JavaScript和WAML組合起來，只需指定好ChocolateChip-UI的翻譯進程即可。
雖然這種做法并不完美，但這已經足夠好用了。我之前曾用過其他的移動開發工具，他們都不能很好地封裝在JavaScript中。
ChocolateChip-UI已經基本將所有的WAML提供的組件都封裝好了，效果幾乎與標準的iPhone UI相當。它甚至還包括了一個額外的刪除列表，用戶通過點擊鼠標就能將組件從UI上刪除。
移動Web開發工具：Mobl（下載）
JavaScript使用起來不算太簡單，而Mobl就是用來簡化JavaScript的開發的。Mobl是專門用于Webkit瀏覽器上應用開發的框架。它不使用HTML、JavaScript或是CSS編寫程序，而是直接使用Mobl編程，然后通過Mobl編譯器將它轉換為適合在移動瀏覽器上運行的HTML、JavaScript和CSS語言。
Mobl開發者使用這種方法彌補了JavaScript的不足。例如，它解決了延遲執行的函數傳遞問題；跟蹤括號的配對問題（程序員對JavaScript的這一缺陷常常感到頭痛，并且容易導致錯誤產生）。
Mobl通過使用大量的申明降低了程序的復雜度。如果你想傳遞1,000毫秒，你可以寫：
sleep(1000); doNext();
Mobl將這條語句翻譯成JavaScript，通過setTime函數執行時間傳遞，通過回調函數執行doNext（）語句。程序員無需考慮回調函數的語法以及函數的封裝方法，只要將希望發生的事情列舉出來就可以了。
Mobl提供了幾十種方法幫助程序員編寫指令，并且不需要考慮這些指令是如何轉換成JavaScript的。如果你想要編寫一個下拉菜單，這很簡單，只需要將菜單中的選項用關鍵字表示出即可。
對于已經熟悉了Objective-C或是JavaScript的程序員來說，可能覺得Mobl沒有太大意義。畢竟，他們能夠用自己熟悉的語言編寫很好的程序，又何必去學習一種新的語言來完成同樣的工作呢？但是，對于編程語言的熱愛者來說，他們能在Mobl上發現許多好的、有意思的想法，而Mobl確實可以簡化他們的開發工作。
移動開發工具：jQuery mobile（下載）
51CTO專題報道：jQuery Mobile基礎入門教程
基于jQuery框架開發一個移動平臺并為智能手機開發一個簡單的UI工具顯然是迎合大眾需要的。這個項目得到許多主流硬件廠商的支持，也一定能夠在移動設備上取得成功。
jQuery Mobile中最簡單的部件是HTML-center布局部件。它使用DIVs和其他標準的HTML部件（如<LI>標簽）來構建頁面。jQuery Mobile通常只需要開發者添加幾個新的主題或是皮膚，它就能夠非常方便地處理動態網頁和CMSes了。
使用jQuery意味著，大部分桌面網站上可用的插件在移動網站上也是可用的。也有一些專門為移動網站開發的插件。jQuery Mobile擁有輕量級架構和豐富的資源組件，不難看出它將在未來的移動開發中占據重要地位。
移動開發工具：The-M-Project（下載）
如果說jQuery Mobile無法精確地處理網頁中的方法和風格的話，那么The-M-Project則為開發者提供了一組經jQuery Mobile對象封裝的部件。使用它能夠更好地控制網頁的設計細節，例如可以在某個合適的地方添加一個圖標，而不僅僅是添加一張大的圖片。
代碼采用Model-View-Controller模式。開發者創建一個大的JSON結構，在上面定義各個不同的頁面以及頁面上用到的各種組件。使用The-M-Project處理頁面的布局信息。
在每個頁面的事件鉤子上定義一組功能函數，用來實現應用程序的功能。The-M-Project維護事件與頁面相應位置的對應關系。
工具可以直接使用Node.js，代碼可以在Node.js中運行，甚至可以在相同的服務器上完成測試。開發出來的應用可以在任何Web服務器上運行，也可以進一步將它整合到Node.js中。
移動開發工具：Touchqode（下載）
假設你正坐在巴黎的一家咖啡館，或是在珠穆朗瑪峰的峰頂，你手頭上沒有臺式電腦或是筆記本，如果此時你的腦海中浮現出一個很妙的想法，你是不是只能找張紙粗略地描述一下你的想法，然后等到合適的時候再實現這個想法呢？如果此時你的Android手機上正好安裝了Touchqode，那么你大可不必這么麻煩了。
這個小小的開發工具包含的功能豐富得驚人：代碼可以高亮顯示，可以在本地運行腳本，甚至可以通過FTP同步新加的代碼。如果你的老板在你旅行的途中讓你修改一下代碼，有了Touchqode，這并不會給你帶來多大的麻煩。我無法想象怎樣使用我的Android手機編寫很長的代碼程序，但是已經有作者使用手機完成整部小說的創作了，所以，不要低估Touchqode在手機編程領域的作用。
不管怎么說，Touchqode在緊要關頭還是非常派得上用場的。
移動開發工具：LimeJS（下載）
Flash游戲之所以如此引人關注，一個重要的原因就是它有非常豐富的flash庫。Flash庫的開發者將他們的工作出售給Flash開發者，從而獲取收益。同樣的，DigitalFruit開發出了LimeJS，并將它出售給想使用WebGL對象的開發人員。
LimeJS的早期版本在Webkit瀏覽器上還是非常好用的。代碼使用的是JavaScript，但結構看起來更像是C語言，它調用了OpenGL的庫。一些OpenGL庫和LimeJS可以自動完成交叉編譯，但通常還是需要手動調整部分內容。
LimeJS提供了一些簡化游戲開發的功能。它提供了一些場景和一個靈活的事件管理機制。它還附帶有一些動畫和效果轉換機制。所有這些功能都是游戲開發人員經常使用的功能。
開發環境的基本架構使用的是Python，最后的開發包與Google的Closure Compiler綁定，下載速度相當不錯。
對于那些使用OpenGL開發游戲應用的程序員來說，LimeJS還是非常有吸引力的。雖然它使用的是JavaScript，但是它并沒有用到JavaScript中復雜的編程思想。
移動開發工具：Jdrop（下載）
表明上看，Jdrop似乎是由一堆JSON組成的，它常被誤解為一個開源的NoSQL數據庫。事實上，Jdrop是用來幫助程序員處理臺式機和移動設備上屏幕顯示差異的開發工具。
為了簡化從移動設備上提取性能反饋的復雜性，Jdrop為開發者提供了Mobile Perf組件，它是一個累積性能的標簽，其中包括Firebug Lite, Page Resources, DOM Monster, SpriteMe, CSSess, 和Zoompf。程序員可以使用Jdrop直接在手機上調試程序，并能夠自動將結果上傳到Jdrop云上，方便開發者在臺式機上對運行的數據結果進行進一步的分析。它還能用來調試真實移動設備上的性能并檢查移動網站的源碼。
大部分框架所做的主要工作就是將一個應用程序轉換成一個很炫的網頁，通常它們需要使用自己特定的編程語言。而XUI和Zepto則與這些框架不同。它直接使用HTML和CSS，這已經使得它能夠顯示開發者想要呈現的各種效果了，而它只是為開發者提供了創建和修改DOM的方法。
這些庫并不會重新組合各種部件或是創建任何新的部件。它只提供HTML里面有的部件，開發者可用使用CSS來控制這些部件。這些庫為開發者提供了處理DOM的各種方法，如尋找組件、添加類或是豐富事件等等。
這兩個庫最大的優勢就是節省空間。Zepto目前的版本只占2,300個字節，僅是jQuery的十分之一。而XUI則稍微大一點。與jQuery對比是合適的，因為它們提供的功能是相當的。例如，XUI不能在BlackBerry或是IE mobile上兼容。如果你想讓它在這些設備上兼容，那么你需要一個更加大的庫。
移動Web開發工具：Jo（下載）和Sencha Touch（下載）
51CTO專題報道： Sencha Touch基礎入門教程
Jo和Sencha是兩組部件集合，適用于使用JavaScript開發的移動設備。通過JavaScript定義的結構可以調用這兩個庫的函數，使得屏幕上顯示的頁面更加美觀。這些代碼中通常包含比較復雜的功能調用和函數嵌套。
Sencha Touch是由Sencha公司開發的，Sencha公司專門為通用Web頁面開發提供設計框架。它也出售支撐方案，但是并不對Sencha Touch收取版權費。該公司的研發團隊會解決開發者的疑問，并且還提供了一個開放的技術支持論壇。
Jo是一個取得了OpenBSD授權的開源項目。開發者可以免費使用它，而它的開發者Dave Balmer還為用戶提供各種幫助。
我已經使用Sencha Touch開發了幾個Web Apps了，我發現這個工具使用起來相當方便，因為它很好地處理了許多常見的布局問題。我曾經自己創建了一個新的組件，而Touch框架很好地將這個新組件放置到了頁面中合適的位置上。這些apps能夠很好地在iPad和iPhone上運行，盡管二者的屏幕尺寸相差較大。
Jo和Sencha Touch目前的介紹文檔還不完善。目前這方面的工作也正在逐步跟進。Sencha的商業版本有更加全面的介紹文檔。
移動Web開發工具：jQTouch（下載）
jQTouch是移動Web開發的最好框架之一。雖然他的開發者David Kaneda已經離開了這個項目轉而投入Sencha，但Jonathan Stark接手了jQTouch的相關工作，并且對代碼進行了優化和補充。
jQTouch開發的Apps是在DIVs中加入HTML。jQuery為DIVs選擇合適的類，并加入事件處理代碼。
我嘗試用jQTouch開發了幾個Web Apps，整體感覺jQTouch使用起來還是非常方便的。它可以很方便地與其他Web工具以及服務器端的框架整合在一起。
有些時候，使用jQTouch的代碼可以達到native apps的效果。但是它還存在一些奇怪的問題，并且會處理一些沒有意義的轉換工作，在某些設備上的觸摸事件響應速度也不夠理想。
移動Web開發工具：PhoneGap（下載）
51CTO專題報道： 跨平臺移動web中間件PhoneGap開發入門
另一個使用廣泛的開源移動框架就是PhoneGap，PhoneGap可以讓開發者在智能手機上使用HTML、JavaScript和CSS編寫各種native app。許多使用JavaScript編寫的apps最后都要與PhoneGap綁定，然后通過App Store推向用戶。
這個框架讓開發者對HTML有了新的了解。在iOS上，它被稱為UIWebView，而在其他的主流智能手機上也有類似的部件。它的目標就是使得HTML、JavaScript和CSS能夠在所有的主流平臺（如Android、iOS、BlackBerry和WebOS）上運行。
通過使用PhoneGap的幾次編程經歷看來，PhoneGap的使用方法通常是比較類似的。將一個Web App轉變為一個能夠在iPhone和Android上運行的native app，只需花費不到一個小時的時間。PhoneGap能夠幫助開發者完成窗口的建立工作。
但是PhoneGap的解決方案不算完美。用戶還是能夠發現使用同一套HTML和CSS代碼構建的應用，在Android和iPhone上的顯示仍存在許多細微的差別，盡管Android和iPhone都支持同一套Webkit內核。雖然沒有在BlackBerry和WebOS做類似的測試，但是不難想象，這兩個設備顯示的內容應該也有不少的差異。話雖如此，但是PhoneGap確實能夠幫助開發者開發出更加通用，性能更好地Web App。
