壹 ❀ 引 本文属于我在公司的一篇技术分享文章，它在我之前 React性能优化，六个小技巧教你减少组件无效渲染一文的基础上进行了拓展，增加了工具篇以及部分更详细的解释，所以内容上会存在部分重复，以下是

Fiber 是对 React 核心算法的重构，facebook 团队使用两年多的时间去重构 React 的核心算法，在React16 以上的版本中引入了 Fiber 架构，其中的设计思想是非常值得我们学习的。 我们知道，在浏览器中，页面是一帧一帧绘制出来的，渲染的帧率与设备的刷…

在React Conf 2018宣布React Hooks后，我第一时间开始尝试使用React Hooks，现在新项目基本不写Class组件了。对我来说，它确实让我的开发效率提高了很多，改变了已有的组件开发思维和模式. 我在React组件设计实践总结04 - 组件的思维中已经总…

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

这两天自己简单的看了下 setState 的部分实现代码，在这边给到大家一个自己个人的见解，可能文字或图片较多，没耐心的同学可以直接跳过看总结(源码版本是16.4.1)。 、performWorkOnRoot、performSyncWork、performAsyncWork这四…

在 src/App.tsx 内引用我们的案例组件，在 src/example.tsx 写我们的案例组件。 可以让函数式组件拥有状态管理特性，类似 class 组件中的 this.state 和 this.setState ，但是更加简洁，不用频繁的使用 this 。 你可以把 …

最近准备培训新人, 为了方便新人较快入手 React 开发并编写高质量的组件代码, 我根据自己的实践经验对React 组件设计的相关实践和规范整理了一些文档, 将部分章节分享了出来. 由于经验有限, 文章可能会有某些错误, 希望大家指出, 互相交流. 由于篇幅太长, 所以拆分为…

我的部分工作职责是执行所谓的“技术面试”，在面试时我会评估申请“React 前端开发”职位的潜在候选人。 如果你曾经用谷歌搜索“React 面试问题”（或任何其他“[技术]面试问题”），你可能已经看过无数“十大 React 面试问题”，这些问题要么已经过时，要么和“state …

接下来将一步步带领大家实现一个基本的modal弹窗组件，封装一个简单的动画组件，其中涉及到的一些知识点也会在代码中予以注释讲解。 一. modal组件的实现； 1. 环境搭建 2. modal样式完善 3. modal功能开发 3.1. 添加visible字段控制显隐 3.2.…