function test () {
console.count('Promise Resolve');
ret = Promise.resolve().then(test);
return ret;
}
console.log(1);
test();
console.log(2);
上面这段代码：
执行结果是什么，为什么？
微任务一次执行几条、宏任务一次执行几条？
2.有个数列，其中有一个数字出现超过了一半，如何快到找到它？ [1,2,1,3,1,2,1] 结果： 1 分析： 数组长度是：7 只有 1 出现了 4 次3.
5. 补充一下，上次漏了一道题
document.body.addEventListener('click', () => {
Promise.resolve().then(()=>console.log(1));
console.log(2)
});
document.body.addEventListener('click', () => {
Promise.resolve().then(()=>console.log(3));
console.log(4)
});
用鼠标点击一下屏幕，输出结果是什么；为什么？事件循环是什么，微任务是什么，他们的执行顺序是什么样？哪些你知道的方法是微任务？ 7，准备渲染进程
7.1 浏览器进程获取到通知，根据当前页面B是否是从页面A打开的并且和页面A是否是同一个站点（根域名和协议一样就被认为是同一个站点）。
如果相同，则复用原来的进程。
如果不同，新创建一个新的渲染进程
8. 传输数据、更新状态
8.1 渲染进程准备好后，浏览器进程向渲染进程发起“提交文档”的消息，渲染进程接收到消息后，和网络进程建立传输数据的“管道”
8.2 渲染进程接收完数据后，向浏览器发送“确认提交”
8.3 浏览器进程接收到“确认提交”的消息后，更新浏览器界面状态：包括安全状态、地址栏的 URL、前进后退的历史状态，并更新web页面，此时的web页面是空白页。
9. 渲染进程渲染页面
9.1 构建 DOM 树
9.1.1 输入：HTML 文档 -> 处理：HTML 解析器解析 -> 输出：DOM 树状结构
9.1.2 具体：接收到Bytes字节流->（转换）HTML字符串->（解析）Token->（构建）Node->（合并）DOM 树（保存在内存中，JS可以查询修改）
9.2 样式计算（构建CSSOM树），渲染引擎
输入：CSS 样式来源（Link外部引入、style标签、元素style属性）
处理：属性值标准化，每个节点具体样式（继承、层叠）
输出：CSSOM 树（转换为styleSheets结构中的数据，具备查询修改功能）
9.3 页面布局（构建布局树），额外地构建只包含可见元素的布局树（渲染树）。（重绘不需要重新布局，和分层）
9.3.1 作用是：计算出 DOM 树中可见元素的几何位置
9.3.2 具体：先将DOM树和CSSOM树合并为渲染树 (只包含可见节点)，然后进行布局计算，计算布局树节点的坐标位置。
9.4 分层
9.4.1 特定节点生成专用图层，生成一棵图层树（层叠上下文、Clip，类似 PhotoShop 里的图层）；
9.4.2 拥有层叠上下文属性（明确定位属性、透明属性、CSS 滤镜、z-index 等）的元素会创建单独图层；需要剪裁的地方也会创建图层。
9.4.3 没有图层的 DOM 节点属于父节点图层；
9.5 图层绘制
9.5.1 输入：图层树；
9.5.2 渲染引擎对图层树中每个图层进行绘制；
9.5.3 拆分成绘制指令，生成绘制列表，提交到合成线程；
9.5.4 输出：绘制列表。
9.6 分块(将图层划分为图块)
合成线程会将较大、较长的图层（一屏显示不完，大部分不在视口内）划分为图块（tile, 256*256, 512*512）。
9.7 栅格化(栅格化，是指将图块转换为位图)
9.7.1 在栅格化线程池中，将视口附近的图块优先生成位图（栅格化执行该操作）；
9.7.2 快速栅格化：GPU 加速，生成位图（GPU 进程）。
9.8 合成和显示（若不布局和绘制，会直接合成）
9.8.1 绘制图块命令——DrawQuad，提交给浏览器进程；
9.8.2 浏览器进程的 viz 组件，接收合成线程发过来的 DrawQuad 命令，根，DrawQuad命令，绘制在屏幕上。
-------------
全部评论
(2) 回帖