李 正 張欣宇 馮一帆
1 中國聯(lián)通研究院 北京 100032
2 北京中網(wǎng)華通設計咨詢有限公司 北京 100070
近三年來,我國移動互聯(lián)網(wǎng)用戶規(guī)模呈迅猛增長態(tài)勢,根據(jù)中國互聯(lián)網(wǎng)絡信息中心發(fā)布的統(tǒng)計數(shù)據(jù)[1],截至2013年6月底,我國網(wǎng)民規(guī)模達5.91億,其中手機網(wǎng)民規(guī)模4.6億,占比78.5%,相比較2009年12月的調查結果,使用手機上網(wǎng)用戶規(guī)模增長98.7%。促成手機網(wǎng)民數(shù)量大規(guī)模增長的原因除了我國3G移動網(wǎng)絡的普及、無線網(wǎng)絡發(fā)展(包括公用和私有WiFi的發(fā)展)外,也得益于智能手機的大規(guī)模普及和手機應用的創(chuàng)新。
根據(jù)市場研究公司Gartner于2013年9月20日發(fā)布的數(shù)據(jù),2013年全球移動應用下載量猛增至1 020億次,并將持續(xù)增長至2017年,屆時將達到2 690億次??梢?,移動互聯(lián)網(wǎng)應為用戶的工作和生活所帶來的便利已深入人心。同時,對于移動互聯(lián)網(wǎng)應用的開發(fā)者來說,想要讓更多的用戶使用自己的應用,面對市場中種類繁多的移動終端,如何更加快速、有效地開發(fā)、維護應用程序便是關鍵的一環(huán)。
目前,移動互聯(lián)網(wǎng)應用的呈現(xiàn)形態(tài)主要分為移動Web應用和本地應用(Native App)兩大類。本地應用是指數(shù)據(jù)的運算和存儲均在本地(移動終端)操作系統(tǒng)上的應用,一般采用系統(tǒng)原生語言開發(fā)(如Android系統(tǒng)中使用Java,IOS系統(tǒng)中使用Object-C,Windows Phone中使用C#或C++等)。Web應用是指運行在Web引擎上的應用,一般采用網(wǎng)頁編程語言開發(fā)。
本地應用的特點是運行效率高、能夠直接與終端硬件交互、實現(xiàn)豐富的人機交互方式。目前,在移動互聯(lián)網(wǎng)應用市場中,絕大多數(shù)應用都是本地應用,但隨著用戶和智能移動終端平臺種類的增加,本地應用發(fā)展所面臨的問題也逐漸擺在應用開發(fā)商的面前。
1) 跨平臺部署問題。當前主流移動智能終端系統(tǒng)有Android、IOS、BlackBerry OS、Windows Phone等,這些系統(tǒng)下的本地應用均無法運行在其它系統(tǒng)中,這意味著開發(fā)商要針對每一個移動平臺招聘不同的開發(fā)、維護人員,將使得開發(fā)成本激增。
2) 快速更新與發(fā)布控制。上述主流操作系統(tǒng)中,除Android系統(tǒng)外,應用的發(fā)布都要受到系統(tǒng)廠商的管理,應用開發(fā)商必須通過特定的應用商店(比如Windows Phone Apps+Games Store、IOS下的App Store)才能讓用戶得到自家開發(fā)的應用,這對開發(fā)商在開發(fā)應用的功能上做了限制,也降低了應用的發(fā)布速度。
3) 碎片化問題。碎片化問題在Android系統(tǒng)中表現(xiàn)的尤為明顯,由于其系統(tǒng)和硬件的開放性,市場中的Android設備屏幕尺寸、分辨率各異,再加上Android系統(tǒng)頻繁更新,小的設備廠商沒有實力快速加入新版本陣營中,使得碎片化日益嚴重。應用開發(fā)商要適配不同設備,使開發(fā)成本大幅增加,甚至導致了許多開發(fā)商放棄Android平臺[2]。
這三個問題是制約本地應用發(fā)展的主要原因,相比較而言,移動Web應用在這些方面有著明顯的優(yōu)勢。
與本地應用相比,Web應用不直接依賴于終端系統(tǒng)的原生語言,而是直接在終端系統(tǒng)的Web引擎上運行,具有良好的跨平臺特性,面對移動智能終端的“碎片化”問題相比本地應用也有更好的表現(xiàn)。這一特性也使Web應用的分享、傳播變得極為方便,用戶只需要知道應用的地址鏈接便可訪問該應用,應用升級時開發(fā)商只需將升級后的應用部署到服務器上,用戶再次訪問時便可以使用最新的版本,因此,開發(fā)商可以自如地控制Web應用的發(fā)布可版本升級。
然而在HTML5技術出現(xiàn)之前,Web應用與本地應用之間有著不可逾越的障礙,從功能上可分為以下幾類問題。
1) 本地存儲。首先,相對傳統(tǒng)的應用,Web應用不需要安裝,所占空間小的特性使其具備傳統(tǒng)軟件應用所不具備的優(yōu)勢,但由于缺少本地存儲數(shù)據(jù)的能力,在沒有網(wǎng)絡信號覆蓋的地方,Web應用也就無法正常使用;其次,每次訪問同一個Web應用時,都需要下載一次應用數(shù)據(jù),其中包含大量重復數(shù)據(jù),這會消耗大量帶寬和流量。
2) 設備硬件訪問。由于當前網(wǎng)絡標準的限制,使得Web應用很難訪問設備上的各種硬件,比如各重力感應傳感器、GPS、攝像頭等硬件。無法利用這些元件的硬件特性會極大地阻礙Web應用的創(chuàng)新,這是制約Web應用發(fā)展的重要原因。
3) 圖像繪制及渲染。想要直接在網(wǎng)頁上進行繪圖是不能輕易完成的,即使是幾何圖形也不可以。在瀏覽器當中只能對圖片做出點擊、保存等有限的交互操作。如果希望在網(wǎng)頁中對圖片做出更多操作或者畫出圖形,就需要借助 flash、silverlight這類插件來完成。
4) 多媒體播放。當前在Web應用中,大多數(shù)音視頻是通過插件(比如 Flash)來播放的,這對含有此類功能的Web應用帶來了跨平臺方面的困難,因為并非所有瀏覽器都支持同樣的插件(比如Safari瀏覽器就不支持flash插件)。
5) Web通信能力。當設計一個Web應用來展示實時的信息時(如股票信息、票務信息等),通常是使用輪詢(Polling)、長輪詢(Long-Polling)或流(Streaming)等實時交互方式,這些方法在交互時都會用到HTTP的請求頭和響應頭,包含很多不必要的額外信息以至于增加了延遲,在對流量比較敏感的移動互聯(lián)網(wǎng)領域,這些包頭消耗的流量也是一筆不可忽視的開銷。
6) 腳本運行效率。眾所周知,瀏覽器在處理HTML頁面中的腳本時,當前頁面處于不可響應的狀態(tài),如果頁面嵌入的腳本較多或腳本執(zhí)行時間較長時,用戶是無法做其它操作的,因此,十分影響Web應用的用戶體驗。
這些問題一直以來限制著移動Web應用的發(fā)展,使其完全無法和本地應用相抗衡,以至于出現(xiàn)了當前移動互聯(lián)網(wǎng)市場中本地應用為王的局面。直到HTML5技術的出現(xiàn),HTML5在這些問題上做出了令人興奮的改進,促使Web應用急速發(fā)展,并受到越來越多開發(fā)者的關注。
在HTML5推出之前,W3C推薦標準還是1999年發(fā)布的HTML4.01和2001年發(fā)布的XHTML1.1,十多年來,HTML一直沒有進行真正的升級,隨著互聯(lián)網(wǎng)應用的迅速發(fā)展,HTML4.01和XHTML1.1標準已力不從心,它們以文檔為中心的理念已無法滿足現(xiàn)代互聯(lián)網(wǎng)應用的需要,因此,開發(fā)人員要求升級的呼聲越來越高。2008年1月22日,HTML5的第一份正式草案發(fā)布,其目標便是取代HTML 4.01和XHTML 1.1標準,使網(wǎng)絡標準達到符合當代的網(wǎng)絡需求。
廣義論及HTML5時,實際指的是包括HTML5、CSS3和JavaScript在內的一套技術組合。它希望能夠減少瀏覽器對于需要插件的豐富網(wǎng)絡應用服務(plugin-based rich internet application,RIA),如Adobe Flash、Microsoft Silverlight和Oracle JavaFX的需求,并提供更多能有效增強網(wǎng)絡應用的標準集。
具體來說,HTML5添加了許多新的語法特征,其中包括
2012年第四季度,HTML5被W3C作為“候選推薦規(guī)范”正式發(fā)布,這意味著HTML5技術標準此時已是穩(wěn)定版本,此后只會對漏洞進行修正,并計劃在2014年第四季度最終定稿。與其同時發(fā)布的還有HTML5.1的首份規(guī)范草案。
HTML5一發(fā)布便受到開發(fā)者的關注,主要原因是其新特性將解決當前移動Web應用所遇到的眾多問題,使移動Web應用可以與本地應用相抗衡甚至更具優(yōu)勢。針對傳統(tǒng)Web應用遇到的問題,HTML5技術提供了以下新特性。
1) 本地存儲。①Web storage。HTML5的Web storage API 采用了離線緩存,緩存后會生成一個清單文件(manifest file),這個清單文件實質就是一系列的URL列表文件,這些URL分別指向頁面當中的HTML、CSS、Javascrpit、圖片等相關內容。當使用離線應用時,應用會引入這一清單文件,瀏覽器會讀取這一文件,下載相應的文件,并將其緩存到本地。使得這些Web應用能夠脫離網(wǎng)絡使用,而用戶在離線時的更改也同樣會映射到清單文件中,并在重新連線之后將更改返回應用。②Indexed DB。它是HTML5的另外一種數(shù)據(jù)存儲方式,目的是幫助Web應用在本地存儲比較復雜的數(shù)據(jù)。每個域名可以創(chuàng)建多個“數(shù)據(jù)庫”,每個“數(shù)據(jù)庫”可以存放多個“表”,每個表中可以存放多個不同類型的Json對象。
2) 設備硬件訪問。①Geolocation API。移動Web應用可以靈活使用移動智能終端上的GPS、Wi-Fi等定位方式,快速獲取終端的精確位置。②Device Orientation API。該API可以讓Web應用訪問終端上的陀螺儀,收集設備的方向和移動信息,配合Geolocation API可以讓開發(fā)人員實現(xiàn)豐富的地圖、導航等類型的應用。③Media Capture API。HTML5的Media Capture API提供了對移動終端攝像頭的可編程訪問,比如用戶可以直接調用getUserMedia方法獲得攝像頭提供的視頻流。
3) 圖像繪制及渲染。①Canvas。Canvas的應用編程接口提供了數(shù)十個方法以實現(xiàn)Web應用的繪圖功能,用戶可以在使用了Canvas標簽的Web應用中動態(tài)地生成各種圖形圖像以及動畫。②WebGL。開發(fā)人員可以通過WebGL提供的技術方案直接在網(wǎng)頁上展示3D物體形象,其繪圖性能可以直接使用終端設備的圖形處理器能力。Canvas和WebGL的出現(xiàn)使Web應用可以不借助其它插件實現(xiàn)出色的繪圖和渲染能力[5]。
4) 多媒體播放。①在HTML5中,增加了
5) Web通信能力。①Web Socket。Web Socket基于瀏覽器原生Socket,實現(xiàn)了全雙工通信,使Web應用能實現(xiàn)真正的實時通信[6]。與Ajax相比,Ajax技術需要客戶端發(fā)起請求,XHR收到域的限制,而WebSocket使服務器和客戶端之間彼此互推信息,并允許跨域通信。②Web Notification。過去瀏覽器采用嚴格的沙盒機制將瀏覽器與桌面環(huán)境隔離,Web Notification提供了一種可以跨越沙盒的API,當瀏覽器運行在后臺時,用戶也可以收到來自Web應用的通知。
6) 腳本運行效率。①Web Worker。HTML5提出了線程的概念,通過Web Worker可以為Web應用提供多線程支持[7]。Web Worker的主要特征是:能夠長時間運行(響應)、理想的啟動性能、理想的內存消耗。Web Worker允許開發(fā)人員將需要長時間運行的計算放在后臺進行,并保證頁面對用戶的及時響應。
HTML5帶來的這些新特性,迅速縮小了移動Web應用和本地應用在功能和性能上的差距,并憑借其跨平臺、節(jié)省本地存儲資源、更易于版本控制等優(yōu)勢,Web應用極有可能改變當前移動互聯(lián)網(wǎng)本地應用為王的局面,成為未來的主流應用形態(tài)。
隨著HTML5標準的正式發(fā)布,基于HTML5技術的移動Web應用也大量出現(xiàn)在人們的視線中,其中一類應用是桌面Web應用的移動化,例如百度和谷歌的地圖應用移動版使用了地理定位API;Gmail移動Web版使用了本地存儲,使用戶可以離線閱讀郵件;優(yōu)酷、愛奇藝、Youtube等視頻網(wǎng)站也在其移動版中放棄了Flash插件,用HTML5的新特性實現(xiàn)音視頻的播放。另一類應用是純移動Web應用,天氣應用Sun、閱讀應用美閱等等,它們和本地應用非常相似,在性能和體驗上都有很好的表現(xiàn)[8]。
眾多大公司也紛紛推出了各自的HTML5開發(fā)工具,例如Adobe已感到移動互聯(lián)網(wǎng)中Flash大勢已去,在2011年放棄了移動設備的Flash支持,并發(fā)布了HTML5動畫制作工具Adobe Edge Animate等HTML5開發(fā)工具;Opera公司發(fā)布了全球首款GPU加速的HTML5處理引擎,隨后EPIC Games公司發(fā)布的新一代虛幻4游戲引擎也支持了基于HTML5的跨平臺3D游戲開發(fā);百度也上線了Site App平臺,幫助開發(fā)者建立、推廣移動Web應用??梢钥闯?,HTML5技術正在移動互聯(lián)網(wǎng)中進一步普及。
然而,完全使用HTML5技術(HTML5+JS+CSS3)開發(fā)的移動應用在調用終端硬件功能時,是通過終端系統(tǒng)中的瀏覽器調用Device API來實現(xiàn)的,因此,需要瀏覽器對HTML5標準支持良好。但目前市面上眾多瀏覽器對HTML5的各項新特性的支持參差不齊[9],這造成了一些HTML5應用無法在某些瀏覽器上正常運行。
為了解決這一問題,同時利用本地應用和HTML5 Web應用的特性,混合型應用應運而生。
混合型應用(Hybrid APP)是介于本地應用和移動Web應用之間的折中方案,它繼承了兩種應用形態(tài)的長處。結合移動Web應用的需求和HTML5的特性, 現(xiàn)階段出現(xiàn)了多種混合型應用的開發(fā)框架,如PhoneGap、AppCan、AppMobi、Titanium等。圖1為PhoneGap應用架構圖。
圖1 PhoneGap應用架構圖
開發(fā)者可以用HTML5技術完成移動應用主要功能的編程來解決本地應用的跨平臺、“碎片化”等問題;使用JavaScript調用混合應用框架提供的插件庫,能解決移動瀏覽器對Device API的支持不全面的情況,讓HTML5充分發(fā)揮其特性。
雖然混合應用與移動Web應用相比增加了一定的開發(fā)復雜度,但面對移動瀏覽器對HTML5兼容性不一致的現(xiàn)狀,在現(xiàn)階段使用混合型應用更具優(yōu)勢,它可以獲得比本地應用更好的跨平臺特性,減少開發(fā)成本,同時可以在將來瀏覽器對HTML5的兼容性統(tǒng)一時能更快更好的過渡到移動Web應用。
從目前的發(fā)展趨勢來看,移動互聯(lián)網(wǎng)依舊是IT產業(yè)的未來,谷歌和Mozilla基金會都已推出了完全基于瀏覽器的操作系統(tǒng)Chrome OS和Firefox OS,這些都是推動本地應用Web化的風向標。隨著移動通信技術的快速發(fā)展以及HTML5技術的逐步完善,我們可以肯定HTML5技術將在未來有著更廣泛的應用和發(fā)展,我們現(xiàn)在所見的即是未來!
參考文獻
[1]中國互聯(lián)網(wǎng)絡信息中心(CNNIC),第32次中國互聯(lián)網(wǎng)絡發(fā)展狀況統(tǒng)計報告[R].2013.7
[2]Appcelerator-IDC.2012年Q3移動開發(fā)者調查報告[R].2012.9.25
[3]van Kesteren A,Pieters S.HTML5 Differences from HTML4[EB/OL].[2014-08-10].http://dev.w3.org/html5/html4-differences/
[4]W3C.Syntax Errors[EB/OL].[2014-08-10].http://www.w3.org/html/ig/zh/wiki/HTML5/introduction#.E8.AA.9E.E6.B3.95.E9.8C.AF.E8.AA.A4
[5]李慧云,何震葦,李麗,等.HTML5技術與應用模式研究[J].電信科學,2012(5):24-29
[6]李代立,陳榕.WebSocket在Web實時通信領域的研究[J].電腦知識與技術,2010,6(28):7923-7925
[7]劉華星,楊庚.HTML5——下一代Web開發(fā)標準研究[J].計算機技術與發(fā)展,2011(8):54-58
[8]蔣宇捷.從HTML5移動應用現(xiàn)狀談發(fā)展趨勢[J].程序員,2013(5):88-91
[9]崔康.瀏覽器對HTML5的兼容性分析[J].程序員,2011(4):44-47