2017年 JavaScript 框架回顾 -- React生态系统

简介:

首先看看与 React 有关的软件包的生态系统。在 Facebook 构建 React 之初,就有许多来自于开源社区第三方库的软件包。这些软件包使用 React 补充其它功能,以便提供完整的应用程序解决方案。当然,安装包中也存在着提供相似功能的彼此竞争关系。

 

React Router

丰富的 Web 应用程序具有的一个共同特点就是:提供了多个“路由”。这些“路由”本质上是不同的功能块,在浏览器中表现为单独的 URL。React 不需要为简单的应用程序使用路由,同时在一些桌面和移动应用程序环境中,路由也不是必需的。因此,React Router 虽然是最受欢迎的 React 应用程序的路由解决方案,但 React Router 的相对流行程度却只有 React 的一半。

了解 React 的开发者都知道,React 应用于一个明确定义的问题领域并具有明确定义的接口,这也使其本身可以应用于比原本设计的更广泛的应用领域。这种方式虽然增加了开发者使用 React 的 pool,但也进一步提升了 React,扩展了 React 的生态系统,创造了一个有益的循环。React 作为一个部分的解决方案,本质上是不如 Ember 和 Angular 这样的完整框架使用起来方便的。

 

Flux

React 作为一个非完整的解决方案,其中一个尚未解决的问题就是应用程序的数据层部分。当引入 React 时,Facebook 还推出了 Flux(一种管理应用程序中状态的方法)和 GraphQL(一种用于在客户端和服务器之间进行通信的系统)。这两者都不如 React 本身流行。

Flux 在 React 之后不久就被推出了,但却直到2015年中期才得到普及。在这期间,Flux 与 React Router 一起呈同步上升趋势,这也表明 Flux 和 React Router 正在网络应用程序中配合使用。但是,2015年中期之后,Flux 和 React Router 的轨迹发生了很大的分化,Flux 在受欢迎程度上缓慢下滑。

 

Redux

造成 Flux 受欢迎下降的一种原因是 Redux 的崛起。Redux 和 Flux 针对的是应用程序功能中完全相同的部分,Redux 于2015年中期正式推出,并且使用率迅速提高,而 Flux 则在同一时期开始逐渐下滑。Redux 现在几乎和 React Router 的相对流行程度相当,而且两者相互紧密相关,并且都越来越受欢迎。这也表明 Redux 已经取代 Flux 成为 React 网络应用程序中首选的状态管理系统。

 

MobX

MobX 是2016年中期推出的,也是 Flux 和 Redux 的竞争对手。虽然 MobX 的使用率还不高,但是目前正在快速增长,值得关注。

 

RxJS

RxJS 是 Flux 和 Redux 的另一个竞争的状态管理组件。RxJS 的流行情况不好统计。首先,RxJS 有两个现存版本,一个是传统版本 rx,一个是当前版本 rxjs。这两个版本下载量都很大,其中 rx 下载量正在下降,而 rxjs 下载量正在增长。

RxJS 的使用基本是作为其它项目子依赖的驱动,特别是对于 Angular CLI。这意味着所有使用 Angular 的驱动器,都需要使用相同的 RxJS。同时,RxJS 也被合并到其它一些流行的命令行工具中。

 

GraphQL

GraphQL 与 React 是由 Facebook 同时开发的,但是这两者之间并没有内在的联系。GraphQL 是 Web 客户端查询服务器数据的一种方式。GraphQL 通过名为 Relay 和 Apollo 的两个竞争库得到了普及,Relay 和 Apollo 提供了一个 Web 应用程序,用于生成 GraphQL 和管理数据流。

Relay 首先被发布,并且正在增长,但是半年后发布的 Apollo 却上升的更快,同时也越来越受到欢迎,并且增长速度还在明显加快。虽然 GraphQL 开发者使用量的绝对数还很小,但是 Apollo 的增长轨迹意味着 GraphQL 很值得开发者关注。

 

React生态系统概述

