前端必知词汇:React-阿里云开发者社区

开发者社区> AlibabaF2E> 正文

前端必知词汇:React

简介: React 是一个声明式,高效且灵活的用于构建用户界面的开源JavaScript 库,是目前前端三大主流框架之一 (React、Angular和Vue) 。React发源自Facebook的PHP框架XHP的一个分支,可用于创建Web用户交互界面。XHP作为一个PHP框架,旨在每次有请求进来时渲染整个页面。React的产生就是为了把这种重新渲染整个页面的PHP式工作流带到客户端应用中来。

React 是一个声明式,高效且灵活的用于构建用户界面的开源JavaScript 库,是目前前端三大主流框架之一 (React、Angular和Vue) 。React发源自Facebook的PHP框架XHP的一个分支,可用于创建Web用户交互界面。XHP作为一个PHP框架,旨在每次有请求进来时渲染整个页面。React的产生就是为了把这种重新渲染整个页面的PHP式工作流带到客户端应用中来。

React引入了一种新的方式来处理浏览器DOM。传统的手动更新DOM、记录每一个状态的方式既不具备扩展性,又很难加入新的功能,就算可以,也是有着冒着很大的风险。React使用很新颖的方式解决了这些问题。React 的核心思想就是封装组件。当组件状态 state 有更改的 时候,React 会自动调用组件的 render 方法重新渲染整个组件的 UI。当然如果真的这样大面积的操作 DOM,性能会是一个很大的问题,所以 React 实现了一个Virtual DOM,组件 DOM 结构就是映射到这个 Virtual DOM 上,React 在这个 Virtual DOM 上实现了一个 diff 算法,当要重新渲染组件的时候,会通过 diff 寻找到要变更的 DOM 节点,再把这个修改更新到浏览器实际的 DOM 节点上,所以实际上不是真的渲染整个 DOM 树。这个 Virtual DOM 是一个纯粹的 JS 数据结构,所以性能会比原生 DOM 快很多。高效。基于这种方式便不再需要不厌其烦地来回查找某个 DOM 元素,然后操作 DOM 去更改 UI。

React主要用于构建UI。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面,这些代码片段被称作“组件”。用户可以在React里传递多种类型的参数,如声明代码,渲染UI、传递静态的HTML DOM元素、动态变量、甚至是可交互的应用组件。React主要的特性体现在它采用了声明范式,可以轻松描述应用。此外,React通过对DOM的模拟,最大限度地减少与DOM的交互。并且React可以与已知的库或框架很好地配合。

在UI渲染过程中,React通过在虚拟DOM中的微操作来实现对实际DOM的局部更新,因此渲染速度非常快,React支持跨浏览器。此外,React编写了独立的模块化UI组件,遇到问题可以方便地进行隔离。

资料来源:
React 中文文档

版权声明:本文中所有内容均属于阿里云开发者社区所有,任何媒体、网站或个人未经阿里云开发者社区协议授权不得转载、链接、转贴或以其他方式复制发布/发表。申请授权请邮件developerteam@list.alibaba-inc.com,已获得阿里云开发者社区协议授权的媒体、网站,在转载使用时必须注明"稿件来源:阿里云开发者社区,原文作者姓名",违者本社区将依法追究责任。 如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件至:developer2020@service.aliyun.com 进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
+ 订阅

阿里经济体前端技术最新内容汇聚在此,由阿里经济体前端委员会官方运营。我们的愿景是建立全球一流的前端团队,链接商业,让数字世界触手可及是我们的使命。阿里经济体前端委员会致力于加强技术前瞻性、推进集体成长、提升国际影响力。同时我们运营着阿里经济体前端的官方公众号:Alibaba F2E,欢迎关注。

官方博客
官网链接