（整理自网络）

---

一、四种浏览器内核

浏览器核心的种类大约只有三到四个，它们分别是：Trident、Gecko、WebKit和Presto。

1、Trident核心，代表产品Internet Explorer

Trident只能应用于Windows平台，且是不开源的。

2、Gecko核心，代表作品Mozilla Firefox

Gecko是一套开放源代码的、以C++编写的网页排版引擎。

3、WebKit核心，代表作品Safari、Chrome

webkit 是一个开源项目主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。主要代表作品有Safari和Google的浏览器Chrome。

4、Presto核心，代表作品Opera

速度最快的引擎，这也是Opera被公认为速度最快的浏览器的基础。

壳子浏览器：

自己本身不带内核，而是直接调用本机其他浏览器的内核，来实现浏览的功能。

由于IE浏览器在国内的普及率非常高，所以造成了很多网上银行和支付系统只支持IE的Trident内核，其他浏览器访问根本无法进行正常支付和转账等业务。很多浏览器开发商就运用了壳子浏览器的特性推出了“双核”浏览器，带有两种浏览模式，其原理就是本身带一内核，开启兼容模式后，调用本机上的ie内核，来实现双引擎功能。

二、浏览器的主要功能

浏览器的主要功能是将用户选择的web资源呈现出来，它需要从服务器请求资源，并将其显示在浏览器窗口中，资源的格式通常是HTML，也包括PDF、image及其他格式。用户用URI（Uniform Resource Identifier统一资源标识符）来指定所请求资源的位置，在网络一章有更多讨论。

HTML和CSS规范中规定了浏览器解释html文档的方式，由W3C组织对这些规范进行维护，W3C是负责制定web标准的组织。

三、浏览器的主要构成

1. 用户界面 － 包括地址栏、后退/前进按钮、书签目录等，也就是你所看到的除了用来显示你所请求页面的主窗口之外的其他部分。

2. 浏览器引擎 － 用来查询及操作渲染引擎的接口。

3. 渲染引擎（上文提到的浏览器内核） － 用来显示请求的内容，例如，如果请求内容为html，它负责解析html及css，并将解析后的结果显示出来。

4. 网络 － 用来完成网络调用，例如http请求，它具有平台无关的接口，可以在不同平台上工作。

5. UI后端 － 用来绘制类似组合选择框及对话框等基本组件，具有不特定于某个平台的通用接口，底层使用操作系统的用户接口。

6. JS解释器 － 用来解释执行JS代码。

7. 数据存储 － 属于持久层，浏览器需要在硬盘中保存类似cookie的各种数据，HTML5定义了web database技术，这是一种轻量级完整的客户端存储技术

渲染引擎很重要，单独详细介绍一下：

渲染引擎首先通过网络获得所请求文档的内容，在取得内容之后的基本流程：

a. 解析html以构建dom树

渲染引擎开始解析html，并将标签转化为内容树中的dom节点。接着，它解析外部CSS文件及style标签中的样式信息。

b. 构建render树

Render树由一些包含有颜色和大小等属性的矩形组成，它们将被按照正确的顺序显示到屏幕上。

（关于render树：

浏览器在构造DOM树的同时也在构造着另一棵树Render Tree,与DOM树相对应叫它Render树，我们知道DOM树为javascript提供了一些列的访问接口（DOM API），但这棵树是不对外的。它的主要作用就是把HTML按照一定的布局与样式显示出来，用到了CSS的相关知识。

每一个Render树的节点称之为renderer或者render object，renderer包含了一个dom对象以及它的样式。

具体显示的时候，每一个renderer体现了一个矩形区块的东西，即我们常说的CSS盒子模型的概念，它本身包含了一些几何学相关的属性，如width，position，display等。

可以这么说，没有DOM树就没有Render树，但是它们之间可不是简单的一对一的关系。我们已经知道了render树是用于显示的，那不可见的元素当然不会在这棵树中出现了，譬如<header>。）

c.  布局render树 

确定每个节点在屏幕上的确切坐标。

d.  绘制render树

即遍历render树，并使用UI后端层绘制每个节点。

虽然abcd这个过程是逐步完成的，但为了更好的用户体验，渲染引擎将会尽可能早的将内容呈现到屏幕上，并不会等到所有的html都解析完成之后再去构建和布局render树。它是解析完一部分内容就显示一部分内容