一句话总结 React Hooks 就是在 react 函数组件中，也可以使用类组件（classes components）的 state 和 组件生命周期，而不需要在 mixin、 函数组件、HOC组件和 render props 之间来回切换，使得函数组件的功能更加实在，更…

react-juejin一个高仿的掘金，大部分是按照掘金的ui来实现的，个别地方就根据自己想法修修改改，只做了移动端的部分，还做pc的部分就要花太多时间了，支持服务端渲染、pwa等，写这个项目主要是对

其中涉及到 React 组件复用、轮子设计相关话题，并配合相关场景实例进行了分析。这些内容都算是 React 设计模式，一提到 Design Patterns，读者大可不必恐惧，事实上这都是 React 开发应用灵活性的体现。今天这篇文章，我们继续通过一个场景，循序渐进，通过一…

本文旨在总结常见的性能缺陷，以及如何来避免这些缺陷。 性能问题在web应用开发中不是什么新鲜事。 我们每个人都有这样的时刻，当你把一个新的Component组件放到你的app中，你会突然发现你尝试的每一个用户交互动作都与期望的效果有很明显的滞后。有时，你可以重复使用多个同样的组…

在 react 进入大家视野之初，Virtual DOM（VDOM）的概念让人眼前一亮，在操作真正的 DOM 之前，先通过 VDOM 前后对比得出需要更新的部分，再去操作真实的 DOM，减少了浏览器多次操作 DOM 的成本。这一过程，官方起名 reconciliation，可翻…

整个项目大概有60+个页面，用到的组件大概150+，package里面的依赖大概有70+个，应该勉强算得上是一个中型的React的项目了。 打包时间约150s，打包完之后的资源gzip之后约1.2m，尽管之前分离了一些公用依赖，但是index包的体积达到了600+还是令人难以接…

在前两篇文章中，我们分析了React组件的实现，挂载以及生命周期的流程。在阅读源码的过程中，我们经常会看到诸如transaction和UpdateQueue这样的代码，这涉及到React中的两个概念：事务和更新队列。因为之前的文章对于这些我们一笔带过，所以本篇我们基于大家都再熟…

之前如果我们需要抽离一些重复的逻辑，就会选择 HOC 或者 render props 的方式。但是通过这样的方式去实现组件，你打开 React DevTools 就会发现组件被各种其他组件包裹在里面。这种方式首先提高了 debug 的难度，并且也很难实现共享状态。 但是通过 H…

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