File tree Expand file tree Collapse file tree 2 files changed +24
-1
lines changed Expand file tree Collapse file tree 2 files changed +24
-1
lines changed Original file line number Diff line number Diff line change @@ -67,7 +67,7 @@ cpu(Central Processing Unit) gpu(Graphics Processing Unit) 是浏览器的核心
67
67
当 HTML 解析器发现标签时script,它会暂停 HTML 文档的解析,并加载、解析和执行 JavaScript 代码
68
68
69
69
### 提示浏览器如何加载资源
70
- 如果不希望阻塞解析,则可以将async或defer属性添加到script标签中。然后,浏览器会异步加载和运行 JavaScript 代码,并且不会阻止解析。如果合适,您也可以使用JavaScript 模块。link rel="preload"是一种通知浏览器当前导航肯定需要该资源并且希望尽快下载的方法。
70
+ 如果不希望阻塞解析,则可以将async或defer属性添加到script标签中。然后,浏览器会异步加载和运行 JavaScript 代码,并且不会阻止解析。如果合适,您也可以使用JavaScript 模块。link rel="preload"(它也不会加载和执行脚本,而只会安排以更高的优先级下载和缓存它) 是一种通知浏览器当前导航肯定需要该资源并且希望尽快下载的方法。
71
71
72
72
73
73
### 样式计算
Original file line number Diff line number Diff line change @@ -46,6 +46,29 @@ layout: doc
46
46
因此要获取最新的dom,需要在上面提到的微任务执行完之后再执行
47
47
48
48
nexttick的原理就是通过promise的链式调用,将nexttick里的回调放在上面的微任务.then里执行
49
+ ## watch
50
+ 首先会把watch的第一个参数标准化,也就是getter函数的形式。然后使用ReactiveEffect类创建一个effect对象,并将watch里的回调函数设置为effect的调度器函数,
51
+
52
+ 当监听的响应式数据发生变化,会执行effect里的调度器。并且执行过程中会调用effect.run,会返回getter函数return的值,也就获取了新值。旧值是通过闭包拿到
53
+
54
+ 把新值和旧值作为watch回调的参数
55
+
56
+ 通过源码可以发现,watch监听ref reactive数据类型是不同的,当是reactive类型,默认会调用traverse进行深度监听,对于ref类型,不会进行深度监听,通过设置deep:true能实现深度监听
57
+
58
+ 对于immediate,默认是false,不会执行effect的调度器函数
59
+
60
+ 对于flush,这跟组件的更新时机有关系,默认是pre,也就是在父组件更新之后,子组件更新之前执行,post是在组件更新之后,sync则是同步执行
61
+
62
+ watchEffect都是基于doWatch方法,不同点是回调为null,配置也只有flush
63
+
64
+ ## keepalive
65
+ 卸载时并不会真的卸载,而是移动到一个隐藏容器里,挂载时也不是真的挂载,而是从隐藏容器中取出放在页面上
66
+
67
+ keepalive有一个特殊标识表明他是缓存组件,keepalive通过ctx实现与渲染器的通信,keepalive会在ctx上实现activate/deactivate
68
+
69
+
70
+
71
+
49
72
50
73
51
74
You can’t perform that action at this time.
0 commit comments