必读文章
浏览器的主要功能
-
将用户选择的web资源呈现出来，它需要从服务器请求资源，并将其显示在浏览器窗口中，资源的格式通常是HTML，也包括PDF、image及其他格式。用户用URI（Uniform Resource Identifier统一资源标识符）来指定所请求资源的位置。
浏览器的主要组件
-
用户界面 包括地址栏、后退/前进按钮、书签目录等，也就是你所看到的除了用来显示你所请求页面的主窗口之外的其他部分。
-
浏览器引擎 用来查询及操作渲染引擎的接口。
-
渲染引擎 用来显示请求的内容，例如，如果请求内容为html，它负责解析html及css，并将解析后的结果显示出来。
-
网络 用来完成网络调用，例如http请求，它具有平台无关的接口，可以在不同平台上工作。
-
UI后端 用来绘制类似组合选择框及对话框等基本组件，具有不特定于某个平台的通用接口，底层使用操作系统的用户接口。
-
JS解释器 用来解释执行JS代码。
-
数据存储 属于持久层，浏览器需要在硬盘中保存类似cookie的各种数据，HTML5定义了web database技术，这是一种轻量级完整的客户端存储技术、
渲染引擎
- Firefox使用Geoko——Mozilla自主研发的渲染引擎。
- Safari和Chrome都使用webkit。
- Webkit是一款开源渲染引擎，它本来是为Linux平台研发的，后来由Apple移植到Mac及Windows上。
渲染流程
- 渲染引擎首先通过网络获得所请求文档的内容，通常以8K分块的方式完成。
- 解析html以构建dom树 -> 构建render树 -> 布局render树 -> 绘制render树
- 这个过程是逐步完成的，为了更好的用户体验，渲染引擎将会尽可能早的将内容呈现到屏幕上，并不会等到所有的html都解析完成之后再去构建和布局render树。它是解析完一部分内容就显示一部分内容，同时，可能还在通过网络下载其余内容。
js加载
- 按照 HTML 标准的描述和浏览器 GUI 渲染线程和 JavaScript 引擎线程互斥的特征，加了 async、defer 属性的 script 标签，加载过程是不阻塞html的解析过程的，执行过程仍然会阻塞。
- js在浏览器（chrome）的render进程里面跑，js是单线程语言，js运行机制有同步任务和异步任务之分。
谷歌浏览器chrome
进程
- Browser process：用以协调浏览器的其它进程。负责包括地址栏，书签栏，前进后退按钮等部分的工作；负责处理浏览器的一些不可见的底层操作，比如网络请求和文件访问；
- Renderer Process：负责一个 tab 内关于网页呈现的所有事情（渲染）。
- Plugin Process：负责控制一个网页用到的所有插件，如 flash。
- GPU Process：负责处理 GPU 相关的任务。
进程间的通信
- IPC （Inter Process Communication）：很多应用都会采用这样的设计，如果一个工作进程反应迟钝，重启这个进程不会影响应用其它进程的工作。
相关文章：