feat: ✨ 完善文档

enson0131 · Oct 21, 2023 · 3d98d7f · 3d98d7f
1 parent 30d8484
commit 3d98d7f
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 1 deletion.
diff --git a/docs/guide/React/React是如何渲染的.md b/docs/guide/React/React是如何渲染的.md
@@ -0,0 +1,9 @@
+# React 是如何渲染的
+
+## React 16 以前
+在浏览器中 js 线程与渲染线程是互斥的，如果 js 线程长期占用着浏览器的主线程，那么界面将长时间不更新，在动画等一些场景下会造成卡顿效果。
+
+因为 Stack Reconciler 是一个同步的递归过程，随着业务复杂度增加，Stack Reconciler 需要的调和时间会变长，
+
+这意味着 js 将长时间占用浏览器，进而导致页面卡顿
+
diff --git a/docs/guide/React/React组件是如何通信的.md b/docs/guide/React/React组件是如何通信的.md
@@ -0,0 +1 @@
+# React 组件是如何通信的
diff --git a/docs/guide/React/setState是同步还是异步的.md b/docs/guide/React/setState是同步还是异步的.md
@@ -158,10 +158,20 @@ export default class Test extends Component {
 ### React 18 版本
 在 React 18 版本所有的 setState 都是异步批量操作
 
+异步批量操作的原因是为了提高性能，减少重复渲染
+还有一个好处就是保持数据一致性，如果是同步更新的话，可能会出现数据不一致的情况（比如 state 更新了，但是 Fiber 还没有更新）
+还有一个好处就是 setState 异步更新可以平滑地过渡新老页面
+
 ### React 18以前的版本
 
 ![setState](./../../public/assets/2.png)
 
 setState 同步还是异步取决于是否处于 batchUpdate 阶段，处于的话就是异步，否则就是同步
 
-在原生事件、setTimeout、setInterval 中属于同步更新的场景
+在原生事件、setTimeout、setInterval 中属于同步更新的场景
+
+
+
+
+## 参考资料
+- https://github.com/facebook/react/issues/11527#