基于HTML5的移動Web App開發(fā)及應(yīng)用

周義祥

摘 要

隨著我國科學(xué)技術(shù)的飛速發(fā)展，互聯(lián)網(wǎng)領(lǐng)域的智能化和自動化趨勢越來越明顯，特別是HTML5的出現(xiàn)，為移動WebApp的開發(fā)與應(yīng)用創(chuàng)造更好機會，不僅提升平臺整體兼容性，且更具表現(xiàn)能力。在實際應(yīng)用過程中，工作人員應(yīng)在把握HTML5特點和優(yōu)勢的基礎(chǔ)上，結(jié)合移動WebApp應(yīng)用特點，不斷創(chuàng)新APP網(wǎng)頁應(yīng)用，為用戶帶來更好的體驗。

【關(guān)鍵詞】移動WebApp HTML5 兼容性 用戶體驗

HTML5是當(dāng)前應(yīng)用得較為廣泛的互聯(lián)網(wǎng)核心技術(shù)，最早的HTML產(chǎn)生于上個世紀(jì)90年代初，HTML5是該技術(shù)的最新版本，將其應(yīng)用在移動WebApp的開發(fā)過程中，不僅能夠有效提升用戶體驗效果，更可保障智能手機的兼容性。

1 HTML5的應(yīng)用特點

自1990年被開發(fā)創(chuàng)造以來，HTML技術(shù)共經(jīng)歷以下幾個發(fā)展階段，具體如表1所示。

HTML5是對傳統(tǒng)Web標(biāo)準(zhǔn)的極大更新，與常規(guī)版本相比，HTML5在全面表現(xiàn)出Web內(nèi)容的同時，還屬于應(yīng)用得較為成熟的平臺，包括以下幾方面的特征：

（1）存在語義結(jié)構(gòu)化標(biāo)簽，如hgroud、footer、section等，提高文檔結(jié)構(gòu)的易讀性和清晰性。

（2）可有效支持離線存儲，與cookies相同，localStorage也可提供對應(yīng)的功能。通過IndexedDB模塊而存儲復(fù)雜數(shù)據(jù)，即利用緩存的方式，把文件資料下載到本地，使得用戶可在離線的情況下依舊使用移動WebApp。

（3）豐富多媒體的能力，即提升移動WebApp的音頻與視頻功能，優(yōu)化其圖形等功能。

（4）應(yīng)用API，移動WebApp中存在的API函數(shù)有利于保障終端設(shè)備的整體能力。

2 以HTML5為基礎(chǔ)開發(fā)應(yīng)用移動Web App的方式

HTML5的技術(shù)組合包括JavaScript、HTML5和CSS3等模塊，在開發(fā)移動WebApp的過程中，應(yīng)以AJAX和JavaScript為基礎(chǔ)，轉(zhuǎn)變常規(guī)網(wǎng)頁技術(shù)構(gòu)建與組織形式，為用戶帶來更好的體驗。

2.1 移動Web App的技術(shù)構(gòu)架

移動WebApp能夠動態(tài)控制系統(tǒng)的更新，包括修復(fù)系統(tǒng)bug和增加新功能等部分，在修改服務(wù)器之后可直接應(yīng)用，讓用戶能夠及時使用到新版本，這也從側(cè)面反映出移動WebApp在被開發(fā)應(yīng)用后，通常會不斷根據(jù)市場的變化情況和用戶實際需求而進行變更，因此，在設(shè)計移動WebApp的技術(shù)架構(gòu)時應(yīng)盡可能保障其的合理性與科學(xué)性，降低變更影響和維修總成本。移動WebApp前端數(shù)據(jù)層位于后端與UI界面中，把用戶操作優(yōu)化為HTTP請求，及時緩存好數(shù)據(jù)，使得在模塊更新中減少對系統(tǒng)的影響。

2.2 以HTML5為基礎(chǔ)應(yīng)用移動Web App的方案

針對安卓版本的平臺，以HTML5為基礎(chǔ)應(yīng)用的移動Web App方案共有兩個：

2.2.1 拓寬Web View組件

平臺的操作系統(tǒng)中，Web View組件有效封裝APP的開發(fā)接口，但其提供的上層API能力較為有限，因此，在HTML5技術(shù)中對其進行了對應(yīng)的拓展：

（1）插件形式的拓展功能；

（2）直接在平臺上拓展功能。

2.2.2 拓寬系統(tǒng)Webkit

Webkit包括兩種引擎：

（1）WebCore排版；

（2）JavaScript Core。

2.3 以HTML5為基礎(chǔ)的移動Web App頁面優(yōu)化方式

頁面優(yōu)化也是HTML5技術(shù)的重要突破，在傳統(tǒng)技術(shù)中，用戶每點擊一次鏈接都需進行一次刷新，因此，HTML5通過改變頁面元素，并提出OPOA解決方案，使得JavaScript腳本能夠順利被執(zhí)行。

3 移動Web App的開發(fā)應(yīng)用挑戰(zhàn)

移動Web App在互聯(lián)網(wǎng)時代不僅能夠更好地滿足人們對于“云端”技術(shù)的需求，更可通過手機直接獲取所需服務(wù)，如游戲、社交等。但受到多種內(nèi)外部因素的影響，移動Web App的開發(fā)過程中仍面臨以下幾方面的挑戰(zhàn)：

（1）HTML5技術(shù)仍未真正成熟，移動Web App完全取代傳統(tǒng)APP的困難仍然較大。

（2）移動Web App還需更完善的HTML5標(biāo)準(zhǔn)進行支持，用戶獲得的體驗應(yīng)進一步被優(yōu)化。

4 結(jié)束語

綜上所述，隨著HTML5技術(shù)的不斷發(fā)展，移動Web App的開發(fā)與應(yīng)用面臨著極大的挑戰(zhàn)與機遇。HTML5從本質(zhì)上轉(zhuǎn)變了開發(fā)移動Web App的方式，不僅能夠有效進行離線存儲，不斷豐富App媒體內(nèi)容，使得用戶獲得更好的體驗，還可以優(yōu)化App平臺，處理好多線程，實現(xiàn)真正意義上的兼容，因此，在未來以HTML5為基礎(chǔ)的移動Web App將會是發(fā)展主流。

參考文獻

[1]李世滿.基于HTML5 web技術(shù)APP快速開發(fā)研究--以移動辦公APP軟件開發(fā)為藍(lán)本[J].電腦知識與技術(shù)，2016，12（03）：81-82.

[2]朱凱南，李艷平，申閆春等.基于Ionic和Cordova的跨平臺移動APP的研究與應(yīng)用[J].電腦知識與技術(shù)，2016，12（01）：119-121.

[3]周備鋒.基于HTML5的畢業(yè)綜合實踐平臺Web APP的實現(xiàn)研究[J].未來英才，2016，23（07）：273-274.

作者單位

長江大學(xué)計算機科學(xué)學(xué)院計科11320班 湖北省荊州市 434000