本文从源码入手，分析最流行的 React 动态加载方案 —— React-lazy + Suspense 实现原理

在项目中有一些关键信息，需要及时更新，比如商城类项目的顶部通栏中的个人账户信息，需要在任何页面下都呈现最新数据，而一般情况下顶部通栏都是公共组件，一次引入各个页面通用。那么怎么在每次路由切换的时候更新数据呢？ 我最开始使用的是最暴力的方式，利用 Route 的 render 属…

useContext 可以考虑这样一个场景，如组件树的机构如下图所示，在App组件中我们实现了用户登录，而登录状态需要组件都需使用，如A、B、C等组件需要拿到登录态从而响应用户的操作。如果使用prop

Umi使用Webpack5 Module Federation 探索，可以动态运行另一个JavaScript应用的代码，同时可以共享一依赖。

一 前言 今天我们来悉数一下 React 中一些不错的设计模式，这些设计模式能够解决一些功能复杂，逻辑复用 的问题，还能锻炼开发者的设计和编程能力，以为多年开发经验来看，学好这些设计模式，那就是一个字

React高阶组件(HOC)，对于很多react开发者来说并不陌生，它是灵活使用react组件的一种技巧，高阶组件本身不是组件，它是一个参数为组件，返回值也是一个组件的函数。高阶作用用于强化组件，复用逻辑，提升渲染性能等作用。高阶组件也并不是很难理解，其实接触过后还是蛮简单的，…

React 在 v16.8 的版本中推出了 React Hooks 新特性。在我看来，使用 React Hooks 相比于从前的类组件有以下几点好处： 关于这方面的文章，我们根据使用场景分别进行举例说明，帮助你认识理解并可以熟练运用 React Hooks 大部分特性。 与 c…

每个路由配置都是一个对象，包含path、exact、（component|render|children）属性，从app.jsx中可以知道，路由配置对象就是route的属性列表。

React 提供了一些方法来实现组件的选择性渲染或复用，如 Render Props、高阶组件 等，但这些方法组成的组件也带来了“嵌套地狱”的问题，复杂了组件的结构，增大了阅读理解代码的难度。React 提供了自定义 Hook 来解决上面提到的问题。 在一些复杂的组件中往往都包…