數據顯示，全球互聯網用戶以及智能手機用戶的數量，增幅正在逐漸放緩。但是，移動數據流量卻取得爆炸式的增長，其年度增幅達到了81%，且增長速度正在加快。

移動數據流量增幅逐漸攀升用戶越來越依賴于移動終端提供的日常社交、獲取信息、商業買賣等服務。大量的訪問，提升了服務器端負載壓力。移動終端常常會出現頁面加載緩慢的狀況，這會大大降低終端客戶體驗。如果將資源文件、代碼邏輯文件、結構文件、樣式文件緩存在終端設備上，不僅能夠降低服務器壓力，還能夠減少網絡延遲、減少網絡帶寬消耗、減少終端用戶流量成本。

HTML5又給本地化帶來更多的選擇。目前前端緩存技術從技術類型分成傳統本地化技術與HTML5本地化技術兩類，如圖2所示：

傳統本地化技術又細分為Cookie，Flash Sharedobject，Goole Gears和User Data。

(1)Cookie，在Web中得到廣泛應用，但其局限性非常明顯，容量太小，早期有些站點會因為出于安全的考慮而禁用Cookie，因為Cookie的內容會隨著頁面請求一并發往服務器當前Cookie已經被各大網站完全支持，在UAP各個web平臺也一并支持。

(2)Flash SharedObject，其使用的是kissy的store模塊來調用Flash SharedObject。Flash SharedObject的優點是容量適中，基本上解決了兼容性問題，缺點是要在頁面中引入特定的swf和js文件，增加額外的HTTP請求負擔，且處理繁瑣。

(3)Google Gears是一個基于Firefox和IE的插件，要使用它，必須先安裝相應插件，但其官方網站目前已經停止更新。

(4)User Data其是微軟為IE專門在系統中開辟的一塊存儲空間，只支持Windows+IE的組合，IE的UserData能夠存儲完整的XML文檔，并且會將復雜的數據類型轉換為XML存儲起來。通過這種方式，數據會被插入到XML數據島(另一項只有IE中才存在的功能)中。然后整個XML數據島再被存入UserData中。使用save和load方法可將UserData存儲區數據保存在緩存中，一旦保存后，即使瀏覽器關閉，下一次進入該頁面，數據仍然存在，對單個文件的大小限制是128 KB，一個域名下總共可以保存1024 KB的文件，文件個數沒有限制，在受限站點里這兩個值分別是64 KB和640KB，所以如果考慮到各種情況的話，單個文件以控制在64 KB以下為宜。由于它概念模糊、使用困難，并且只能用于Internet Explorer，所以很少有Web開發人員會使用這種存儲方式，大多數的開發人員甚至完全不知道存在這種技術。

HTML5本地化技術的功能之一是本地存儲數據并且允許應用程序在無網絡時離線運行，有三種不同技術： Web Storage，適用于具有key/value對的基本本地存儲;離線存儲，利用一個manifest文件來高速緩存所有文件以便離線使用;Web數據庫，適用于關系型數據庫存儲。

在HTML5技術標準中一個非常重要的功能就是可以在客戶端本地保存數據的Web storage功能，該功能使用key/value對來支持存儲被Web應用程序訪問信息和變量，具體來說，有以下2種方式。

(1)sessionStorage.session，是指用戶在瀏覽網頁的時候，從進入網頁開始計算到瀏覽器關閉的這段生命周期內，將數據保存在session對象中，這里的session對象可以用來保存在此生命周期內的所有需要存儲的數據。

(2)localStorage不同于sessionStorage，localStorage將數據保存在客戶端本地的硬件設備中，通常是硬盤，即使關閉了瀏覽器，該數據依然存在，下次訪問的時候仍然可以繼續使用。

目前，Web應用程序已經變得越來越成熟了，僅通過Web Storage存儲一些基本數據已經不能滿足用戶提升響應的需求，為了讓整個應用程序在沒有網絡的離線狀態下也能夠正常工作，就必須把構成該應用的Flash、圖片、CSS、HTML、JS等大量文件存放在本地存儲中，此時，即便計算機沒有與網絡連接，也可以通過本地的資源文件來運行離線Web應用程序。

