自前端进入现代化时期以来，状态管理就是个经久不衰的话题。这篇文章就以react这个经典的前端框架为切入点从头理一理状态管理方案的发展历程。

之前谈到了完全声明式编程的思想和用处，这篇文章就从一个百度开源的完全配置化框架amis源码入手，分析一下实现的关键点。

现代前端没人不知道React，但和React同期出现的一个强大工具了解的人却不多。这个工具可以和React完美配合，但不完全属于React生态圈，也可以独立使用，那就是Immutable.js。其强大之处在于补全了JS中难以实现不可变数据结构的问题，而不可变数据结构又是组件化的精髓之一。这篇文章就谈谈Immutable的应用。

继Fiber，Suspence之后，最近React又提出了一版突破原有理论的API——Hooks，真是难以想象这都是一个版本之内做出的改变。React真的是太强了，学不动了。。

Redux的中间件思想和Koa很相似，Redux的action对象可以类比于Koa中的客户端请求，所有的中间件就组成了处理action对象的管道，最后将处理完成的action对象交给reducer就完成了中间件流程。

实际上React和Redux并没有直接的联系，前者负责视图渲染，后者负责状态管理，单独抽出使用都是可以的，但无疑两者结合可以工作的更好。为了使状态和视图更好的连接，就要使用react-redux作为胶水层，其核心方法只有两个,Provider组件和connect方法，下面就分析其原理。

从前文中对Flux的介绍中我们知道了store, action creator,dispatcher间数据单向流动的简洁之处，也了解了其存在的一些不足，那么Redux作为Flux架构的优化版，其改进之处在哪里呢？

在React中管理应用数据比较麻烦，一般借助于Redux这种管理应用状态的框架处理数据流动。那么了解Redux前就必须先了解它的设计思想来源——Flux。这篇文章从Flux的核心思想谈起。

在很长一段时间里，前端都是用HTML代表内容，CSS代表样式，JS代表逻辑，三种语言分在三种文件里来组成页面。看起来是分而治之，实际上是把同一件事拆开了，不符合组件高内聚的设计原则。自从组件化出现后，一个文件里应该做同一件事的思想逐渐流行起来，这也是react的核心之一。样式，内容，逻辑都由JS构成并集中管理，实现真正的组件封装。那么如何通过JS去构造HTML内容，就是今天讨论的主题——JSX。

相比于Vue的高度封装和自动化，React给予了开发者更高的自由度，但相对的，就要更注重性能优化相关的问题，这里就以React为入口总结一下前端应用开发中需要注意的一些常规性能优化点。

我们知道常规单页应用最终都会被webpack打包为若干js，css，入口html和各种静态资源，从http请求到入口html资源到整个应用准备完成经历了不少阶段，这篇文章就按照时间顺序分别介绍其中可优化的点。

当完成数据的响应化后，后续就要通过对该数据的订阅完成依赖收集及响应等相关操作。这部分内容核心入口就是数据被劫持的get和set方法。本文就重点分析这一部分内容。

和Vue类似，React同样实现了一套管理事件的系统，不过两者的实现思想还是有着不小的区别。Vue为每个实例维护了一个事件管理对象，而React将所有事件都代理到document再进行分发。这篇文章就来详细分析React中管理事件的思路。

mobx是继redux之后又一大放异彩的状态管理库，相比于redux，其通过函数响应式编程的理念使得状态管理变得更加简单自由可拓展，避免了redux中大量的样板代码书写。本文就记录一下其核心功能的实现思路。

当开发的React组件数量达到一定程度时，就必定会遇到一个问题，某些组件中有部分逻辑是完全相同的，但这个逻辑又不影响视图，所以不太适合抽出新的组件。为了重用这部分逻辑，就有了高阶组件。

我们已经知道了根据render方法传入参数的不同，在react内部会生成4种不同类型的自定义组件，但生命周期只存在于ReactCompositeComponent组件中，这篇文章就来分析该类组件来探讨生命周期的注册原理。

我们知道React应用的常见结构是由JSX语法构成各种各样的组件，然后通过render方法挂载到相关的父组件上构成一颗组件树，最终将整个组件树挂载到真实DOM上。本文分析该过程的实现原理。

setState可能是React最常用的API了，我们通过调用setState可以触发组件的更新，但调用后不能保证state会被同步更新。那么什么时候会同步更新，什么时候又是异步更新呢?这就和事务有关了。

生命周期是在各行各业都广泛运用的概念，如同日月更替，生老病死，一个整体的运作必然离不开各个部分不断的更替重组。在软件开发中也是如此，程序的交互也必然离不开组件的创建，更新与删除。下面就来探讨React中生命周期的实现。