浏览器基础知识-浏览器组成

0 阅读6分钟

对浏览器内核的理解(重点)

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

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

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

常见的浏览器内核比较(重点)

Trident

这种浏览器内核是 IE 浏览器用的内核,因为在早期 IE 占有大量的市场份额,所以这种内核比较流行,以前有很多网页也是根据这个内核的标准来编写的,但是实际上这个内核对真正的网页标准支持不是很好。但是由于 IE 的高市场占有率,微软也很长时间没有更新 Trident 内核,就导致了 Trident 内核和 W3C 标准脱节。还有就是 Trident 内核的大量 Bug 等安全问题没有得到解决,加上一些专家学者公开自己认为 IE 浏览器不安全的观点,使很多用户开始转向其他浏览器。

Gecko

这是 Mozilla Firefox 和 Flock 所采用的内核,这个内核的优点就是功能强大、丰富,可以支持很多复杂网页效果和浏览器扩展接口,但是代价是也显而易见就是要消耗很多的资源,比如内存。

Presto

Opera 曾经采用的就是 Presto 内核,Presto 内核被称为公认的浏览网页速度最快的内核,这得益于它在开发时的天生优势,在处理 JS 脚本等脚本语言时,会比其他的内核快3倍左右,缺点就是为了达到很快的速度而丢掉了一部分网页兼容性。

Webkit

Webkit 是 Safari 采用的内核,它的优点就是网页浏览速度较快,虽然不及 Presto 但是也胜于 Gecko 和 Trident,缺点是对于网页代码的容错性不高,也就是说对网页代码的兼容性较低,会使一些编写不标准的网页无法正确显示。WebKit 前身是 KDE(K Desktop Environment)小组的 KHTML 引擎,可以说 WebKit 是 KHTML 的一个开源的分支。

Blink

谷歌在 Chromium Blog 上发表博客,称将与苹果的开源浏览器核心 Webkit 分道扬镳,在 Chromium 项目中研发 Blink 渲染引擎(即浏览器核心),内置于 Chrome 浏览器之中。其实 Blink 引擎就是 Webkit 的一个分支,就像 Webkit 是 KHTML 的分支一样。Blink 引擎现在是谷歌公司与 Opera Software 共同研发,上面提到过的,Opera 弃用了自己的 Presto 内核,加入 Google 阵营,跟随谷歌一起研发 Blink。

常见浏览器所用内核(重点)

  • Chrome 浏览器:统称为 Chromium 内核或 Chrome 内核,以前是 WebKit 内核,现在是 Blink 内核。
  • Opera 浏览器:最初是自己的 Presto 内核,后来加入谷歌大军,从 WebKit 又到了 Blink 内核。
  • Safari 浏览器:WebKit 内核。
  • Mozilla Firefox 浏览器:Gecko 内核,俗称 Firefox 内核。
  • Edge 浏览器:基于 Chromium 内核(包含 Blink 引擎及全套底层设施),与 Chrome 浏览器共享相同的核心代码。
  • IE 浏览器:Trident 内核,也是俗称的 IE 内核。
  • 360浏览器、猎豹浏览器:IE + Chrome 双内核。
  • 搜狗、遨游、QQ 浏览器:Trident(兼容模式)+ Webkit(高速模式)。
  • 百度浏览器、世界之窗浏览器:IE 内核。
  • UC 浏览器:采用自主研发的 U3 内核,基于 WebKit 深度优化,早期版本曾兼容 Trident 内核。
  • 2345浏览器:以前是 IE 内核,现在也是 IE + Chrome 双内核了。

浏览器的主要组成部分(重点)

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

值得注意的是,和大多数浏览器不同,Chrome 浏览器的每个标签页都分别对应⼀个渲染引擎实例。每个标签页都是⼀个独立的进程。

对浏览器的理解

  • 浏览器的主要功能是将用户选择的 Web 资源呈现出来,它需要从服务器请求资源,并将其显示在浏览器窗口中,资源的格式通常是 HTML,也包括 PDF、image 及其他格式。用户用 URI(Uniform Resource Identifier,统一资源标识符)来指定所请求资源的位置。
  • HTML 和 CSS 规范中规定了浏览器解释 html 文档的方式,由 W3C 组织对这些规范进行维护,W3C 是负责制定 Web 标准的组织。但是浏览器厂商纷纷开发自己的扩展,对规范的遵循并不完善,这为 Web 开发者带来了严重的兼容性问题。
  • 浏览器可以分为两部分,shell(外壳)和 内核。其中 shell 的种类相对比较多,内核则比较少。也有一些浏览器并不区分外壳和内核。从 Mozilla Firefox 将 Gecko 独立出来后,才有了外壳和内核的明确划分。
    1. shell:指浏览器的外壳,例如菜单,工具栏等。主要是提供给用户界面操作,参数设置等等。它是调用内核来实现各种功能的。
    2. 内核:是浏览器的核心。内核是基于标记语言显示内容的程序或模块。

总结

本文详细介绍了浏览器的基础知识,包括浏览器内核的组成、常见浏览器内核的比较、常见浏览器所用内核、浏览器的主要组成部分以及对浏览器的整体理解。通过本文的学习,读者可以深入了解浏览器的工作原理和各个组件的功能,为前端开发和浏览器优化提供坚实的理论基础。