Chromium on Android: 認識Chromium WebView

標籤：chromium   webview   

Android KitKat一項重要的更新就是WebView採用Chromium/Blink渲染引擎，本文簡要的敘述了新版WebView的主要特性、需要進一步改進的地方以及WebView的代碼結構等。

WebView前世今生

WebView是Android平台上一個非常重要的系統組件，用於將一個顯示Web頁面的視窗組件view嵌入到應用程式，並提供了一組API介面允許開發人員定製頁面載入和繪製的行為，比如響應頁面載入狀態的變化和彈出JavaScript對話方塊的請求等等。自Android 1.0發布以來，WebView被廣泛地使用在應用程式中，最典型的當屬Stock瀏覽器了，它就是基於WebView開發的一個瀏覽器程式。關於詳盡的文檔描述，請參看WebView的官方文檔。 

早期的WebView (在Android 4.4以前)是基於WebKit實現的，可以簡單理解為直接在WebKit程式碼程式庫中增加一個分支，解決Android平台特定的頁面渲染方式以及通過JNI介面將WebKit的功能橋接為Java層的API介面。在圖形方面，WebView和Android平台一樣，採用的是Skia圖形庫，但沒有啟用硬體加速，渲染效能非常不好，這也是許多使用者經常抱怨的詬病之一。 

隨著Android 4.4 (KitKat) 平台的發布，基於Chromium開源項目的WebView成為KitKat平台的一大亮點。新版WebView採用了與Chrome瀏覽器相同的Blink渲染引擎，v8 JavaScript引擎，網路程式庫以及記憶體 Clerk，在HTML5特性支援方面不僅與Chrome保持了更高的一致性，而且還彌補了舊版WebView在渲染效能方面的不足。Android平台上所有使用WebView的應用程式都將無縫透明地受益於新版WebView的特性支援和效能提升。

目前，Android KitKat上的WebView是基於Chromium 30.0.0.0，而Chromium開源項目一直以6周一次的迭代周期在快速演化，Google官方並沒有給出一個明確的計劃什麼時候以什麼方式升級WebView組件，也許是通過GMS，但儘管如此，就目前的情形來看，新版WebView只能在Android 4.4系統上使用。這就意味著目前市面大量Android 4.3或以前的裝置都不能使用新版的WebView，享用不到新版WebView引入的好處。為什麼其他非4.4的裝置上不能使用呢？原因主要是Chromium WebView必須與AOSP (Android Open Source Project) 原始碼一起才能編譯，不能單獨從Chromium的程式碼程式庫中編譯一個可以獨立安裝的軟體包。

主要特性

• 支援更多的HTML5特性，例如Web Socket, Web Worker, FileSystem API, Page Visibility API, CSSfilter等等。html5test.com跑分結果為448分，與Chrome瀏覽器非常接近了。

• 添加了對遠端偵錯功能的支援。任何使用WebView的應用程式預設都開啟了遠端偵錯功能，通過USB線串連到開發主機上，在主機的Chrome瀏覽器中輸入chrome://inspect就可以直接在開發主機上直接調試WebView載入的頁面。開發人員也可以調用 setWebContentsDebuggingEnabled開啟或關閉這個功能。這對廣大HTML5應用開發人員絕對是一個福音。

• 更智能的記憶體管理原則。舊版WebView需要應用程式在系統記憶體不足的情況下，顯式地調用freeMemory方法來釋放WebView佔用的記憶體資源，。而新版的 WebView中，freeMemory這個方法已經被標記為“deprecated”，也就是應用程式不需要自己去釋放記憶體，WebView的內部實現已經考慮了對系統低記憶體運行時的響應，一旦發現系統處於低記憶體的運行狀態，WebView會主動調整記憶體配置策略，儘可能釋放一些已佔用的記憶體資源。

• 支援軟體渲染和硬體加速模式。Android應用程式可以在manifest檔案中指定hardwareAccelerated的值表明是否啟動硬體加速，為了相容早期使用WebView的應用程式，新版WebView同時支援軟體渲染和硬體渲染兩種模式。

不足之處

• 尚有一些重量級的HTML5特性沒有支援，比如WebGL，WebRTC，其中原因是WebGL對圖形顯卡的要求很高，而目前市面上每個廠商的硬體能力不盡相同，所有激進地開啟WebGL的支援可能會導致平台的一致性問題，即同一個HTML5應用在不同的裝置上行不一致，有的能跑，有的掛掉。

