简介编辑本段回目录
WebKit是开源的Web浏览器引擎，苹果的Safari、谷歌的Chrome浏览器都是基于这个框架来开发的。WebKit 还支持移动设备和手机，包括iPhone和Android手机都是使用WebKit做为浏览器的核心。
WebKit 是一个开源项目，其起源可追溯到 K Desktop Environment (KDE)。WebKit 项目催生了面向移动设备的现代 Web 应用程序。虽然设备本身的能力和形态因素都相当重要，但移动用户最热衷的仍然是内容。如果移动用户可用的内容只是 Internet 用户可用内容的一个很小的子集，那么用户体验充其量也只能划分为二等。
WebKit 还应用在了桌面的 Safari 浏览器内，该浏览器是 Mac OS X 平台默认的浏览器。不管我们讨论的是桌面版本还是 iPhone 或 Android 上的浏览器引擎，WebKit 均优先支持 HTML 和 CSS 特性。实际上，WebKit 还支持尚未被其他浏览器采纳的一些 CSS 样式 — 这些特性正在得到 HTML5 规范的考虑。
HTML5 规范是一个技术草案集，涵盖了各种基于浏览器的技术，包括客户端 SQL 存储、转变、转型、转换等。HTML5 的出现已经有些时间了，虽然尚未完成，但是一旦其特性集因主要浏览器平台支持的加入而逐渐稳定后，Web 应用程序的简陋开端将成为永久的记忆。Web 应用程序开发将成为主导 — 并且不只是在传统的桌面浏览器空间，还将在移动领域。移动将一跃成为首要考虑，而不再是后备之选。
三大浏览器共同采用WebKit 有望打造新web帝国编辑本段回目录
美国新闻聚合网站BuzzFeed编辑约翰·赫尔曼(John Herrman)周三撰文称，Opera改用WebKit渲染引擎后，全球浏览器市场将由WebKit所主导。最终，微软也别无他选。 以下为文章主要内容：作为为数不多的几家独立浏览器厂商之一，Opera周三宣布将调整Opera浏览器显示互联网的方式：即放弃自己的渲染引擎Presto，改用WebKit渲染。
当前，谷歌Chrome和苹果Safari浏览器均采用WebKit渲染引擎。此外，作为最受欢迎的两款移动浏览器，iPhone和iPad采用的移动版Safari，以及Android系统默认浏览器同样基于WebKit技术。
换言之，WebKit已主导浏览器市场：
WebKit是唯一一个市场份额持续增长的主要渲染引擎，目前Chrome、Safari都支持WebKit
在过去的一年中，全球市场份额持续增长的Chrome和Safari采用WebKit，而没有采用WebKit渲染引擎的Mozilla和IE市场份额持续下滑
WebKit成为移动浏览器的代名词：
全球移动设备的份额不断增长，而桌面电脑的份额持续下滑
现在可以说：WebKit赢了
这意味着在不久的将来，创建一个网站将与以往不同：开发人员无需再考虑网站是否与基于四种不同渲染引擎的九款浏览器是否兼容，而只需与WebKit相兼容即可；他们将使用WebKit技术开发应用，而不是采用Web技术开发网站。换言之，该过程将变得越来越像为一个移动应用商店开发应用，好比为iPhone 开发应用而又无需经过人工授权。这并不意味着Web应用时代即将带来，但却意味着这一天终将到来。
WebKit主导浏览器市场同时意味着当前的许多Web标准将被淘汰。在万维网联盟(W3C)标准最受开发人员青睐年代，Web标准主导该市场。但当WebKit成为主流时，市场主导权就转向 WebKit和基于WebKit的浏览器。从国际关系方面而言，W3C相当于联合国，而WebKit则是一个日益壮大的帝国，控制着大部分成员国。
此举将改变新Web功能的生成方式，Web开发人员彼得-保罗·科赫(Peter-Paul Koch)对此解释道：
“将来，Opera支持特定标准的权力将被削弱。他们仍可以继续向WebKit添加功能，但不可能像为自己的Presto渲染引擎添加功能那样方便。WebKit涉及到许多厂商，对于标准提议，其他相关方可能持不同意见。”
“对于W3C而言，一项新功能仅在一款或两款WebKit浏览器上部署，是否算是互操作呢？我不知道，相信W3C也弄不清楚。如今，这个问题突然变得很重要。”
对于几十年来一直在判断哪些是HTML的一部分、哪些不是的机构而言，他们正面临着生存危机。WebKit渐成主流意味着，作为该项技术的两家最大赞助商，谷歌和苹果将决定哪些是Web的一部分，哪些又不是。
面临这种生存危机的还有微软，早在IE6成为全球最受欢迎浏览器时，微软就致力于将专属Web标准推广成为主流。
WebKit成为主流究竟意味着什么，最有力的回答可能莫过于微软的担忧。微软去年11月在一篇博客中称表示：“你可能只在针对iOS或Android进行优化的网站上使用WebKit。”但微软如今却表现出一丝绝望，称“让WebKit优化的站点支持IE10很容易。”
这篇博客没有说微软何时将改用WebKit，但最终可能别无他选。
Webkit内核探究编辑本段回目录
研究Webkit内核已经有一段时间了，在这期间我花了很多时间去研读webkit代码，并在网上查阅了不少的资料。在这之后，我开始尝试对Webkit内核进行剪裁，以便得到自己所需的部分。
俗语有言，“独学而无友 则孤陋而寡闻”，遂本着交流的态度拿出来与大家分享之，顺便回顾一下自己这段时间以来走过的路。到目前，本人虽不能说是精 通Webkit内核 ，但也总算是在Webkit内核中游历过了一番，并获得了不少Webkit内核代码的直接经验。
在此，我将以Webkit内核代码为基础，详细介绍Webkit内核的组成以及其各个模块的功能和实现。文章写到哪算哪，有了新的认识也会更新，补充。
什么是Webkit
Wekbit是一个开源的Web浏览器引擎，也就是浏览器的内核。Apple的Safari, Google的Chrome, Nokia S60平台的默认浏览器，Apple手机的默认浏览器，Android手机的默认浏览器均采用的Webkit作为器浏览器内核。Webkit的采用程度由 此可见一斑，理所当然的成为了当今主流的三大浏览器内核之一。另外两个分别是Gecko和Trident，大名鼎鼎的Firefox便是使用的Gecko 内核，而微软的IE系列则使用的是Trident内核。虽然目前市场上IE内核浏览器仍然占据大多数市场份额，但其他内核浏览器也大有后来居上之势。其 中,Webkit作为一款优秀的浏览器内核，它众多优秀的特性引起业内的的广泛关注。尤其是近来，google的加入更是让Webkit有所升温，从 Goole Chrome浏览器, Goole Anroid手机操作系统内置浏览器均采用Webkit作为内核， 近来推出的Chrome OS更是让人期待。从实现角度来讲，据说其比Gecko代码更为整洁清晰，我目前还没研究过Gecko的代码，所以还无从比较。
Wekbit做了什么？
作为浏览器的内核，Webkit做了哪些工作？为了了解这些，先让我们来看下一个Web浏览器究竟做了什么。我们可以从输入输出的角度来看一个 Web浏览器为我们做了哪些工作。先看一个简单的例子，Web浏览器的输入是一个HTML文档，输出则是一个我们用眼睛所看到的一个Web页面, 就普通用户而言它的输入和输出就是这么简单，如下图所示。
那么Webkit的输入和输出又是什么呢？如果能明白这个，那我们就能很清楚的知道Webkit到底是做什么的了。不过现在要说清楚这个还有点困 难，因为Webkit的输出就要复杂些了，因为它的输出本来就非直接面向用户，现在简单点来说，Webkit的输入是web 文档，输出是一些看不见的模型，浏览器上层借助于这些模型来绘制出我们所看到的实际页面。后面适当的时候会更具体的探讨这些模型。
Wekbit组成
Webkit实际上包含三大部分，至少从代码结构上来说是这样的，当然，如果细分的话还能够划分出更多的模块。如下图所示
其中，WebCore是Webkit的核心部分，它实现了对文档的模型化，包括了CSS, DOM, Render等的实现， JavaSript Core显然是对JavaSript支持的实现。而橘黄色标注的Webkit部分包含了很多不同平台对Webkit封装的实现，即抽象出了与浏览器所能直 接对应的一些概念的实现，如，WebView,WebPage, WebFrame等。这三部分共同构成了Webkit, 在源码中，它们分别对应这个这三个目录， 即Webkit三大部分为WebCore, JavaSript Core,Webkit。
应用程序如何利用Webkit的
从下图可以看出，利用Webkit的应用程序的位置处于Webkit模块之上，应用程序并不直接和WebCore以及JavaScript Core来打交道，也不需要和它们打交道，而是同我前面提到过的Webkit模块来交互，从而屏蔽了WebCore和JavaSript Core部分。Webkit模块实际上抽象出了大多数应用程序所需要的那一部分，这里所说的大多数应用程序其实就是指的浏览器， 对于实现一个浏览器而言，Webkit模块所提供的接口已经足够。不过对于某些应用，可能得对其实施一定的改造，但是话又说回来，Webkit本来就是被设计成为Browser的内核而被实现的。
看到这里，也就是说如果我们要想利用Webkit来实现一个功能完善Browser或其他类浏览器应用程序的话，你只需要了解Webkit模块部分 就足够了，更确切的说只需要了解它所提供的接口就够了。事实上，大多数平台，如果采用了Webkit内核作为浏览器内核组件的话，所提供的对应文档部分都 是关于Webkit模块所提供的接口的描述。很多平台都提供了Browser组件，其使用方法就像是其他可视组件一样，在应用程序中应用起来非常方便。比 如，某平台提供了叫做WebView的可视化组件，我们就可以通过如下几行代码来展示一个网页， 使用的代码仅仅三行。
WebView *view = new WebView();
view->load(Url("http://www.google.cn"));
view->show();
以Webkit作为浏览器组件的平台有不少，包括Symbian S60, Android, Qt, GTK等等，前不久看到消息，好像Black Berry也准备在自家的手机上使用Webkit了。
CSS在Webkit中的实现属于相对独立的一个模块，注意这里说的是相对。
CSS在Webkit中的作用自然是不言而喻的，在Web早期，文档的结构和样式还未分离的那个时代，HTML担负了文档的结构和样式这两个双重任 务，即HTML既负责文档的结构，同时文档的样式也通过HTML中通过标签的属性来指定。可想而知，在那个时候HMTL页面的开发和使用比起现在而言是多 么的不便。
不过仔细想想，这恐怕与当时的技术发展程度有着很大大关，首先，那个时候互联网远不像现在这样普及，另外，网页也远不如现在这样复杂，不像现在， 可以说，世界上信息的主要传播方式是以网页形式出现的，没数据说明，但我觉得至少趋势是这样的。 就这样，互联网在不断的前进之中，直到后来CSS的出现，大大的改进了Web的开发模式，从此，文档的结构和样式被清晰的一分为二。HTML主要负责文档 的结构，而CSS则担负着文档的样式指定。
关于CSS的介绍网上已经有很多了，在这里将主要从Webkit实现的角度对其进行介绍。
CSS是什么
CSS是Cascading Style Sheets的缩写，按照官方定义，它可以被认为是一个样式表语言，它允许用户通过它来为结构化文档(HTML文档)指定样式。通过使用CSS用户可以将文档的内容和样式分离，从而简化Web页面的开发和维护。
既然说它是一个样式表语言，那么它就有相应的语法规则，规定了如何如何来书写一个样式表，让其作用与文档内容达到书写者想要的外观。CSS的语法规 则是比较简单的， 自顶向下的来看，一个级联样式表(CSS)是由一系列的规则(rule)组成的, 每一条规则又是由一个选择器(selector)和若干条声明(Declearation)组成的。每条声明(Declearation)又是一个键值 对，由属性(property)和值(value)来组成，如下图所示。
原图片出处:http://dabrook.org/cc/Basic-Anatomy-of-a-CSS-Rule.png
从这里可以看到，语法是很简单的，使用起来也确实很简单。注意，我在这里只是说使用简单，就跟铅笔一样，谁都会用，铅笔的使用当然是简单的不能再简 单了，但是就是这样普通的工具，在专业人士和普通人的手里所能创造出的东西是截然不同的。所以我想说的是，你能很快的学会如何使用CSS并不代表你编织出 漂亮的网页，它只是一个工具，能发挥到什么程度还得看人。
转回来，从其简单的语法来看，似乎是只要简单的将其转化为对应的程序设计模型即可，但实际中，CSS的实现还是比较复杂的，其复杂性就在于，CSS 本身的复杂程度，它定义了一系列的规则来决定为哪些元素来指定样式，以及样式的继承关系，哪些是继承的，哪些是非继承的，以及作用于同一个元素的多个样式 的叠加，还有就是它对所有能指定的样式都有完整的对应的属性集。所以从实现的角度来看，一个完整的，兼容于标准的CSS实现，需要顾及到的东西还是很多 的。
CSS实现模型
webkit css部分的实现代码为于目录webcore/css中，算是webkit中一个相对独立的模块，下面类图是我为了更好的了解css实现所作，大致勾勒出了CSS的内部实现。
用户所书写的css文档，最终会转化为webkit内部的模型表示，这里有几个比较重要的类。
(待续...)
CSS默认样式表
从Webkit CSS的实现可以看到，即使你不指定任何样式表，实际上当CSS模块运作起来的时候，它都会载入几张默认的样式表，要知道，在 CSSStyleSelector的构造函数中，总是会调用loadDefaultStyle()这个函数，其作用就是载入默认的样式表。
这些默认的样式表包含了一些HTML元素的最基本的样式信息。相信在使用css的用户中，大多数人都不会在对<div>指定样式的时候 会为其添加一条display:block吧，是啊，几乎所有使用css html的人都知道div是一个块级元素，所以没人会多此一举，但是通过了解其CSS模块的具体实现，我们可以知道，这些个默认的样式表其实就已经为我们 指定了一系列我们认为的想当然的规则。
这四个默认样式表是
- html4UserAgentStyleSheet
- quirksUserAgentStyleSheet
- svgUserAgentStyleSheet
- sourceUserAgentStyleSheet
额，从名字上大致也能够了解1, 2了吧，它们不是以文件形式存储，而是在CSS中以字符数组的形式出现，也就是说作为数据编到代码里面去了，应该是考虑到每次都要使用默认样式表而为了减少I/O造成的性能损失。
为了说明我前面所说的，这些默认样式表描述的都是些个关于HTML元素的最基本的信息，还是来看个例子吧，
比如说html4UserAgentStyleSheet，从名字上可以看到，这张应该就是传说中的浏览器默认样式表了。看看都有些啥吧，这里只截取个片段。
1 html { 2 display: block 3 } 4 5 head { 6 display: none 7 } 8 9 meta {10 display: none11 }12 13 title {14 display: none15 }16 17 link {18 display: none19 }20 21 style {22 display: none23 }24 25 script {26 display: none27 }28 29 body {30 display: block;31 margin: 8px32 }33 34 p {35 display: block;36 margin: 1.0__qem 0px37 }38 39 div {40 display: block41 }42 43 layer {44 display: block45 }