Web應用程序的本地緩存是通過頁面的Manifest文件來管理的，Manifest是一個位于Web服務器上的文件，它以清單的形式展示了需要緩存和不需要緩存的文件。在Manifest文件中，第一行是CACHE MAINFEST，它將是通知瀏覽器，需要對資源文件列表進行緩存處理操作。

一般地，緩存處理操作如圖3所示分為以下3種：

(1)CACHE該類別指定了需要被緩存到本地的資源文件，其為可選項。

(2)FALLBACK該類別每行具有倆個指定的文件，在有網絡的情況下第一個資源文件被訪問，在沒有網絡的情況下第二個資源文件被訪問，其為可選項。

(3)NETWORK該類別下的文件是不會被緩存到本地，這些文件必須在有網絡的情況下才能使用，其為可選項。

通常，可以為每一個頁面文件單獨指定一個Manifest文件，也可以僅對整個應用指定一個Manifest文件。需要說明的是，在使用Manifest文件時，要對服務器進行設置，讓所運行的服務器支持text/cachemanifest這個類型，不同的服務器具體的設置有所區別。

對于簡單的數據存儲，sessionStorage和localStorage能夠很好地完成，但對瑣碎的關系型數據進行處理時，其就無能為力了，此時Web數據庫可以很好地解決問題。在HTML4中，數據庫只能放在服務器端，客戶端只能通過發送請求的方式獲取到遠程數據，而在HTML5中，內置了一個可以通過SQL語法來訪問的數據庫，其具體步驟是：

(1)通過JavaScript腳本創建訪問數據庫的對象，參數依次為數據庫名、版本號、描述信息、數據大小。

var db = openDatabase (’dbname’,’1.0.0’,’DB Info’,’200000’);

(2)通過SQL語法進行數據操作，需要調用transaction方法。

上述是從技術角度介紹如何使用緩存技術，下面從存儲介質角度分析緩存類型，Web緩存從存儲介質角度又可以分為Relation，Object，File三層，如圖4所示。每層利用相應緩存技術，以提升網站響應速度，減少HTTP請求，減少后臺壓力。

Relation：這一級保存了后臺session信息，權限信息，頁面中的全局狀態信息，這些信息的特點是體積小，關系重要。所以在存儲上要重視賽選。

Object：這個層面是后臺返回的數據。數據應該滿足數量大，不易變的數據。同時這個層級要對數據做刷新機制和過期時間設置，保證數據的正常更新。

File：對頁面中的靜態資源文件進行緩存，文件緩存是離線應用的重點操作。不僅能夠提高訪問效率，減少HTTP請求，還可以使頁面在脫離網絡的情況下繼續正常使用

經過上述三級緩存，減少了HTTP請求數量，加快響應速度，減少后臺的數據響應次數，網站的響應效率提升50%以上。

兼容性方面，HTML5的技術標準在IE老版本瀏覽器中缺乏支持，各瀏覽器對本地存儲的支持度如表1所示。

表1 各瀏覽器對本地存儲的支持度

Firefox，Safari，Chrome，Opera瀏覽器對新型前端本地化存儲有相當好的兼容性處理，而IE家族相對落后，但隨著Windows 7及IE高版本瀏覽器的普及，相信在不久的將來，HTML5技術標準支持的本地化存儲技術將得到更廣泛的應用。

HTML工作小組于2014年10月28日正式公布HTML5作為W3C新的推薦標準，其定義為超文本標記語言(即HTML)的第五個版本。它主要用于構建一般性的web頁面以及復雜的應用程序。HTML5為開放式的Web平臺的建設奠定了強有力的基石。HTML5的本地化存儲技術作為HTML5的主要功能，將原本必須要保存在服務器上的數據轉為保存在客戶端本地，從而大大提高了Web應用程序的性能，減輕了服務器端的負擔，相信隨著網絡技術的進步，相信HTML5本地化會在Web應用中起到重要作用。

用友UAP平臺在本地化緩存方面，從Relation和Object層級上已經做了很多的嘗試，同時也取得很好的效果，File層級由于瀏覽器兼容不好，采用優雅降級的方式融合到項目中，利用本地化的技術手段，大幅提升了UAP產品的響應速度。