技术开发 频道

Web开发者应该了解的WebKit基础知识

  WebKit ports介绍

  • Safari

  Safari的OS X版本和Windows版本是两个不同的移植版本。

  WebKitnightly是基于Safari的Mac OS版本的。稍后详述……

  • Mobile Safari

  是专属维护的分支,但随后就成了主流版本。

  Chrome on iOS(使用的是Apple提供的 WebView,随后会说明它们的不同部分)

  • Chrome (Chromium)

  Chrome onAndroid (直接使用Chromiumport)

  Yandex Browser, 360 Browser, Sogou Browser使用Chromium,还有Opera。

  • Android Browser

  紧跟WebKit的最新版本。

  更多的移值版本: Amazon Silk, Dolphin, Blackberry, QtWebKit,WebKitGTK+, EFL port (Tizen), wxWebKit, WebKitWinCE等。

  不同port的关注不同。Mac port关于于将浏览器从系统中分离,引入Obj-C和C++的绑定(binding)以方便在应用中使用WebKit渲染引擎。Chromium则纯粹关注于浏览器。QtWebKit则为其跨平台应用提供运行时或渲染引擎。

  WebKit浏览器的共性

  所有WebKit ports的共性包括以下部分。(这段作者写了多次,每次都有Chrome工程加以纠正,各项后面的斜体部分。)

  1.WebKit用相同的方式解析HTML。目前只有Chromium支持了多线程的HTML解析(threaded HTMLparsing) 。

  2.使用相同的方式构建DOM Tree. 实际上只有Chromium支持Shadow DOM。

  3.WebKit都会创建一个window 对象和document 对象。 不过可用的属性和建构函数可以通过功能选项来控制。

  4.CSS解析。尽管如此,还是应当让你的CSS遵循CSSOM标准。 Chrome接受-webkit-前缀,相对的Apple和其它ports则接受-khtml-或 –apple-前缀。

  5.排版(Layout)和定位(positioning)。 WebKit包括了Sub-pixel排版和对比排版(saturated layout) 算法但每个port的实现是不同的。

  6.基础是相同的。

  就像Flickr和Github透过flags来指定实现的功能,WebKit允许通过指定编译期功能选项(WebKit’scompile-time Feature Flags)来启用和禁用一系列的功能。还有运行时标志来管理一些功能,通过命令行(command lineswitches (Chromium’s here) 或配置的方式(如about:flags)指定。

  WebKit port共性列表

  • DOM, window, document

  • CSSOM

  • CSS解析, property/value处理

  sans vendorprefix handling

  • HTML parsing and DOM construction

  same if wesuspended belief in Web Components

  • 排版与定位

  Flexbox,Floats, block formatting contexts… all shared

  • Chrome开发工具,也称为WebKit Inspector.

  • 去年四月开始,Safari开始使用自己的Safari Inspector.

  部分功能,如Content Editable, Push State, File API,大部分SVG API, CSS Transform math, Web Audio API, Local Storage

  • 后台(backend)并不相同.比如不同的port会为local storage和Web Audio API使用不同的实现方法。

  • 其它一些功能和特性

  WebKit ports不同的部分

  • GPU的运用

  3D Transforms

  WebGL

  Video解码(decoding)

  • 2D绘制

  Anti-aliasing方法

  SVG & CSS梯度渲染(gradientrendering)

  • 文本渲染和断字处理(rendering & hyphenation)

  • Network stack (SPDY,预读(pre-rendering), WebSocket transport)

  • JavaScript引擎

  WebKit中的JSC(也支持V8),以及Chrome中的V8。

  • 表格(forms)的渲染

  • 音频和视频元素的行为 (包括codec的支持)

  • 图片解码(Image decoding)

  • 导航(Navigating back/forward)

  pushState()的导航部分

  • SSL特性(Strict Transport Security和Public Key Pins)

0
相关文章