• 浏览器原理_浏览器原理

 

 

声明

本文参考自https://www.html5rocks.com/zh/tutorials/internals/howbrowserswork/整理

组成

浏览器原理_浏览器原理_02

用户界面(User interface )

包括地址栏、前进/后退按钮、书签菜单等,换句话说, 除了浏览器主窗口显示的是请求页面,其他显示的各个部分都属于User interface范畴

Browser engine (浏览器引擎)

承上启下,在User interface和 Rendering engine之间传送指令

Rendering engine (渲染引擎)

顾名思义,渲染,以html+css为例,该引擎将html和css分别解析成dom树和样式树,并将其最终渲染结果呈递在界面上

Networking (网络)

用于网络调用,比如 HTTP 请求。其接口与平台无关,并为所有平台提供底层实现。

UI Backend (用户界面后端)

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

JavaScript interpreter(JavaScript 解释器)

JavaScript 解释器,用于解析和执行 JavaScript 代码,知名的是谷歌的V8引擎

Data persistence (数据存储)

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

渲染引擎工作流程

浏览器原理_其他_03

html解析

  • W3C
    浏览器原理_浏览器原理_04

css解析

浏览器原理_浏览器原理_05

容错机制

任何浏览器基本都有自己的容错机制,但基本都一样。
即使html标签书写错误(错误嵌套,标签未封闭),整个界面也不会直接崩掉
容错机制是浏览器内部处理的,用户看不到这个处理过程

事件循环

详见 这里