浏览器是如何工作的？
浏览器分为三大块：
用户界面：用户可以直接操作的界面
浏览器引擎：
渲染引擎：分为网络进程和JS解析器
什么是进程、线程？
进程：进行资源分配和调度的基本单元，可以申请和调度计算机资源。
线程：运算调度的最小单位。一个进程中可以并发多个线程，每条线程并行执行不同的任务。
浏览器中分为多个不同的进程，可以同时进行。这样能够避免一个线程出现卡顿，导致其他线程等待的问题。
浏览器中分为哪些进程？
浏览器进程 控制除了标签页外的用户界面
网络进程 接受或发起网络服务请求
GPU进程 负责整个浏览器界面的渲染
插件进程（例如Flash）负责控制网站使用的所有插件
渲染进程 显示tab标签内的所有内容
浏览器如何解析网站页面的？
1.如果是关键词，则通过默认搜索引擎进行查询
2.首先由UI界面捕获url地址，
然后发起一个网络进程，
请求DNS服务器，
进行域名解析
3.如果是Chrome浏览器，访问站点前会执行SafeBrowsing进行安全监测。查看网点是否在其危险名单中。会给予用户提示，用户也可继续行进访问。
4.UI进程会创建一个渲染器进程来渲染页面。UI将数据通过IPC管道传递给渲染器。
5.主进程解析HTML，构建DOM树，创建document对象。
（什么是DOM？
DOM是依据HTML文档，而构建的数据结构对象。为JS的操作提供API）
6.如果此时遇到script标签，则会暂停解析HTML文档，而去解析js文件并执行。因为浏览器并不知道，是否在js代码中，有例如“document.write”这种对文档元素进行修改的代码。
7.解析CSS样式。获得layout布局中，元素节点的位置大小等样例。
8.通过遍历DOM树和计算好的样式，构成layout tree。
layout tree中每个节点都记录了元素的x,y和layout尺寸。
其中，dom树和layout树并不是一一对应的。
设置了“display:none;”的节点不会出想在layout tree上。伪类中的content元素会出现在layout tree中，而不会出现在dom tree上。因为dom解析HTML获得，并不关心样式。而layout tree根据dom树和计算的样式构成。
9.主线程遍历layout tree构建回执记录表。记录绘制顺序。
因为，“z-index:;”样式设置会改变样式位置，所以浏览器需要获取渲染顺序，以便渲染不会出错。
10.接着进行图层栅格化。（栅格化：将元素点放置在屏幕上）
早期的栅格化，是将多个图层叠加在浏览器显示区域，用户滚动新的区域在进行页面的更新渲染。
这样的好处是能较快的渲染出用户需要看到的界面，但类似懒加载的处理方式，可能会由于渲染时间过长而出现白屏等卡顿情况。
新的栅格化方案是通过将元素点分为几个图层，再将图层进行合成在一起的方式。
11.综上所述：
主线程会遍历layout tree ，生成layer Tree，然后将layer tree通过IPC床底给合成器线程
合成器线程，会将每个图层栅格化。然后将他们切割成小块传递给栅格线程，栅格处理后的的图块存储在GPU内存中；接着栅格线程将draw quads（存储的每个小图块在页面中的位置、内存地址等信息）给合成器线程生成合成器帧，通过IPC传递给GPU，GPU再渲染到屏幕。
随着页面的更新，GPU会不断生成新帧显示到屏幕上。