浏览器组成

1.对浏览器的理解

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

HTML 和 CSS 规范中规定了浏览器解释 html 文档的方式, 由 W3C 组织对这些规范进行维护, W3C 是负责制定 web 标准的组织。但是浏览器厂商纷纷开发自己的扩展, 对规范的遵循并不完善, 这为 web 开发者带来了严重的兼容性问题。

浏览器可以分为两部分, shell 和 内核。其中 shell 的种类相对比较多, 内核则比较少。也有一些浏览器并不区分外壳和内核。从 Mozilla 将 Gecko 独立出来后, 才有了外壳和内核的明确划分。

• shell 是指浏览器的外壳：例如菜单, 工具栏等。主要是提供给用户界面操作, 参数设置等等。它是调用内核来实现各种功能的。
• 内核是浏览器的核心。内核是基于标记语言显示内容的程序或模块。

2.对浏览器内核的理解⭐️

浏览器内核主要分成两部分：

• 渲染引擎的职责就是渲染, 即在浏览器窗口中显示所请求的内容。默认情况下, 渲染引擎可以显示 html、xml 文档及图片, 它也可以借助插件显示其他类型数据, 例如使用 PDF 阅读器插件, 可以显示 PDF 格式。
• JS 引擎：解析和执行 javascript 来实现网页的动态效果。

最开始渲染引擎和 JS 引擎并没有区分的很明确, 后来 JS 引擎越来越独立, 内核就倾向于只指渲染引擎。

3.常见的浏览器内核比较⭐️

• Trident： 这种浏览器内核是 IE 浏览器用的内核, 因为在早期 IE 占有大量的市场份额, 所以这种内核比较流行, 以前有很多网页也是根据这个内核的标准来编写的, 但是实际上这个内核对真正的网页标准支持不是很好。但是由于 IE 的高市场占有率, 微软也很长时间没有更新 Trident 内核, 就导致了 Trident 内核和 W3C 标准脱节。还有就是 Trident 内核的大量 Bug 等安全问题没有得到解决, 加上一些专家学者公开自己认为 IE 浏览器不安全的观点, 使很多用户开始转向其他浏览器。
• Gecko： 这是 Firefox 和 Flock 所采用的内核, 这个内核的优点就是功能强大、丰富, 可以支持很多复杂网页效果和浏览器扩展接口, 但是代价是也显而易见就是要消耗很多的资源, 比如内存。
• Presto： Opera 曾经采用的就是 Presto 内核, Presto 内核被称为公认的浏览网页速度最快的内核, 这得益于它在开发时的天生优势, 在处理 JS 脚本等脚本语言时, 会比其他的内核快3倍左右, 缺点就是为了达到很快的速度而丢掉了一部分网页兼容性。
• Webkit： Webkit 是 Safari 采用的内核, 它的优点就是网页浏览速度较快, 虽然不及 Presto 但是也胜于 Gecko 和 Trident, 缺点是对于网页代码的容错性不高, 也就是说对网页代码的兼容性较低, 会使一些编写不标准的网页无法正确显示。WebKit 前身是 KDE 小组的 KHTML 引擎, 可以说 WebKit 是 KHTML 的一个开源的分支。
• Blink： 谷歌在 Chromium Blog 上发表博客, 称将与苹果的开源浏览器核心 Webkit 分道扬镳, 在 Chromium 项目中研发 Blink 渲染引擎(即浏览器核心), 内置于 Chrome 浏览器之中。其实 Blink 引擎就是 Webkit 的一个分支, 就像 webkit 是KHTML 的分支一样。Blink 引擎现在是谷歌公司与 Opera Software 共同研发, 上面提到过的, Opera 弃用了自己的 Presto 内核, 加入 Google 阵营, 跟随谷歌一起研发 Blink。

4.常见浏览器所用内核⭐️

5.浏览器的主要组成部分⭐️

• ⽤户界⾯ 包括地址栏、前进/后退按钮、书签菜单等。除了浏览器主窗⼝显示的您请求的⻚⾯外, 其他显示的各个部分都属于⽤户界⾯。
• 浏览器引擎 在⽤户界⾯和呈现引擎之间传送指令。
• 呈现引擎 负责显示请求的内容。如果请求的内容是 HTML, 它就负责解析 HTML 和 CSS 内容, 并将解析后的内容显示在屏幕上。
• ⽹络 ⽤于⽹络调⽤, ⽐如 HTTP 请求。其接⼝与平台⽆关, 并为所有平台提供底层实现。
• ⽤户界⾯后端 ⽤于绘制基本的窗⼝⼩部件, ⽐如组合框和窗⼝。其公开了与平台⽆关的通⽤接⼝, ⽽在底层使⽤操作系统的⽤户界⾯⽅法。
• JavaScript 解释器。⽤于解析和执⾏ JavaScript 代码。
• 数据存储 这是持久层。浏览器需要在硬盘上保存各种数据, 例如 Cookie。新的 HTML 规范 (HTML5) 定义了“⽹络数据库”, 这是⼀个完整(但是轻便)的浏览器内数据库。

值得注意的是, 和⼤多数浏览器不同, Chrome 浏览器的每个标签⻚都分别对应⼀个呈现引擎实例。每个标签⻚都是⼀个独⽴的进程。