React 必须知道的一些概念
框架和库的区别：
1.库是将代码集合成的一个产品，供程序员调用。
面向对象的代码组织形式而成的库也叫类库。面向过程的代码组织形式而成的库叫函数库。在函数库中的可直接使用的函数叫库函数。此外还有UI组件库。
- 小而巧，只提供了特定的API，优点就是船小好调头，可以很方便的从一个库切换到另一个库，但是代码几乎不会改变。
2.框架则是为解决一个(一类)问题而开发的产品。
框架用户一般只需要使用框架提供的类或函数，即可实现全部功能。
- 大而全，框架提供了一整套的解决方案，所以如果在项目中，想切换到另外的框架，是比较困难的。
总结理解：
库，相当于是基于 框架 封装的一类的组件集合。
什么是中间件？
顾名思义就是在一个执行流程中间用的一个组件，截住过路的然后对其进行控制增强的操作来满足我们的需求。
react 中间件都是对 store.dispatch() 的增强。
React
React 就是纯粹写UI组件的，React 和 react-router, react-redux 结合起来才称得上框架，而React本身只是充当一个前端渲染的库而已。
React 的各种库都用过哪些：react-router 、redux 、react-redux 、echarts 、antd 、moment 、less 、AicGis 、highCharts
redux 的中间件：applyMiddleware 、redux-thunk 、redux-promise 、redux-saga
react 的高阶组件用过哪些：withRouter、connect、自己分装的高阶组件
react 的脚手架：Create React App、dva、umi、ice
dva是蚂蚁金服开源的一套基于react，redux，redux-saga，react-router技术栈的框架。也可以说是一种开发的解决方案。
redux-saga 基于 Generator 来处理异步事务流程
umi 包含了 dva
react 对比 vue 的优势：
- 更适合大型应用和更好的可测试性
- Web端和移动端原生 APP 通吃
- 更大的生态系统，更多的支持和好用的工具（搭配的router和redux以及其中间件包含了很多重要的思想）
- 比较适合中大型项目（便于测试和后续调试）
- 是一种在内存中描述 dom 树状态的数据结构
- 支持在服务端渲染
虚拟DOM（Virtual Document Object Model）
react（特点：单向响应数据流）和 vue（特点：双向数据绑定）在设计中都使用了虚拟 DOM（Virtual DOM）。
DOM的本质是什么：浏览器中的概念，用JS对象来表示页面上的元素，并提供了操作元素的 API。
什么是React中的虚拟DOM：是框架中的概念，是程序员用JS对象来模拟页面上的 DOM元素 和 DOM嵌套关系。
为何使用虚拟 DOM ？
渲染用户界面的时候，dom 的操作成本是最高的，采用虚拟 DOM 是为了尽可能的减少对 dom 的操作。
虚拟DOM 为何能减少对 DOM 的操作？
Virtual DOM 是一个映射真实 DOM 的 JavaScript 对象，如果需要改变任何元素的状态，那么是先在 Virtual DOM 上进行改变，而不是直接改变真实的 DOM。
当有变化产生时，一个新的 Virtual DOM 对象会被创建并计算新旧 Virtual DOM 之间的差别。之后这些差别会一起应用在真实的 DOM 上，触发一次重排/重绘。而不是每变化一处就 重排/重绘 一次。
改变真实的 DOM 状态远比改变一个 JavaScript 对象的花销要大得多。
Diff算法 (different算法：提供了新旧DOM对比的最优方案)
tree diff：新旧两颗DOM树，逐层对比的过程，就是Tree Diff，当整棵DOM逐层对比完毕，则所有需要被按需更新的元素，必然能够找到
component diff：在进行Tree Diff的时候，每一层中，组件级别的对比，叫做Component Diff
- 如果对比前后，组件类型相同，则暂时认为此组件不需要更新
- 如果对比前后，组件类型不同，则需要移除旧组件，创建新组件，并追加到页面上
element diff：在进行组件对比的时候，如果两个组件类型相同，则需要进行元素级别的对比，这就叫做Element Diff
