Android WebView 優化頁面加載效果

目前帶有Web功能的APP愈來愈多，爲了可以更好的使用WebView展現頁面，能夠考慮作相關的優化：WebView 緩存，資源文件本地存儲，客戶端UI優化。

可能有些人會說，爲何不作Native的，由於Native侷限性比較大，當須要加載的內容變化狀況比較大的狀況時，須要頻繁的發佈版本，這樣是不合理的，因此推薦使用WebView來加載一些比較容易改變的內容，同時也方便多個平臺的應用同時製做。

WebView緩存

開啓WebView的緩存功能能夠減小對服務器資源的請求，通常使用默認緩存策略就能夠了。

//設置 緩存模式 
webView.getSettings().setCacheMode(WebSettings.LOAD_DEFAULT);  
// 開啓 DOM storage API 功能 
webView.getSettings().setDomStorageEnabled(true);

須要注意的是，建議按期清除緩存，這樣保證APP佔用存儲空間處在必定的範圍內。

資源文件本地存儲

資源等文件(不須要更新)本地存儲，在須要的時候直接從本地獲取。哪些資源須要咱們去存儲在本地呢，固然是一些不會被更新的資源，例如圖片文件，js文件，css文件，替換的方法也很簡單，重寫WebView的方法便可。

{
      try {
          if (url.endsWith("icon.png")) {
              InputStream is = appRm.getInputStream(R.drawable.icon);
              WebResourceResponse response = new WebResourceResponse("image/png",
                "utf-8", is);
              return response;
          } else if (url.endsWith("jquery.min.js")) {
              InputStream is = appRm.getInputStream(R.raw.jquery_min_js);
              WebResourceResponse response = new WebResourceResponse("text/javascript",
                "utf-8", is);
              return response;
          }
          } catch (IOException e) {
                  e.printStackTrace();
          }
          return super.shouldInterceptRequest(view, url);
}

1. appRm爲app資源管理器，讀取drawable，assets，raw下的資源，都是android系統的一些很簡單的函數調用。
2. getInputStream的參數表明資源具體位置
3. WebResourceResponse後的資源類型須要寫正確

客戶端UI優化

怎麼讓用戶看不到WebView加載前的白色頁面呢？首次加載後頁面的跳轉能夠用上面的步驟進行優化，能夠提供給用戶一個很好的體驗，那加載的第一頁呢？咱們須要WebView預加載頁面，這個該怎麼作到的呢？下面提供兩種方法:

• ViewPager，將歡迎頁面與WebView頁面一塊兒放進ViewPager中，設置預加載頁面個數，使WebView所在頁面能夠預加載，在加載完畢的時候切換到WebView所在頁面。
• FrameLayout，將歡迎頁面與WebView頁面的佈局合在一塊兒，顯示在一個頁面內，起始隱藏WebView佈局，待WebView加載完畢，隱藏歡迎佈局，顯示WebView佈局。

使用FrameLayout簡單一些，兩種方法都是須要對WebChromeClient的onProgressChanged進行監聽，加載完畢進行頁面切換，以下：

webView.setWebChromeClient(new WebChromeClient() {
     @Override
     public void onProgressChanged(WebView view, int newProgress) {
         super.onProgressChanged(view, newProgress);
         if (newProgress >= 100) {
             // 切換頁面
         }
     }
});