react介绍

基本概念:

  单页应用模型(当你需要浏览不同的页面时,客户端不用再向浏览器频繁的发起请求,而是把心页面的数据拉取下来,根据客户端的具体情况在本地重新绘制新的界面,再把新的数据信息在新绘制的界面中展现出来,这样减少了客户端与服务端的之间的交互延迟,能够提供及时的响应,大大提高用户体验)

 

新的网页开发模型 : 单页面模型(spa)

reactJs  vue都能解决以下这些问题

   单页应用所面临的困境:

  1.如果保持数据与ui同步更新  否则用户体验很差

  2. 如何有效的提高DOM操作的效率  (浏览器察觉到dom模型修改以后,他就会解读改变后的dom,根据dom变化重新绘制页          面,这样一来一回很低效)

  3. 使用HTML开发UI界面异常复杂(开发强大的网页应用,逻辑复杂代码庞大)

 

react的优点    (降低页面之间的耦合度,虚拟DOM操作,组件开发(可重用组件,使页面更易解读))

1.自动化的UI管理(界面和显示数据的变化保持同步。他在数据和界面之间构造了一个联合层,把数据的变化转化成一些列事件,开发者只需要根据事件去转换界面的状态,这样大大缓解数据和界面之间的逻辑耦合度)

react介绍_第1张图片

 

2.更高效的dom操作(为了提升效率,它在内存中保存了一个virtualDOM的数据结构,VD变化之后会缓存起来然后跟浏览器dom进行对比后再改变)

react介绍_第2张图片

react提供了一个功能 

ui的组件化设计,react之所有利于开发web应用界面,主要原因在于它依赖于组件化的方式,去简化复杂的Ui界面,它提供了不少API,能够帮助我们构建很小,但是可重用的UI组件,然后把这些组件结合起来,让小的组件形成复杂而且功能强大的饿大组件;

react还提供了另一个强大的功能

依赖js开发UI界面,react的一大创新是完全摆脱了css的影响,让开发者直接使用js来定制界面,他提供了非常简洁的界面定义方式JSXreact介绍_第3张图片

,此段代码很像html,但本质上不是html,react会把他解读成一系列的dom操作,大大简化Ui设计逻辑的描述方式react介绍_第4张图片

 

react的本质

mvc中的view层,使用react的时候有足够的自由度去处理数据层和控制层,降低了数据和界面的整合难度

view层:将数据和ui进行结合

model:数据层

react介绍_第5张图片

 

你可能感兴趣的:(react)