React 是一个用于开发用户界面的 JavaScript 库， 是由 Facebook 在 2013 年创建的。 React 集成了许多令人兴奋的组件、库和框架。 当然，开发人员也可以自己开发组件。 在最佳实践之前，我建议在开发 React 应用程序时使用测试驱动开发（TDD…

本文对React的核心原理进行分析, 包括JSX、Diffing、Fiber、Time Slice等, 并且对React原理的学习方法进行了总结和建议.

重头戏来了。 宿主环境各不相同，需要将源码进行相关处理后发布至 npm。 本节所有代码可在仓库chapter-3分支中获取。 既然是使用typescript编写的组件库，那么使用者应当享受到类型系统的好处。 这样使用者引入npm 包时，便能得到自动提示，也能够复用相关组件的类型…

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

蓝色框框的部分分别是Diff算法的核心代码updateChildren以及processUpdates，通过Diff算法获取了组件更新的updates队列之后一次性进行更新。 《深入React技术栈》这本书对Diff算法的解释比较好。其实只要记住几个原则以及在具体的计算upda…

众所周知，React中最为人称赞的就是Virtual DOM和 diff 算法的完美结合，让我们可以不顾性能的“任性”更新界面，前面文章中我们有介绍道Virtual DOM，其实就是通过js来模拟dom的实现，然后通过对js obj的操作，最后渲染到页面中，但是，如果当我们修改…

在 redux-saga 的世界里，所有的任务都通用 yield Effects 来完成（Effect 可以看作是 redux-saga 的任务单元）。Effects 都是简单的 Javascript 对象，包含了要被 Saga middleware 执行的信息（打个比方，你可…

如果你正在看这篇文章，你很可能已经知道 React 是啥了。React 的学习曲线陡峭是众所周知的，很多人在开始学习 React 时都一头雾水，笔者自然也不例外。究其原因，是因为我们在学习 React 的时候，要学的并不仅仅只是 React 这个库本身。React 自身只是一个…

IndexPage has a method called shouldComponentUpdate(). shouldComponentUpdate should not be used when extending React.PureComponent. Please …