Android 各个版本WebView

电玩女神 2022-09-26 02:51 811阅读 0赞

# 转载请注明出处 [http://blog.csdn.net/typename/][http_blog.csdn.net_typename] powered by miechal zhao ： miechalzhao@gmail.com #

# 前言： #

根据Google公布的Android 各个系统版本市场占有率([Google Android dashboards][]), Android 4.0及其以上系统将近90%左右，发展趋势必将是未来市面上几乎是Android 4.0以上系统。本文主要关注Android 4.0及以上系统WebView的实现，从Android WebView实现的Framework层大致可以分为三段Android 4.0系列，Android 4.1---4.3系列，Android 4.4及其以上系列。

# WebView差异 #

WebView是Android系统提供能显示网页的系统控件，它是一个特殊的View，同时它也是一个ViewGroup可以有很多其他子View。在Android 4.4以下(不包含4.4)系统WebView底层实现是采用WebKit([http://www.webkit.org/][http_www.webkit.org])内核，而在Android 4.4及其以上Google 采用了chromium([http://www.chromium.org/][http_www.chromium.org])作为系统WebView的底层内核支持。在这一变化中Android 提供的WebView相关API并没有发生大变化，在4.4上也兼容低版本的API并且引进了少部分API。这里简单介绍下基于Chromium 的Webview和基于Webkit webview的差异，基于Chromium Webview提供更广的HTML5,CSS3,Javascript支持，在目前最新Android 系统版本5.0上基于chromium 37，Webview提供绝大多数的HTML5特性支持。Webkit JavaScript引起采用WebCore Javascript 在Android 4.4上换成了V8能直接提升JavaScript性能。另外Chromium 支持远程调试([Chrome DevTools][])。

WebKit for WebView VS Chromium for WebView性能比对（测试环境 小米2. CM Browser. Android 4.1.1 VS 4.4.3）

<table style="color:rgb(51,51,51); font-family:Arial; font-size:14px; line-height:26px; border-collapse:collapse; width:524.25pt">       
 <tbody> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> &nbsp;</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> Webkit&nbsp;for&nbsp;Webview</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> Chromium&nbsp;for&nbsp;Webview</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> 备注</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> HTML5</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 278</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 434</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> http://html5test.com/</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> 远程调试</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 不支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> Android 4.4及以上支持</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> 内存占用</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 小</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 大</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> 相差20-30M左右</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> WebAudio</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 不支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> Android 5.0及以上支持</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> WebGL</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 不支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> Android 5.0及以上支持</td> 
  </tr> 
  <tr> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:96pt"> WebRTC</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:126.75pt"> 不支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:132pt"> 支持</td> 
   <td style="font-size:12pt; text-align:center; vertical-align:middle; height:14.25pt; width:169.5pt"> Android 5.0及以上支持</td> 
  </tr> 
 </tbody> 
</table>

# Android 4.0 WebView结构 #

![SouthEast][]

Android WebView API层主要提供给我们应用程序的接口，为了兼容向下版本Android在高版本中也是对这一层的API进行支持，因此如果底层发生变化，这些API接口层也不会发生太大变化。Android 平台不仅提供应用层编程接口也提供native层编程。下面介绍上图中的三个部分：

1）Android Framework:Android WebView是个特殊控件实现的支持需要Framework的代码主要在 ./frameworks/base/core/java/android/webkit目录下，在Android 4.0实现主要是在WebViewCore.java,BrowserFrame.java等文件。

2) Android JNI:需要有Native代码支持，因此需要有JNI层实现，Android WebView 4.0的JNI层实现WebView相关代码在./external/webkit/Source/WebKit/android/jni/目录下，这一层起到承上启下的作用，链接Framework层以及WebKit层的桥梁，比如相关的一些实现在WebviewCore.cpp，WebCoreFrameBridge.cpp等。

3) WebKit: WebKit内核，其核心主要是解析W3C标准以及渲染排版网页，他是一个跨平台的内核引擎，那么需要支持各个平台，需要我们的平台实现层，在Android 4.0系统这一部分相关代码主要在./external/webkit/Source/WebKit/android/WebCoreSupport/目录下，比如FrameLoaderClientAndroid.cpp,ChromeClientAndroid.cpp，这一层负责WebCore与系统平台的桥接，具体在不同平台会有不同的实现。实现网页的解析排版及渲染由WebCore来实现在Android 4.0源码当中代码位于./external/webkit/Source/WebCore/下，下面有WebCore实现的各个模块功能支持的相关代码，比如页面视图部分在page目录的chrome.cpp，比如加载页面需要的资源的loader中得FrameLoader.cpp等，这里不在继续深入详解，有兴趣的朋友可以下载Android 4.0源码阅读。

# Android 4.1--4.3 WebView结构 #

Android 4.1--4.3版本WebView内核实现还是基于WebKit,但在WebView的Framework层发生了变化，引入了工厂模式，目地是为了将内核与上层API接口分离开来，分离的意义不仅仅是抽象接口，更重要的是将来能替换内核部分的实现。 在4.1--4.3这一系列版本native结构基本与4.0版本相同，下图呈现新的变化：

