本文是<React技术揭秘-理念篇>的概括，大部分是摘录于卡颂的React源码剖析网站，从理念到架构，从架构到实现，从实现到代码，剖析的很详尽，有趣味能够去学习学习。
React理念：构建疾速响应的大型web利用
如何了解React理念？
- 速度快
速度比的是渲染速度，和vue相比，vue应用的是模版语法，所以在编译期就能够找到须要变动的局部，而react应用的是jsx，具备高灵活性与不确定性，难以在编译期找到变动的局部，所以React在运行期做出了更多致力:
1.PureComponent 或 React.memo 构建组件
2.应用shouldComponentUpdate生命周期
3.渲染列表时应用key
4.应用useCallback和useMemo缓存数据和变量
- 响应天然
React给到的答复：将人机交互的钻研后果整合进UI
对于响应天然，抛出了一个常见问题：当组件进行更新时，有时会影响UI的绘制，给人感觉页面卡顿。
起因：支流浏览器每次刷新的频率为60Hz，即16.6ms刷新以一次，且GUI渲染线程和js线程互斥，所以须要在16ms内一一实现 JS脚本、款式布局、款式绘制 这三个工作，当JS脚本执行工夫超过16ms，就没工夫进行GUI渲染了，即看到的画面卡顿。
解决思路：每一帧工夫中预留一些工夫给JS线程(源码里写的是5ms)，React利用这段时间更新组件，当工夫不够用时，React将线程控制权交还给GUI渲染线程，React期待下一帧再持续之前被中断的工作。
React为什么从v15降级到v16？
正是因为React15架构无奈满足React的理念。
React15架构分为两层，Reconciler(负责找出变动的组件)和Renderer(负责将变动的组件渲染到页面)，在React15及以前，Reconciler采纳递归的形式创立虚构DOM，递归过程是不能中断的。如果组件树的层级很深，递归会占用线程很多工夫造成卡顿。
为了解决这个问题，React16进行了重构降级到了v16，React16的架构分为三层，Scheduler(负责调度工作)、Reconciler、Renderer。将递归的 无奈中断的递归更新⚠️ 重构为 异步可中断的循环更新♻️，每次循环都会判断以后是否有剩余时间，这就是全新的Fiber架构。
Fiber架构是什么？
代数效应：函数式编程中的概念，用于将副作用从函数调用中拆散
React核心成员Sebastian Markbåge(Hook发明者)曾说：咱们在React中做的就是践行代数效应，而Fiber架构就是代数效应的体现。
Fiber架构实现了一套状态更新机制。反对工作不同优先级，可中断与复原，并且复原后能够复用之前的中间状态。其中每个工作更新单元为React Element对应的Fiber节点。
Fiber节点能够保留对应的DOM节点，Fiber树就对应DOM树，React应用双缓存技术(在内存中构建并间接替换)来实现Fiber树的构建与替换—————DOM树的创立与更新。
总结
原本只是想学习一下react源码。后果发现卡颂写的货色对我来说简直都是fresh new knowledge。所以不盲目地就陷进去了，无奈整个常识树又有点绕人????????,所以这次挑了文中的几个重点进行了搬运分享，解释了react的理念和react版本升级的前因后果。感觉本人对react理解又多了几分????