React核心开发团队一直都努力地让React变得更快。在React中可以用来优化组件性能的方法大概有以下几种: 本文还会介绍React16.6加入的另外一个专门用来优化函数组件(Functional Component)性能的方法: React.memo。 组件是构成Reac…

原文的篇幅非常长，不过内容太过于吸引我，还是忍不住要翻译出来。此篇文章对编写可重用和可维护的React组件非常有帮助。但因为篇幅实在太长，我对文章进行了分割，本篇文章重点阐述 封装。因本人水平有限，文中部分翻译可能不够准确，如果您有更好的想法，欢迎在评论区指出。 耦合是决定组件…

大家好，我叫尽龙，来自体验技术部。社区名称叫 brickspert，砖家的意思。 自从 React 推出 React Hooks 后，就开始尝试使用 Hooks，并逐渐喜欢上了它。目前，几乎 100% 的组件都是使用 Hooks 开发。经过大半年的实践，在 Hooks 使用方面…

作为前端小白中的一员，没接触过 React 高阶组件，首次看到这个名字时不明觉厉 😱，甚至有种“从入门到放弃”的想法。 然 🦢，通过深入学习后发现它实际上是一个概念十分简单，但却非常常用的东西。它的作用是能实现代码复用和逻辑抽象、对 state 和 props 进行抽象和操…

前端发展速度非常之快，页面和组件变得越来越复杂，如何更好的实现状态逻辑复用一直都是应用程序中重要的一部分，这直接关系着应用程序的质量以及维护的难易程度。 本文介绍了React采用的三种实现状态逻辑复用的技术，并分析了他们的实现原理、使用方法、实际应用以及如何选择使用他们。 Mi…

本文以redux的源码解读为例，为你提供一些解读源码的思路，本文为我解读redux源码的全过程，其中也会有一些弯路， 不过还是分享给大家，毕竟本文倡导重在阅读过程。 个人觉得再看别人的代码时debugger是一个很好的东西, 可以查看执行顺序提高效率。 好的，那我们就把redu…

React通过引入Virtual DOM的概念，极大地避免无效的Dom操作，已使我们的页面的构建效率提到了极大的提升。但是如何高效地通过对比新旧Virtual DOM来找出真正的Dom变化之处同样也决定着页面的性能，React用其特殊的diff算法解决这个问题。Virtual …

如果你在编写函数组件并意识到需要向其添加一些 state，以前的做法是必须将其它转化为 class。现在你可以直接在现有的函数组件中使用 Hooks 1. 类组件的不足 综上所述，如果不注意的话，很容易写成第三种写法，导致性能上有所损耗。 2. Hooks 优势 副作用的关注点…

一. redux的实现 在一切开始之前，我们首先要回答一个问题：为什么我们需要redux，redux为我们解决了什么问题？只有回答了这个问题，我们才能把握redux的设计思路。 React作为一个组件化开发框架，组件之间存在大量通信，有时这些通信跨越多个组件，或者多个组件之间共…