![SouthEast 1][]

# Android 4.0--4.3 渲染 #

尽管之前4.0，与4.1--4.3是在不同的结构系列，其两者之间的差异主要是集中的Framework上的变化，这种变化更多体现在Framework层结构上的变化，WebKit内核极其在Android上的表现机制并没有发生很大变化，他们的渲染机制是相同的。下面介绍Android 4.0--4.3的渲染机制：

![SouthEast 2][]

在Android 4.0上已经默认开启硬件加速，因此WebView的渲染默认是基于硬件渲染的，通过本人分析其在WebView被隐藏的那一帧是采用软件渲染，目的是减少硬件占用，让其他UI能及时的响应。在硬件渲染情况下WebView通过onDraw方法传递Canvas 并将其转行为HardwareCanvas ，并生成native的 DrawGLFunction指针，通知native做渲染。在软件模式下，WebView通过传递的Canvas 通知内核webkitDraw将内核的一帧生成picture传输到Canvas中，执行Canvas draw bitmap。

# Android 4.4 WebView结构 #

在Android 4.4系统上 Google已经将系统默认的Webkit内核替换成自己的开源项目chromium，通过之前的版本分析，我们可以看到Android 对WebView的Framework 结构进行调整使其更抽象，更重要的目的还是集成自己的开源chromium。下面我们来看看WebView的结构发生了什么样的变化：

![SouthEast 3][]

./frameworks/base/core/java/android/webkit

./frameworks/webview/chromium/java/com/android/webview/chromium

./external/chromium\_org/android\_webview

./external/chromium\_org/content

为了将chromium项目集成到Android 中，chromium项目抽象出Android webview这一层，之前的接口抽离这时候已经变得很明显，Android Webview基于chromium content API这一层，第三方浏览器厂商也可以采用这种方式，目前所了解的厂商有Opera使用这种方式。Android 4.4WebView的渲染核心目前也没有发生太大变化，还是基于WebView的Canvas，将Chromium composit 结构绘制到WebView Canvas上。接入chromium内核，WebView浏览性能大幅度提升，但是和chrome for Android还是有些不同，主要体现在一下几点：

1. chrome浏览器是多进程架构，Chromium for Android Webview 是单进程架构。

2. chrome浏览器 内存占用比 Android WebView大的多。

3. chrome支持更多的HTML5 feature。

# Android WebView展望： #

Chromium项目编译"android\_webview\_apk“ 目前实现是基于Android SurfaceView，其渲染性能高于Android WebView的Canvas，历史遗留问题以及Android 系统WebView的作用特点，这一块随着Chromium 和 Android项目的整合，相信值得大家期待将来的Android WebView 的渲染性能会再次大幅提升。

本博客会持续更新Android WebView后续版本的变化，敬请关注 谢谢!

# Android 5.0 Lollipop WebView #

Lollipop版本中WebView的内核实现采用Chromium 37版本，这个版本带来更多的安全性和稳定性。这个版本解决Android 4.4版本网页当中请求访问打开本地文件选择器问题，引入新的回调接口，onShowFileChooser方法，需要此功能的可以在5.0上接上这个回调接口，并实现功能。另外这个版本提供安全许可给用户选择，当网页需要访问特殊资源时，会通知我们的应用程序，请求允许，回调接口为onPermissionRequest。之前我们也提到这个版本使得WebView默认支持WebAudio,WebGL,WebRTC等标准。

另外Google Android 还将webview做为一个能动态更新的app，能不更新Android版本情况下，更新WebView内核。Android 5.0 Webview默认提供减少内存占用支持，并且智能选择需要绘制的HTML document部门来提供性能。 当然开发者可以在自己应用程序需要时关闭这个选项(enableSlowWholeDocumentDraw)。

参考资料：

[https://source.android.com/][https_source.android.com] Android 4.0---5.0

[http://developer.android.com/reference/android/webkit/WebView.html][http_developer.android.com_reference_android_webkit_WebView.html]

[http_blog.csdn.net_typename]: http://blog.csdn.net/typename
[Google Android dashboards]: https://developer.android.com/about/dashboards/index.html
[http_www.webkit.org]: http://www.webkit.org/
[http_www.chromium.org]: http://www.chromium.org/
[Chrome DevTools]: https://developer.chrome.com/devtools/docs/remote-debugging#debugging-webviews
[SouthEast]: /images/20220717/654a4a9d2dd143a18b59809b01861bd2.png
[SouthEast 1]: /images/20220717/003df8de6ecc4f38ba9dd4cdeb306f69.png
[SouthEast 2]: /images/20220717/e176898ea27643fcaf9cc5e9cfe1d348.png
[SouthEast 3]: /images/20220717/112cfb0df5cc4ceb8b8618ad28bd336e.png
[https_source.android.com]: https://source.android.com/
[http_developer.android.com_reference_android_webkit_WebView.html]: http://developer.android.com/reference/android/webkit/WebView.html