三大移動Web開發框架哪個適合你?
譯文【51CTO獨家譯文】經常瀏覽Developer.com的讀者也許注意到了這點:我最近特別關注JavaScript驅動的移動應用開發解決方案,先后撰文介紹了眾多的相關話題,包括jQuery Mobile、jQTouch、Sencha Touch和PhoneGap。我得承認,要搞清楚這一批前沿技術并非易事,于是我這回概述一下這些主要的移動開發解決方案的主要特性和優點(51CTO注:PhoneGap未作介紹,欲了解更多PhoneGap內容請移步51CTO專題:跨平臺移動web中間件PhoneGap開發入門)。但愿這篇概述多少可以幫你確定哪一種解決方案最適合你項目的具體要求。
jQuery Mobile適合你嗎?
差不多二十年來,處理跨瀏覽器的HTML和CSS不一致問題一直讓許多開發人員頗為苦惱。而Ajax的出現更是加劇了這些問題,因為開發人員現在要處理新的問題:無數與JavaScript有關的瀏覽器不兼容問題和異?,F象。后來出現了jQuery:由于可以對基本的JavaScript任務進行強大的抽象處理,jQuery大大減輕了編寫復雜的跨瀏覽器代碼方面的壓力。難怪jQuery一下子火了起來。
眼下移動應用開發人員面臨可能更艱巨的挑戰,這不僅是由于要處理各種各樣的移動瀏覽器不兼容問題,還由于需要設計合理布局,以便適合移動設備所固有的各種外觀尺寸和有限資源。這時候,jQuery Mobile應運而生,它自詡是“一種針對觸摸而優化的Web框架,面向智能手機和平板電腦”,可以充分發揮jQuery和jQuery UI(51CTO注:查看jQuery UI實例http://jqueryui.com/)的優勢。
雖然jQuery Mobile目前仍是測試版(第二個測試版在去年8月3日宣布發布),但已經支持數量多得驚人的移動平臺,包括安卓、黑莓、iOS和Windows Mobile等其他平臺。同樣出色的是,它還支持眾多的窗口組件:由于jQuery Mobile對漸進增強(progressive enhancement)很重視,開發人員可以利用這些窗口組件,輕松創建統一的、跨移動設備的界面。務必將演示程序(51CTO注:查看演示程序地址http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/)裝入到眾多不同的設備上(包括你的桌面瀏覽器),領略一下界面是如何變化以適合目標設備的。
此外,務必從桌面瀏覽器里面來查看演示程序的源代碼;連剛入門的jQuery用戶也會注意到該程序的代碼很注重全面隔離頁面布局和JavaScript驅動的功能。你會看到,整個應用程序都在一個文檔里面,每個“頁面”及其組成部分使用與自定義屬性有關的DIV來定義。比如說:
- <div id="home" target="_blank">
- <h1>WJGilmore, LLC</h1>
- </div>
- <div>
- <p>Check back regularly for the latest information about Jason's books!</p>
- </div>
- <div>
- <h1>Copyright © 2011 W.J. Gilmore, LLC</h1>
- </div>
- /div>
jQuery Mobile的主要特性
雖然使用jQuery Mobile的理由有多個,但是下面三個理由顯得尤為突出:
- jQuery開發人員使用jQuery Mobile時會覺得駕輕就熟,那是由于兩者使用共享的代碼庫。
- 如果目標用戶群并不局限于使用某一種設備,關注跨平臺兼容性這個優點很理想。
- 社區和企業的廣泛參與促使像Dreamweaver CS 5.5這些廣受歡迎的開發產品和像非常出色的Photo Swipe這一批值得關注的插件內置了對jQuery Mobile的支持。
51CTO專題推薦:jQuery Mobile基礎入門教程#p#
jQTouch適合你嗎?
那邊廂,jQuery Mobile力求提供在眾多移動設備上兼容的功能;這邊廂,jQTouch項目而是將大部分精力投入到了支持基于WebKit的瀏覽器(Chrome和Safari)的設備上。因而,jQTouch應該與旨在部署到iPhone和安卓設備上的Web應用程序結合使用。支持針對WebKit而優化的動畫以及旨在與移動設備的式樣融為一體的多個主題。
要熟悉jQTouch的功能,最容易的辦法就是通過你的移動設備或WebKit瀏覽器,仔細研究演示網站(51CTO注:演示網站地址http://jqtouch.com/preview/demos/main/#home)。我尤其建議查看演示程序的源代碼;你會看到,與jQuery Mobile一樣, jQTouch“頁面”也使用一系列DIV元素和相關屬性來組裝,設計人員對這種方法應該會很熟悉。
jQTouch的主要特性
雖然使用jQTouch的理由有多個,但是下面兩個理由顯得尤為突出:
- 雖然jQTouch同樣基于jQuery,但是其側重點主要是為基于WebKit的瀏覽器提供經過優化的支持。因而,如果你打算一心鎖定使用基于iOS或安卓的設備的用戶,那么jQTouch可能比較合適。
- 與jQuery Mobile一樣,jQTouch也采用了以HTML和CSS為中心的方法來開發頁面,使用JavaScript專門致力于添加事件、動畫及其他功能。如果你在與設計人員合作,或者開發人員不是特別精通JavaScript,在想方設法逐步熟悉移動Web開發,那么這種方法就很吸引人。
51CTO專題推薦: Sencha Touch基礎入門教程#p#
Sencha Touch適合你嗎?
較之與jQuery Mobile和jQTouch,Sencha Touch學起來難度相對比較復雜,不過有弊也有利:雖然比較復雜,但是帶來了強大的功能。作為Sencha公司的一款雙許可證(商業版和GPL/FLOSS版)產品,Sencha Touch采用了與上述的幾種移動開發框架全然不同的方法,原因在于布局和界面窗口組件是使用出色的JavaScript庫構建而成的,而該JavaScript庫恰好擁有豐富的實用特性,比如離線支持、獨特布局和輕松制作主題的功能。
此外,Sencha Touch采取了從極其全面的角度來應對應用程序開發所固有的挑戰,原因在于它支持可以完全直接開發MVC驅動的應用程序。為了形象地說明開發Sencha Touch應用程序與開發jQuery Mobile / jQTouch應用程序之間的反差到底有多明顯,不妨將jQuery Mobile/jQTouch演示程序里面的源代碼與用于僅僅創建和啟動視口的下列Sencha Touch代碼作一比較:
- Ext.regApplication({
- name: 'App',
- defaultUrl: 'Index/index',
- launch: function()
- {
- this.viewport = new App.views.Viewport();
- },
- });
雖然這種方法對相對不熟悉JavaScript的新手來說可能難度很大,不過我還是建議花點時間嘗試一下Sencha Touch,因為直觀的語法、編寫清晰的文檔以及眾多的配套實例對于你盡快上手會大有幫助。
Sencha Touch的主要特性
雖然使用Sencha Touch的理由有多個,但是下面三個理由顯得尤為突出:
- 原生的MVC架構致力于為面向框架的開發人員消除緊張,他們可能在為如何合理地組織和管理JavaScript代碼而苦惱。
- Sencha開發人員已付出了很大的努力,在Sencha網站(51CTO注:Sencha網站地址http://www.sencha.com/)上發布了眾多的教程和演示應用程序。
- 對于之前熟悉窗口組件工具包(想一想Swing和GTK+)的開發人員來說,窗口組件的布局和組織方面采用JavaScript驅動的方法自然很熟悉。#p#
結束語
讀者***總是問我應該選擇哪一種框架。回答總是一樣:這得看情況。毫無疑問,Sencha Touch是這種開發框架當中功能最豐富的,不過有時候學起來比較困難。話雖如此,如果你的目的僅僅是為現有的應用程序提供對用戶友好的移動界面,那么jQuery Mobile或jQTouch可能會提供一條阻力最小的道路。如果你給移動應用程序設的目標比較高,那么Sencha Touch極有可能完全值得你為此投入時間。不管你***選擇了什么樣的解決方案,我都很想聽聽你使用后的感受!歡迎留言。
本文作者
W.Jason Gilmore曾開發了大量PHP和MySQL應用程序,并在各大專業媒體發表了眾多膾炙人口的文章。
原文地址
http://www.developer.com/ws/mobile-web-development-frameworks-the-javascript-roundup.html
【51CTO譯稿,非經授權謝絕轉載,合作媒體轉載請注明原文出處、作者及51CTO譯者!】