这是我参与「第四届青训营」笔记创作活动的的第10天

React历史与应用

React是用于构建用户界面的JavaScript库，起源于Facebook的内部项目，该公司对市场上所有 JavaScript MVC框架都不满意，决定自行开发一套，用于架设Instagram的网站。于2013年5月开源。

React概述

React框架的核心优势之一，就是支持创建虚拟DOM来提高页面性能。那么，什么是虚拟DOM呢？其实，虚拟DOM这个概念很早就被提出来了，是相对于实际DOM而言的。

设计人员在设计传统HTML网页的UI时，都会在页面中定义若干的DOM元素，这些DOM元素是所谓的实际DOM。通常，页面中的实际DOM负责承载着外观表现和数据变化，任何外观形式的改变或数据信息的更新都要反馈到UI上，都是需要通过操作实际DOM来实现的。

于是，问题也就自然出现了。对于复杂的页面UI而言，往往会定义大量的实际DOM。频繁地操作大量实际DOM，往往会带来访问性能的严重下降，用户体验也会随之变差，这些都是设计人员所不希望看到的。因此， React框架专门针对这个现象引入了虚拟DOM机制，以避免频繁的DOM操作带来的性能下降问题。

React DOM类似于一种将相关的实际DOM组合在一起的集合，是React的虚拟DOM对象，内置对象，将其理解为DOM组件应该更为贴切。因此，React框架将ReactDOM称为虚拟DOM。

React框架之所以大受欢迎，其特有的渲染机制是非常重要的因素之一。既然提到React 渲染机制，那么就说一说Diff算法，该算法是支撑React渲染机制的核心技术之一。

Diff算法的核心就是扫描DOM树，通过扫描找到DOM树前后的差异。若DOM树的状态或属性发生改变，React会构建新的DOM树，将新的DOM树和原来的DOM树进行比较，找到树中变化的部分进行修改。好处是避免重复的频繁的操作DOM，提高页面的访问性能。