june18

除了主子应用的生命周期外，微前端也有自己的生命周期。本文将分别介绍微前端生命周期的执行时机以及微前端生命周期的勾子函数。 执行时机 在文章 微前端之注册子应用与路由拦截 中...

获取首个子应用的时机是什么时候？都需要为主应用设置哪些生命周期？子应用加载前的 loading 如何控制？...

如何在主应用里注册子应用？是 window 还是...？如何实现路由拦截？路由拦截涉及 window 的哪些 API。...

微前端中如何同时启动多个应用？子应用要接入微前端框架需要改造吗？针对 Vue3 和 React 16 子应用分别该怎样改造？...

主要内容包括：设计原则、软件设计分层、如何保证架构的质量、技术前期准备、技术填补、崩溃预防和系统重构。...

本文将带大家实现 useLayoutEffect 与 useEffect。 先看下如何使用。 两者对比 存储结构相同 存储结构都是单向循环链表。 执行时机不同 useLay...

useRef 是 React 中实现最简单的 hook。 它的应用场景很多，比如 antd、react-router、ahooks。...

useCallback 的源码实现非常类似 useMemo，不同的只是缓存的内容不同，一个是结果，一个是函数。...

useMemo 的实现并没有你想象中的那么复杂。它把数据缓存到了 fiber 上。缓存的数据结构是一个数组，数组第一项是 value 值，数组第二项是依赖项。...

本文将带大家实现 useState。 先看下如何使用。 useState 是基于 useReducer 实现的，参考文章 React 实现 useReducer。 实现 u...

今天带大家实现多个节点 diff。 先看个例子。 整体流程： 从左边往右遍历，比较新老节点，如果节点可以复用，继续往右，否则就停止 新节点没了，老节点还有，则删除剩余的老节...

今天带大家实现节点删除。 先看个例子。 思路： 节点删除包含两个部分：vdom 删除（不用做），dom 删除 如何删除 dom？把所有要删除的节点放在父 fiber 上 R...

本文将带大家实现 useReducer。 先看下如何使用。 Render 阶段 BeginWork 阶段 reconcileSingleElement 增加了判断节点是否可...

基于文章 实现 React 类组件渲染。 本文将介绍如何渲染函数组件。 Render 阶段 BeginWork 阶段 beginWork 函数增加函数组件的 case。 c...

基于文章 实现 React Fragment 节点渲染。 本文将介绍如何渲染类组件。 初始化 Component Render 阶段 BeginWork 阶段 beginW...

基于文章 实现 React 文本节点渲染。 本文将从三方面介绍如何渲染 Fragment 节点。 子节点 <> 根节点 <> 标签 <Fragment> 子节点 <> Re...

基于文章 实现 React 多个原生标签子节点渲染。 本文将实现文本节点渲染，文本节点渲染分两种情况： 文本根节点 文本子节点 文本根节点 Render 阶段 render...

基于文章 简易实现 React 页面初次渲染。 本文将实现多个原生标签子节点渲染，主要涉及 render 阶段的修改。 BeginWork 阶段 reconcileChil...

先从单个原生标签节点开始实现，后面文章会陆续添加多个节点、文本节点、Fragment、类组件以及函数组件的实现。 一切从根节点开始。 首先创建根节点，函数为 createR...