Story

一、前面的话 在react中为我们提供了一个非常有用的组件，那就是<Suspense/>，他可以包裹一个异步组件，当这个异步组件处于pending状态的时候会展示一个过渡的...

在前面的文章中我们学习了useState、useEffect、useLayoutEffect的基本原理，并看了源码了解了它的执行过程，而本篇文章我们继续学习react常用的...

一、前面的话 hooks是react的一个标志性的特点，它是react拥抱函数式编程的一个重要的突破；通过使用hooks，我们可以让一个函数式组件也能够有自己的状态，相信大...

一、前面的话 在之前的文章中，我们分别介绍了react的初始化流程、render流程、commit流程等，算是粗浅的了解了下react的工作流全貌，接下来我们需要慢慢深入r...

vite 是新兴的构建工具，它相比 webpack 最大的特点就是快。 那它是如何做到这么快的呢？ 因为 vite 在开发环境并不做打包。 我们创建个 vite 项目： 安...

一、前面的话 如果把react的整个工作比作做一道菜的话，那么我们可以认为 render 阶段就是在准备菜谱，而真正干活的其实是commit阶段，在这个阶段，对于类组件来说...

一、前面的话 每一个经历过beginWork的Fiber节点都会经历completeWork，当beginWork进行到不能再往下进行的时候，换句话说，当前的的节点已经没有...

在 JS 学习过程中，往往出现一些与我们常理相违背的结果，比如当我们打印[] == ![] ，它的返回的结果竟然是true 。而本文将结合官方文档对该题进行深度剖析。...

详细介绍React Fiber副作用含义，fiber flags常见的操作。React采用二进制标记副作用的好处。...

一、前面的话 在前面的文章中我们知道的reder阶段中最重要的两大过程就是beginWork和completeWork，本篇文章就来探索一下beginWork在初始化和更新...

一、前面的话 我们终于可以进入render阶段了，在这个阶段我们可以学习到很多东西，它是为什么react能够呈现出UI，以及计算react状态变化的核心，那么怎么定义当前阶...

历经6个月的重构，经过不断地打磨，SoybeanAdmin 1.0 终于发布了！ SoybeanAdmin 是一个清新优雅、高颜值且功能强大的后台管理模板，基于最新的前端技...

4 张图带你深入了解 fiber 执行过程： completeWork 和 beginWork。...

一、前面的话 在上一篇中我们了解了事件优先级和更新优先级，这一篇中我们会开始学习新的优先级概念了，它决定着整个渲染流程的如何计算状态，也决定着如何交给Scheduler进行...

一、前面的话 在笔者学习react源码的过程中，优先级的概念是我花时间相对比较多的板块，也是我认为深入理解react最重要的一个模块之一，通过专栏前面两章的铺垫，我们终于可...

写在前面 本系列会实现一个简单的react，包含最基础的首次渲染，更新，hook，lane模型等等，本文是本系列的第一篇。这对于我也是一个很大的挑战，不过这也是一个学习和进...

一、前面的话 废话不多说，今天我们直接来看一下 react 的初始化流程，学习初始化流程可以让我们知道react如何从 JSX 一步步映射到界面上是非常重要的。 众所周知，...

“虚拟 DOM 很快”这样的神话或许不一定是对的 如果你近些年正在使用主流的前端框架，你可能会听说操作虚拟DOM比操作真实DOM更快这样的言论。人们也很好奇Svelte是如...

一、前面的话 从2013年react第一次发布以来已经过去10年多了，10年前JordWalke 出于一个疯狂的想法（只要任何一个状态发生改变，就重新渲染整个页面）创造了r...