# Browser面试题
# 1. 说一下浏览器渲染机制
1.解析HTML生成DOM树
2.解析CSS生成CSSOM规则树
3.将DOM树和CSSOM规则树合并在一起生成渲染树
4.遍历渲染树开始布局,计算每个节点的位置大小信息
5.将渲染树的每个节点绘制到屏幕
# 2. 说一下浏览器事件环
JS是单线程的,JS中的代码都是串行的, 前面没有执行完毕后面不能执行
执行顺序
程序运行会从上至下依次执行所有的同步代码
在执行的过程中如果遇到异步代码会将异步代码放到事件循环中
当所有同步代码都执行完毕后, JS会不断检测 事件循环中的异步代码是否满足条件
一旦满足条件就执行满足条件的异步代码
宏任务和微任务
- 在JS的异步代码中又区分"宏任务(MacroTask)"和"微任务(MicroTask)"
- 宏任务: 宏/大的意思, 可以理解为比较费时比较慢的任务
- 微任务: 微/小的意思, 可以理解为相对没那么费时没那么慢的任务
常见的宏任务和微任务
- MacroTask: setTimeout, setInterval, setImmediate(IE独有)...
- MicroTask: Promise, MutationObserver ,process.nextTick(node独有) ...
注意点: 所有的宏任务和微任务都会放到自己的执行队列中, 也就是有一个宏任务队列和一个微任务队列 所有放到队列中的任务都采用"先进先出原则", 也就是多个任务同时满足条件, 那么会先执行先放进去的
完整执行顺序
1.从上至下执行所有同步代码
2.在执行过程中遇到宏任务就放到宏任务队列中,遇到微任务就放到微任务队列中
3.当所有同步代码执行完毕之后, 就执行微任务队列中满足需求所有回调
4.当微任务队列所有满足需求回调执行完毕之后, 就执行宏任务队列中满足需求所有回调
注意点: 每执行完一个宏任务都会立刻检查微任务队列有没有被清空, 如果没有就立刻清空