进击的小进进

前言在上篇文章中，我们讲了「mutation」子阶段的插入(Placement)操作，接下来我们讲更新(Update)和删除(Deletion)操作：一、commitWork()作用：对DOM节点上的

先是Placement(替换/新增)、Update(更新) 和Deletion(删除) 三者之间的或操作，相当于把三者合并在了一起。 因为该情况是 ② 和 ④ 的集合，所以会跳过，详细讲完 ② 和 ④ 后，想必这边你也知道了。 接下来这个很重要，因为是贯穿 ②、④、⑤ 中的算法…

(1) 根据fiber的tag即类型，进行不同的操作。主要看FunctionComponent和ClassComponent这两种情况。 (2) 如果是FunctionComponent的话，则执行commitHookEffectList()，该方法稍后解析。 (3) 如果是C…

那本篇文章就来整体看下commitRoot()/commitRootImpl()的整体流程，之后的文章再细讲内部各个function的源码。 具体的源码解析，我们在以后的文章里讲。 (3) commitRoot()的核心函数是commitRootImpl()，接下来就来看下它的…

① fiber对象的tag为HostComponent的话，那么该 fiber是 DOM 标签元素（div、span…）,并且直接 return null 了。 比较绕，逻辑是当有一个节点 throwError 后，给该节点一个Incomplete的 effectTag，但只有…

通常，当拥有子节点的元素被标记为 contentEditable 时，React 会发出一个警告，因为这不会生效。 该属性将禁止此警告。 尽量不要使用该属性，除非你要构建一个类似 Draft.js 的手动管理 contentEditable 属性的库。 也就是说，除非你想写一个…

前言：在上篇React源码解析之HostComponent的更新(上)中，我们讲到了多次渲染阶段的更新，本篇我们讲第一次渲染阶段的更新一、HostComponent(第一次渲染)作用：(1)创建DOM

接上篇 React源码解析之completeWork和HostText的更新 ，本文讲解下HostComponent多次渲染阶段的更新（下篇讲第一次渲染阶段的更新）。 「第一次渲染阶段」放在下篇文章讲。 主要是执行了diffProperties()方法，可能你会有疑惑：为什么不…

前言：在React源码解析之completeUnitOfWork中，提到了completeWork()的作用是更新该节点（commit阶段会将其转成真实的DOM节点）本文来解析下completeWor