认识达内从这里开始

用户在访问互联网的时候一般都是通过浏览器来打开网页的，而今天我们就通过案例分析来了解一下，浏览器的组成部分以及渲染方式分析。

浏览器组成部分

用户界面：包括地址栏，前进/后退/刷新/书签等按钮

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

渲染引擎：用来绘制请求的内容

网络：用来完成网络调用，例如http请求，它具有平台无关的接口，可以在不同平台上工作

JavaScript解释器：用来解析执行JavaScript代码

用户界面后端：用于绘制基本的窗口小部件，比如组合框和窗口，底层使用操作系统的用户接口

数据存储：属于持久层，浏览器在硬盘中保存类似cookie的各种数据，HTML5定义了webdatabase技术，这是一种轻量级完整的客户端存储技术

注意：与大多数浏览器不同的是，谷歌(Chrome)浏览器的每个标签页都分别对应一个呈现引擎实例。每个标签页都是一个独立的进程

浏览器包含哪些进程

浏览器进程

浏览器的主进程(负责协调、主控)，该进程只有一个

负责浏览器界面显示，与用户交互。如前进，后退等

负责各个页面的管理，创建和销毁其他进程

将渲染(Renderer)进程得到的内存中的Bitmap(位图)，绘制到用户界面上

网络资源的管理，下载等

三方插件进程

负责管理三方插件

GPU进程

负责3D绘制与硬件加速(多一个)

渲染进程

负责页面文档解析，执行与渲染

渲染进程包含哪些线程

GUI渲染线程

主要负责解析HTML，CSS，构建DOM树，布局，绘制等

该线程与JavaScript引擎线程互斥，当执行JavaScript引擎线程时，GUI渲染线程会被挂起，当任务队列空闲时，主线程才会执行GUI渲染

JavaScript引擎线程

主要负责处理JavaScript脚本，执行代码(如V8引擎)

浏览器同时只能有一个JS引擎线程在运行JS程序，即JS是单线程的

JS引擎线程与GUI渲染线程是互斥的，所以JS引擎会阻塞页面渲染

定时触发器线程

负责执行定时器函数(setTimeout，setInterval)

浏览器定时计数器并不是由JS引擎计数的(因为JS是单线程的，如果处于阻塞状态就会影响计数器的准确性)

通过单独线程来计时并触发定时(计时完毕后，添加到事件触发线程的事件队列中，等待JS引擎空闲后执行)，这个线程就是定时触发器线程，也叫定时器线程

W3C在HTML标准中规定，规定要求setTimeout中低于4ms的时间间隔算为4ms

事件触发线程

负责将准备好的事件交给JS引擎线程执行

当事件被触发时，该线程会把对应的事件添加到待处理队列的队尾，等待JS引擎处理

异步请求线程

在XMLHttpRequest连接后浏览器会开一个线程

检测请求状态变更时，如果有对应的回调函数，异步请求线程就会产生状态变更事件，并把对应的回调函数放入队列中等待JS引擎执行

【免责声明】：本内容转载于网络，转载目的在于传递信息。文章内容为作者个人意见，本平台对文中陈述、观点保持中立，不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请加danei0707学习了解。欢迎关注“达内在线”参与分销，赚更多好礼。