• 尚有一些輕量級但實用的HTML5 API還不支援。典型的有兩個，一個是全屏Fullscreen API，另外一個是Network Information API.

• Canvas 2D沒有開啟硬體加速模式。Canvas2D的效能和Chrome瀏覽器還是有一定差距，從代碼注釋來看，是因為skia庫中硬體加速的Canvas 2D後端Ganesh可能會導致WebView崩潰。

• 硬體加速渲染模式下所有對GPU的操作都發生在主線程中。UI主線程實在是太忙，如果能和Chrome一樣，專門為GPU操作建立一個線程，效能還可得到進一步提升。

更新：最新的Chromium WebView，已經添加了WebGL，WebRTC以及加速Canvas 2D的支援了。

代碼結構

確切地說，在AOSP中WebView是由三部分程式碼群組成：

650) this.width=650;" src="http://img.blog.csdn.net/20140113222657312" align="middle" alt="WebView代碼結構圖" width="410" height="234" />

• Chromium代碼：包含在external/chromium_org目錄中，其中android_webview/目錄包含了WebView的內部實現代碼和對應的Java類包；

• Java橋接代碼：包含在framework/webview/java目錄中，提供了基於Chromium的WebViewProvider實作類別WebViewChromium，這個類將被Android系統動態載入後作為android.webkit.WebView的內部實現；

• Android平台支援代碼：這部分代碼量少但至關重要。在硬體加速模式下，WebView必須能夠直接存取Android系統的顯存以及對HardwareCanvas執行GL操作，而訪問顯存和對HardwareCanvas的操作沒有相應的SDK或NDK的支援，只能直接調用AOSP代碼。這也是前面提到的WebView必須和AOSP一起編譯的原因。

從AOSP中編譯WebView

如果編譯一個完整版的WebView，需要先要下載整個AOSP的代碼，運行source build/envsetup.sh和lunch <target>命令後，進入framework/webview目錄執行mm –j8編譯WebView模組，最後在out目前將會得到libchromiumwebview.so和libwebkit_plat_support.so兩個動態連結程式庫，將這兩個so檔案拷貝到目標裝置的/system/lib目錄下，重啟裝置後就可以使用你自己編譯的WebView了。

 從Chromium中編譯WebView

實際上，也從直接從Chromium程式碼程式庫中編譯WebView，但這個WebView並不是一個完整的WebView。前面說到，WebView還包括了Android平台支撐代碼，而Chromium程式碼程式庫並沒有包含這部分代碼，所以編譯出來的WebView只有純軟體的渲染模式。因此，它對協助驗證一個WebView功能性方面的問題還有有用的，對於最佳化渲染效能只能從AOSP編譯了。

根據chromium.org官方文檔，下載chromium程式碼程式庫，配置好環境後運行：

$ . build/android/envsetup.sh
$ android_gyp
$ ninja –C out/Release android_webview_apk

編譯成功後，在out/Release/apks目錄中會有一個名為AndroidWebView.apk的檔案產生，它是一個Shell程式，提供了一個簡單的UI，方便開發人員驗證WebView的核心功能，但AndroieWebView.apk並沒有直接使用android.webkit.WebView，而是基於WebView的核心類AwContents實現的，查看manifest檔案你會發現它將android:hardwareAccelerated設定為false了，也就是說應用程式沒有開啟硬體加速，相應地WebView也只是工作在軟體渲染模式下。如果強制把android:hardwareAccelerated設定為true，這個Shell程式則不能正常顯示網頁了，這是意料之中的，硬體加速渲染模式必須要與AOSP一起編譯才會有。

參考資源

[1] WebView SDK，http://developer.android.com/reference/android/webkit/WebView.html

[2] Web程式的遷移，http://developer.android.com/guide/webapps/migrating.html

[3] WebView for Android, https://developers.google.com/chrome/mobile/docs/webview

[4] 遠端偵錯 for Android, https://developers.google.com/chrome-developer-tools/docs/remote-debugging

[5] Android上編譯Chromium, https://code.google.com/p/chromium/wiki/AndroidBuildInstructions

本文出自 “洪波的技術專欄” 部落格，請務必保留此出處http://hongbo.blog.51cto.com/4699661/1548482

Chromium on Android: 認識Chromium WebView