1. react的由来 官网 特点
2. react简易环境的搭建
3. jsx的原理
4. jsx一些注意事项

1.React的由来 官网 特点

1.React的由来

• 起初facebook在建设instagram（图片分享）的时候，因为牵扯到一个东西叫数据流，那为了处理数据流并且还要考虑好性能方面的问题，Facebook开始对市场上的各种前端MVC框架去进行一个研究，然而并没有看上眼的，于是Facebook觉得，还是自己开发一个才是最棒的，那么他们决定抛开很多所谓的“最佳实践”，重新思考前端界面的构建方式，他们就自己开发了一套，果然大牛创造力还是很强大的。
  • 随后该框架在2013年5月开源

2.React官网

• 用于构建用户界面的 JavaScript 库。
• React 构建页面 UI 的库。可以简单地理解为，React 将将界面分成了各个独立的小块，每一个块就是组件，这些组件之间可以组合、嵌套，就成了我们的页面。
  声明式
  组件化
  一次学习，随处编写

3.React的github页面

4.React的高性能体现

• React中引入了虚拟DOM的概念，进行开发时，所有的DOM构造都是通过虚拟DOM进行，当数据变化后，React重新构建整个DOM树，然后根据diff算法将当前整个DOM树和上一次的DOM树进行比对，得到区别，将仅仅需要变化的部分进行实际的浏览器DOM更新。

  • React能够批处理虚拟DOM的刷新，在一个事件循环内的两次数据变换会被合并，如：A-B,B-A,React会认为UI没有发生任何变化。
    • 当react决定要加载或者更新组件树时会做很多事，比如调用各个组件的生命周期函数，计算和比对虚拟DOM，最后更新DOM树，这整个过程是同步进行的，也就是说只要一个加载或者更新过程开始，中途不会中断。再因为JavaScript单线程的特点，如果组件树很大的时候，每个同步任务耗时很长，就会出现卡顿。

• 而在react 16之后发布了一种新的react核心算法，React Fiber是对核心算法的一次重新实现(官网说法)

  • Fiber是React 16中的新的协调引擎，主要目的是使虚拟DOM可以增量式渲染。
    • React Fiber的方法其实很简单，使用分片。把一个耗时长的任务分成很多小片，每一个小片的运行时间很短，虽然总时间依然很长，但是在每个小片执行完之后，都给其他任务一个执行的机会，这唯一的线程就不会被独占，其他任务依然有运行的机会。

5.React的特点和优势

• 虚拟DOM ==> 高性能
  • 具体查看
    React的高性能体现
• 组件系统 ==> 高效率
  • 使用react开发的核心就是将页面拆分成若干个组件，并且react一个组件中同时耦合了css、js、image ,这种模式整个颠覆了过去的传统的方式。
• 单向数据流
  • react的核心内容就是数据绑定，将服务端的数据和前端页面绑定好，我们仅仅关注实现业务就行。
• JSX 语法
  • 利用jsx语法使代码的可读性提高，在render中创建dom，前提是需要使用工具来编译jsx。