通过上图中 React 生态系统12个月的变化趋势,可以得到以下结论:

  • Apollo 的使用率正在快速增长。

  • Flux 的使用率正在下降。

  • React Router 和 Redux 都非常受欢迎,并且在使用中具有紧密相关的联系。

  • MobX 具有良好的增长,但其使用率还远没有到达 Redux。

  • React 本身的生态系统是巨大的。

 

JavaScript 开发工具推荐

SpreadJS 纯前端表格控件是基于 HTML5 的 JavaScript 电子表格和网格功能控件,提供了完备的公式引擎、排序、过滤、输入控件、数据可视化、Excel 导入/导出等功能,适用于 .NET、Java 和移动端等各平台在线编辑类 Excel 功能的表格程序开发。



本文转自 powertoolsteam 51CTO博客,原文链接:http://blog.51cto.com/powertoolsteam/2064473,如需转载请自行联系原作者

相关文章
|
5月前
|
编解码 前端开发 JavaScript
js react antd 实现页面低分变率和高分变率下字体大小自适用,主要是配置antd
在React中结合Ant Design与媒体查询,通过less变量和响应式断点动态调整`@font-size-base`,实现多分辨率下字体自适应,提升跨设备体验。
267 2
|
7月前
|
JavaScript 前端开发 API
对比Vue框架与React库的主要区别
在选择Vue还是React时,考虑项目的需求、团队的熟悉程度和个人偏好至关重要。如果项目需要快速原型开发和较小的学习曲线,Vue可能是更好的选择。相反,如果项目需要更大的灵活性,或者项目团队已经有React的经验,那么React可能是更合适的选择。
382 13
|
10月前
|
JavaScript 前端开发 API
|
9月前
|
运维 前端开发 数据可视化
【CodeBuddy】挑战一句话开发一个完整项目之:React表单验证系统
本文分享了一个基于React 19构建的用户注册表单系统,采用模块化CSS和状态驱动视图更新,实现实时校验、错误提示与提交反馈等功能。核心亮点包括验证规则引擎(如密码复杂度校验)、交互反馈体系(输入框警示、按钮禁用)及加载动画优化。通过函数式更新确保状态同步,正则表达式实现多条件验证,CSS伪元素打造流畅体验。代码结构清晰,可扩展性强,适合作为React表单开发模板。文末附CodeBuddy免费下载链接,助力高效开发!
248 1
【CodeBuddy】挑战一句话开发一个完整项目之:React表单验证系统
|
前端开发 Java 编译器
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
381 36
当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
|
10月前
|
前端开发 JavaScript NoSQL
使用 Node.js、Express 和 React 构建强大的 API
本文详细介绍如何使用 Node.js、Express 和 React 构建强大且动态的 API。从开发环境搭建到集成 React 前端,再到利用 APIPost 高效测试 API,适合各水平开发者。内容涵盖 Node.js 运行时、Express 框架与 React 库的基础知识及协同工作方式,还涉及数据库连接和前后端数据交互。通过实际代码示例,助你快速上手并优化应用性能。
|
数据采集 人工智能 自然语言处理
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
Midscene.js 是一款基于 AI 技术的 UI 自动化测试框架,通过自然语言交互简化测试流程,支持动作执行、数据查询和页面断言,提供可视化报告,适用于多种应用场景。
3622 1
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
|
缓存 监控 JavaScript
Vue.js 框架下的性能优化策略与实践
Vue.js 框架下的性能优化策略与实践
|
前端开发 JavaScript 测试技术
React 中集成 Chart.js 图表库
本文介绍了如何在 React 项目中集成 Chart.js 创建动态图表,涵盖基础概念、安装步骤、代码示例及常见问题解决方法,帮助开发者轻松实现数据可视化。
434 11
|
存储 前端开发
在React框架中,如何使用对象来管理组件的状态
在React中,组件状态通过`state`对象管理,利用`setState`方法更新状态。状态变化触发组件重新渲染,实现UI动态更新。对象结构清晰,便于复杂状态管理。