认识X5内核

[Tingglelaoo]

Android WebView

在Android 4.4及其以上，Google 采用了**Chromium**(Chrome浏览器引擎)作为系统WebView的底层内核支持。

目前(截至16年5月份)，Android的最新版本为6.0版本(Marshmallow，棉花糖)。

截至16年2月份，根据Google公布的Android 各个系统版本市场占有率(Google Android dashboards)，Android 4.0及其以上系统将近90%左右。意味着我们可以忽略Android2.x带来的兼容性问题。

参考资料：Android 各个版本WebView

X5

• 腾讯基于优秀开源Webkit 深度优化的浏览器渲染引擎

• 为抹平不同 Android 版本不同 Webview 的坑而生。但本身也带来了许多坑。

• 虽然官方不承认，但实际上它是基于Chromuim开源项目的。
  ==== webkit内核以及blink内核在x5的使用情况 ====

• QQ浏览器：6.2版本及以后使用blink内核。

• X5 tbs 1.x：版本号为02xxxx，使用webkit内核。

• X5 tbs 2.x：版本号为03xxxx。使用blink内核。

拓展：Webkit & Chromuim &Chrome & Blink

• WebKit是一个开源的项目，其前身是来源于KDE的KHTML和KJS。该项目专注于网页内容的展示，开发出一流的网页渲染引擎。

• Chromium是一个建立在WebKit之上的浏览器开源项目，由Google发起的。

• ** Chrome**是Google公司的浏览器产品，它基于chromium开源项目。可以理解为，内核是开源的，UI是闭源的。

• Blink是Google退出WebKit项目，从而自己创建的渲染引擎。但并不是全新的引擎，Blink目前就是从WebKit直接复制出一个版本出来，然后将与chromium无关的Ports全部移除掉，将代码结构重新整理，就目前而言，Blink的渲染和WebKit是一样，但是，以后两者将各自走不同的路。

参考资料： 理解WebKit和Chromium

X5升级了

截至16年4月份，x5升级全量发布。
TBS2.0基于Android 5.0 WebView Blink内核（M37版本）适配定制优化，适配Android全部主流平台，可以在所有Android手机上使用Blink的技术能力。具有更好的H5/CSS3支持和性能。TBS2.0已经发布，将逐步在各客户端中静默升级，无需更新微信、手机QQ、QQ空间即可使用最新的TBS2.0 Blink内核。

更简洁地说，即是：

• 基于Blink内核（chrome 37版本）
• 适用于Android全部主流平台
• 静默升级

PS：iOS版本的微信Web View一直是WKWebView内核，WKWebView的版本依赖于iOS的系统版本。

==== TBS2.0内核详情 ====

• BLINK版本: 基于Chrome 37
• HTML版本: HTML5.0
• XHTML版本: xHTML Basic 1.0 | xHTML1.1
• SVG版本: SVG1.2
• WML版本: Wml 1.0
• CSS版本: CSS3
• Spdy版本: 3.1
• 支持的JavaScript版本: Ecma5

Changelog 以及 解读

1.内核从Webkit升级至Blink，拥有更好的支持

那么哪里可以查阅兼容性呢？

X5 CanIUse

2.内核版本号升级到362xx版本。可以根据UserAgent判断当前环境是否已升级到 TBS2.0版本,包含（TBS/03xxxx）字段。

那么怎么查看自己微信里的 TBS 版本？

用微信打开这个页面，检查TBS的版本号，0362xx 表示已更新。
页面的代码只有两句，为：

// 检测页面的核心代码
var resultDiv = document.getElementById('result');
resultDiv.innerHTML = window.navigator.userAgent;

3.CSS3属性支持增强：

• 完整支持flex
• 伪元素支持动画效果
• filter: blur 有模糊效果

PS：更多更具体的支持情况可查阅这里

4.autoplay属性有效，可自动播放

5.canvas支持设置背景色

6.标准的缓存策略，支持Spdy 3.1

7.动画性能提升

8.更好的inspector支持

• 微信远程调试解决方案——微信web开发者工具
• 手机QQ浏览器的远程调试解决方案

参考资料：

• 解读微信全面升级X5 Blink内核，H5游戏行业重大利好
• 官方网站：腾讯浏览服务－技术指南

总结

常用工具

• 检测是否为x5－TBS/03xxxx
• x5的各项支持情况－X5 CanIUse
• Android下微信远程调试工具-微信web开发者工具（PS:iOS下使用Safari远程调试即可）

我们可以从中了解到什么

一、工具方面：

• 可以通过查询UA来检测是否为X5－TBS/03xxxx，在线检测地址
• 想知道某个CSS3属性，或者其他API在X5是否支持的时候，可以查询X5 CanIUse
• 远程调试微信内页面时，在Android下可以使用微信远程调试工具-微信web开发者工具，在iOS下使用Safari远程调试即可。

二、对于开发调试页面

• 目前，暂时还没有查找到X5在微信android客户端的版本分布情况的数据(可能是由于X5 tbs2.0 是今年4月份初才开始全量发布的)。
• 虽然说，X5是静默升级，无需用户手动更新，基本上都实现升级为最新版本(业界说法)，但仍存在X5内核是旧版本的情况(根据是部分测试的检测UA结果)。希望能够在后续的日子可以获取到相关的数据。
• 手机同时安装了QQ浏览器和微信，但QQ浏览器内核版本不等于微信内核版本，只有在QQ浏览器内核为大于等于6.2版本才是Blink内核，调试页面的结果才可以替代在微信内页面调试的结果（想要不登陆微信用QQ浏览器来替代调试的需要注意下

X5的版本分布情况

据腾讯内部的小伙伴告知，x5内核基本覆盖理论上达到100%，但难免会有漏网之鱼。而根据实际数据抽样整理显示，截至2016年5月19日，x5内核基本覆盖率达到91.47%。

[ddzy]

学到了