Axizs

点击进入React源码调试仓库。 本篇是详细解读React DOM操作的第二篇文章，文章所讲的内容发生在commit阶段。 插入DOM节点操作的是fiber节点上的stateNode，对于原生DOM类型的fiber节点来说stateNode存储着DOM节点。commit阶段插入…

点击进入React源码调试仓库。 本篇是详细解读React DOM操作的第一篇文章，文章所讲的内容发生在commit阶段。 Fiber架构使得React需要维护两类树结构，一类是Fiber树，另一类是DOM树。当删除DOM节点时，Fiber树也要同步变化。但请注意删除操作执行的…

点击进入React源码调试仓库。 每个fiber节点在更新时都会经历两个阶段：beginWork和completeWork。在Diff之后（详见深入理解React Diff原理），workInProgress节点就会进入complete阶段。这个时候拿到的workInProgr…

点击进入React源码调试仓库。 上一篇扒一扒React计算状态的原理 之后，我们来分析一下Diff的过程。 fiber上的updateQueue经过React的一番计算之后，这个fiber已经有了新的状态，也就是state，对于类组件来说，state是在render函数里被使…

点击进入React源码调试仓库。 一旦用户的交互产生了更新，那么就会产生一个update对象去承载新的状态。多个update会连接成一个环装链表：updateQueue，挂载fiber上， 然后在该fiber的beginWork阶段会循环该updateQueue，依次处理其中的…

React的更新任务主要是调用一个叫做workLoop的工作循环去构建workInProgress树，构建过程分为两个阶段：向下遍历和向上回溯，向下和向上的过程中会对途径的每个节点进行beginWork和completeWork。 本文即将提到的beginWork是处理节点更新…

作为一个构建用户界面的库，React的核心始终围绕着更新这一个重要的目标，将更新和极致的用户体验结合起来是React团队一直在努力的事情。为什么React可以将用户体验做到这么好？我想这是基于以下两点原因： Fiber架构和Scheduler出色的调度模式可以实现异步可中断的更…

UI产生交互的根本原因是各种事件，这也就意味着事件与更新有着直接关系。不同事件产生的更新，它们的优先级是有差异的，所以更新优先级的根源在于事件的优先级。 一个更新的产生可直接导致React生成一个更新任务，最终这个任务被Scheduler调度。 所以在React中，人为地将事件…

作为程序员的我们每天都在和网络请求打交道，而前端程序员接触的最多的就是HTTP请求。平时工作中，处理网络请求之类的操作是最多的了。但是一个请求从客户端发出到被服务端处理、再回送响应，再被客户端接收这一个闭环的底层细节可能并没有深究过，本篇文章是我的一篇读书笔记，总结出来恰好涉及…