打开一个页面，浏览器会打开至少 4 个进程：浏览器主进程，Gpu进程，渲染进程，网络进程。而且如果是标签页（同站点网页）还会共用一个渲染进程。以下是chrome浏览器的进程详情：
浏览器的渲染流程图：
接下来主要讲解的是渲染进程。
渲染进程是多线程的，它主要包含了以下六个线程：GUI线程，js引擎线程，定时器触发线程，事件触发线程，异步http请求线程，合成线程，io线程。
GUI渲染线程
负责渲染浏览器界面，解析HTML，CSS，构建DOM树和RenderObject树，布局和绘制等，当界面需要重绘（Repaint）或由于某种操作引发回流(reflow)时，该线程就会执行。
注意⚠️：GUI渲染线程与JS引擎线程是互斥的，当JS引擎执行时GUI线程会被挂起（相当于被冻结了），GUI更新会被保存在一个队列中等到JS引擎空闲时立即被执行。
JS引擎线程
（例如V8引擎）JS引擎线程负责解析Javascript脚本，运行代码。JS引擎一直等待着任务队列中任务的到来，然后加以处理，一个Tab页（renderer进程）中无论什么时候都只有一个JS线程在运行JS程序
注意：GUI渲染线程与JS引擎线程是互斥的，所以如果JS执行的时间过长，这样就会造成页面的渲染不连贯，导致页面渲染加载阻塞。
事件触发线程
归属于浏览器而不是JS引擎，用来控制事件循环。当JS引擎执行代码块如setTimeOut时（也可来自浏览器内核的其他线程,如鼠标点击、AJAX异步请求等），会将对应任务添加到事件线程中，当对应的事件符合触发条件被触发时，该线程会把事件添加到待处理队列的队尾，等待JS引擎的处理。
主线程接收到点击事件,把信息给 IO 线程，IO线程会将点击事件包装成任务添加到事案件线程中。当对应的任务符合触发条件时，就将任务添加到消息队列里面供 js引擎 处理。
注意⚠️：由于JS的单线程关系，所以这些待处理队列中的事件都得排队等待 JS引擎处理 （当JS引擎空闲时才会去执行）
定时触发器线程
传说中的setInterval与setTimeout所在线程
浏览器定时计数器并不是由 JavaScript引擎 计数的,（因为JavaScript引擎是单线程的, 如果处于阻塞线程状态就会影响记计时的准确）
因此通过单独线程来计时并触发定时（计时完毕后，添加到事件队列中，等待JS引擎空闲后执行）
注意，W3C在HTML标准中规定，规定要求setTimeout中低于4ms的时间间隔算为4ms。（也就是0ms也算4ms）
异步http请求线程
在XMLHttpRequest连接后是通过浏览器新开一个线程请求
将检测到状态变更时，如果设置有回调函数，异步线程就产生状态变更事件，将这个回调再放入事件队列中。再由JavaScript引擎执行。
合成线程
浏览器的渲染流程： html转化成dom，css转化成cssom，他们组成渲染树，然后进入布局阶段，分层，绘制，分块，光栅化，合成。
GUI渲染线程: html转化成dom，css转化成cssom，他们组成渲染树，然后进入布局阶段，分层，绘制
合成线程： 会将绘制所得的指令列表拆分成 256256 或者 512512 的图块，然后将图块放到光栅化线程池里面转化成位图。
在GUI渲染线程后执行，将GUI渲染线程生成的带绘制列表转换为位图。
IO线程
用来和其他进程进行通信，例如： 网络进程下载完成以后就会将信息发送给 IO 线程，通过IPC 通信。当用户点击页面按钮，浏览器主线程就会把这个信息通过 IPC 发送给 IO 线程。IO 线程会将这个时间包装成任务添加到消息队列里面，供事件循环机制不断处理。
