浏览器原理

浏览器的主要组成部分是什么？

• 用户界面 - 包括地址栏、前进/后退按钮、书签菜单等。除了浏览器主窗口显示的您请求的页面外，其他显示的各个部分都属于用户界面。

• 浏览器引擎 - 在用户界面和呈现引擎之间传送指令

• 呈现引擎 - 负责显示请求的内容。如果请求的内容是 HTML, 它就负责解析 HTML 和 CSS 内容，并将解析后的内容显示在屏幕上

• 网络 - 用于网络调用，比如 http 请求。其与平台无关，并为所有平台提供底层实现

• 用户界面后端 - 用于绘制基本的窗口小部件，比如组合框和窗口。其公开了与平台无关的通用接口，而在底层使用操作系统的用户界面方法。

• JavaScript 解释器。用于解析和执行 JavaScript 代码。

• 数据存储。这是持久层。浏览器需要在硬盘上保存各种数据，例如 Cookie。新的 HTML 规范 (HTML5) 定义了“网络数据库”，这是一个完整（但是轻便）的浏览器内数据库。

浏览器是如何渲染 UI 的

1. 浏览器获取 HTML 文件，然后对文件进行解析，形成 DOM Tree

2. 与此同时，进行 CSS 解析，生成 Style Rules

3. 接着将 DOM Tree 与 Style Rules 合并为 Render Tree(渲染树)

4. 接着进入布局(Layout)阶段, 也就是为每个节点分配一个应出现在屏幕上的确切坐标

5. 随后调用 GPU 进行绘制，遍历 Render Tree 的节点，并将元素呈现出来

浏览器如何解析 CSS 选择器

浏览器会 从左往右 解析 CSS 选择器

11道浏览器原理面试题 - 程序员面试官 - 博客园 (cnblogs.com)