浏览器的线程
1. GUI渲染线程
2. 定时器线程
3. 事件监听线程
4. js引擎线程
5. http网络线程
GUI渲染线程的渲染流程
1. 生成DOM Tree
2. 生成 CSS Tree
3. 将DOM Tree和CSS Tree合并成 Render Tree
4. 根据Render Tree计算出每个元素在页面中的位置和从属关系,进行布局
5. 进行渲染显示
6. reflow(回流) 引起整体的布局改变(display,宽高)
7. repating(重绘) 颜色、visibility
异步加载
1. defer属性
2. async属性
区别:defer等待DOM树解析完成后才执行代码
async只要js文件下载就立马执行
3. 按需加载
JS引擎线程
JS内核,也称JS引擎,负责处理执行javascript脚本。这是JS中的主线程,所以JS是单线程的编程语言,但是实际上JS属于单线程异步。异步是由子线程进行完成,主线程负责调度子线程。所以JS不严格的说也也属于多线程的编程语言
与GUI线程是互斥
GUI渲染线程
负责渲染浏览器界面,包括解析HTML、CSS、构建DOM树、Render树、布局与绘制等
当界面需要重绘(Repaint)或由于某种操作引发回流(reflow)时,该线程就会执行
与JS主线程互斥
事件监听线程
用来完成事件处理的,例如:click,mouseover...
计时器线程
负责处理定时器。setInterval和s