(读后笔记)颠覆式前端开发框架React

React的开发目的

按官网描述,用于开发数据不断变化的大型应用程序

为什么React适用于开发数据不断变化的大型应用程序呢,那就要从Web开发的性能瓶颈和React的原理开始说起。

Web开发的性能瓶颈

在Web开发中,我们需要将不断变化的数据实时显示在UI上,这种时候就要对DOM进行操作。而复杂频繁的DOM操作就是产生Web性能瓶颈的重要原因。

React的原理

React为了解决以上瓶颈,引入了虚拟DOM,这也是React最为重要的核心机制之一。React利用对虚拟DOM来减少对实际DOM的操作从而提升性能。由于虚拟DOM是在内存中创建的,因此性能极高。每一次的数据更新,React都会刷新整个页面。

这样还带来了另外一个好处,就是开发者们不用关心数据是怎么变化的,只需要知道每一次页面渲染对应的整体数据是什么就好了。而在传统的Web前端开发思路上,开发者们需要知道哪些数据是新的,如何将新的DOM节点添加到当前的DOM树上。

因此,在React的开发中,你永远只需要关心整体数据,至于如何进行局部更新以提高效率,那是React框架要做的事情。

组件化的开发思路

在虚拟DOM的基础之上就衍生出了React组件化的开发思路。

所谓组件,即封装起来的具有独立功能的的UI部件

在React构建的应用程序中,你可以将整个页面视为一个由许多的子组件构成的大组件,这样做最明显的一个好处是增加了前端代码的可重用性,一个组件能在多个UI界面中被使用。除此之外,React认为一个组件还应该具备以下三个特征

  1. 可组合:能够和其他组件一起使用
  2. 可维护:由于每个组件只包含自己内部的逻辑,因此更容易被维护
  3. 可测试:测试单个组件内部的逻辑相较于测试整体UI要更加容易

结论

React接管了开发UI中最为复杂的局部更新数据的部分。同时,引入了组件化的开发思想,从另一个角度构建了前端UI界面。

原文:http://www.infoq.com/cn/articles/subversion-front-end-ui-development-framework-react

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,385评论 25 708
  • 原教程内容详见精益 React 学习指南,这只是我在学习过程中的一些阅读笔记,个人觉得该教程讲解深入浅出,比目前大...
    leonaxiong阅读 2,860评论 1 18
  • 下午看到的瞬间有些惊喜,像是很久没看到了,也像是自己很久没有抬头看天。 练字在继续,最近写的很多,凡字不知道怎样写...
    云小5阅读 248评论 4 2