H5技術在移動客戶端中的應用

闞鈿玉 廣東南方職業學院信息與計算機學院

一、移動客戶端WEB開發概述

當前應用于移動客戶端的WEB開發方式主要有三種，分別為H5開發技術、原生開發方式以及混合型的開發方式。目前主流的開發技術為Native開發技術，因為作為原生開發技術的Native開發方式已經較為成熟。企業為了避免研發風險，大多都會采用這種開發方式來進行移動端的開發。但是其弊端在于需要投入大量的人力物力。例如在Android平臺上進行Web App的研發時，需要調用多個研發團隊來進行合作開發。因為涉及到Android平臺的問題，便需要Android開發團隊與其合作研發，相應的如果把平臺改換為iOS，則需要調用iOS的開發團隊來幫助研發。而企業在研發一個Web應用時，需要考慮到用戶使用的不同平臺，如果放棄任何一個平臺，則代表放棄了使用此平臺的大量客戶。因此企業一旦決定啟動某個項目的開發，則必須同時開發兩個平臺版本的Web App，這就需要多個團隊相互合作來完成應用的研發，但這極大的浪費了人力資源。而目前已經出現的混合技術開發模式，則為企業的技術研發提供了新的思路。比如國外公司在開發Web過程中就相應的引入SDK的技術，這項技術可以使JS和H5技術進行聯合開發。目前很多的應用開發場景都會應用到混合開發形式，這種模式將三者的技術優勢融合起來，所搭建的應用結構具有很強的綜合性能。但是三者也都有其各自的特點。H5開發技術其長處在于網頁的研發，在應用過程中，它也主要負責網頁語言研發部分。原生開發技術對于開發原生語言部分，具有很強的優勢，它能夠提供給用戶更好的使用體驗。總的來說，不同的項目開發場景，需要用到不同的開發技術模式，因此這里很難說哪種技術是最好的，只有最適合的才是最好的。因此企業在開發應用的過程中，應該深思熟慮，找到最適合項目的開發手段，才能獲得高效、經濟的開發方案。

二、H5技術在移動客戶端的應用分析

1. H5在移動客戶端開發中升級的cookie技術

為了更加方便快速的進行應用開發設計，首先就要對H5的優勢進行一個深入的了解和探究。首先說H5的WEB API技術，它的API技術其實可以看成是Cookie的升級版本。但是H5的cookie存儲數據量將不會受到限，因此能夠通過更進一步的方式來把數據寫進本地瀏覽器的ROM，當瀏覽器被關閉后，數據仍然會被保留下來，這樣在之后打開瀏覽器時，數據便能夠恢復，無需進行重復網絡請求，這樣就可以減少流量的使用。在H5技術中，引入WEB Storage這個功能。它是H5中非常重要的一個功能組成，它能夠使得瀏覽器在本地存儲瀏覽網頁所需要的緩存，這相當于以前H4技術里面的cookie的作用，H5的Storage要比舊版本H4中cookie 的作用更加具有優勢。因為H4 里面的cookie的存儲容量，最大支持為4K。但是如果使用H5技術的話，那么本地的存儲容量基本能夠達到在5M，這就很大程度上加大了存儲數據的能力。

2. 繪圖功能的增強

在以往的Web功能中，是沒有繪圖功能的。一方面是由于PC端對網頁繪圖并不是特別的需要，另一方面則是研究開發的技術壁壘所造成的。但是對于移動端來說，繪圖功能是非常必須的，這是移動端的特點所決定的。另一方面通過增強繪圖功能，可以使得網頁圖標美化，讓用戶可以擁有更好的瀏覽體驗。因此對于目前的移動端Web開發而言，繪圖功能是必要的。在H5開發技術中，便提供了圖片操作的相關技術支持。Canvas的API是H5中用來支持在Web中進行圖片方面操作的。它的主要功能包括旋轉、移動以及圖片縮放等一些比較常規的功能，但同時也加入了對于3D方面的技術支持。

3. GPS定位功能的應用

在移動客戶端中定位功能是必不可少的。例如，某些電商為用戶提供的線下門店的消費導航技術。在其客戶端應用中，H5技術可以根據消費者的位置來提供周邊的門店，讓消費者更好的進行線下門店自提等互動行為。并且可以為原始靜態的網頁增加一些動態效果，來提升網頁與消費者之間的互動能力，這種功能就體現了在H5 中多種移動、變形等動畫效果組件的應用。這種交互式的應用開發也可以有效降低移動客戶端的研發成本。目前來說，市面上比較流行的采用了H5技術的移動客戶端包括：當當購物、淘寶、唯品會、京東購物、寶貝租車等。

4.維護成本的降低以及交互性的提升

在原本的網頁設計里，幾乎都是靜態的網頁效果，很少有動態成分的加入，因此其互動性就大大降低了，用戶也只能通過靜態的網頁來獲取信息。但在H5技術中，由于加入很多變形、移動及動畫效果的組件，讓H5設計出來的Web具備了更強的動態顯示效果，因此也提升了網頁的交互能力，這同時也滿足了當前用戶對于交互式體驗的需求。在研發成本以及維護升級方面，如果使用的是原生開發技術來開發移動客戶端，那么其維護成本是非常高的，主要原因在于原生開發技術的平臺相關性非常低，且代碼不通用，一個平臺的代碼很難移植到其它平臺中去。因此不同的平臺的維護工作就需要不同的團隊來進行，維護成本也就水漲船高了。但是對于H5開發的應用來說，就不存在以上問題。由于H5的兼容性以及跨平臺的優勢，在升級維護過程中，不需要安裝一系列升級包，也不需要多個團隊對多個平臺的分別維護。所以這就大大降低了研發成本，也減少了應用維護帶來的各種問題。

5. H5在移動端應用的不足

在瀏覽體驗的過程中，如果流量比較慢，那么就會帶來比較差的用戶體驗，網頁加載慢，信息殘缺等一系列的問題。還有就是性能差異，與原生開發相比，H5的性能要差很多，這主要是因為原生開發技術已經非常成熟，與系統的貼合效果很好，所遇到的BUG也被很多之前的開發人員一一補足。但H5的應用時間還比較短，這就需要技術人員花費時間去做相應的努力。

三、總結

目前總的來說，隨著H5技術的不斷改進和發展，它已經完全有能力做相應的移動客戶端應用的研發。它強大的兼容性以及良好的跨平臺能力，對于許多企業來說是非常重要的。尤其是對于一些小型企業，使用H5技術不僅可以節約成本，也能夠快速實現。未來H5技術會不斷地改善，它將會應用到更多的平臺之中。但是H5技術也還是有著它的不足之處，比如隨著功能的不斷增加，使用人群的不斷龐大，其運行性能問題就會變得嚴重。因此企業在選擇相應開發技術的時候，應該從自身實際出發，根據確切需求來進行選擇，合理搭配其它開發方式，找到一個最優的設計方案。