前端三大主流框架Vue React Angular有何不同?

前端主流框架,Vue React Angular,大家可能都经常在使用,Vue React,国内用的较多,Angualr相对用的少一点。但是大家有思考过这三大框架的不同吗?

一、项目的选型上

中小型项目:Vue2、React居多

型项目:Vue3、React居多、Angular次之(出于维护等方面考虑,国内使用的相对少一点)

首先在做项目的选型上,Vue3没出来以前(即vue2的时候)大型项目更多的考虑选选择React,Angular也有一些(相对较少,这是因为Angular在国内用的人相对来说少一点,而且维护相对来说没有react和vue方便,angular的UI框架相对没那么丰富,不过最近几年也开始慢慢地更多UI框架也兼容了支持angular),因为Vue2的双向绑定比较耗性能,但是现在出了vue3后,Vue3在vue2的基础上做了很多的改进,目前大型项目也可以选vue3了。Angular用的是typescript语法。

二:双向绑定的不同

(1)其中vue2与vue3的大家可看看以下这篇,就不再赘述了

Vue2与Vue3的区别-CSDN博客

(2)React

使用的是虚拟DOM和事件监听来实现。它相当于创建复制了一棵DOM树,一旦数据发生变化,会通过diff算法去一一比较修改。React 中的双向绑定通常是通过状态(state)和设置状态的函数(setState)来实现的,而不是直接操作 DOM 元素的值。双向绑定意味着数据可以从用户界面流向状态,同时状态的变化也能立即反映到用户界面上。

(3)Angular则是用的脏值检测,就是一旦数据发生了变化,所有的数据会从上到下整个一一检测,比较耗费性能

三、UI框架支持

各自都有不同的UI框架支持,除了以下的,还有其他的,目前用的比较多的有以下几个:

(1)Vueelement-ui 、element plus 、antdesign vue...等

  (2) Reactantdesign、antdesignPro...v

(3) Angularmaterial、boostrap...

四、全局状态管理

(1)Vue:Vuex、Pinia

其中:a)Vuex是 Vue.js 的状态管理模式和库,‌它采用集中式存储管理应用的所有组件的状态,‌并以相应的规则保证状态以一种可预测的方式发生变化,Vuex 需要额外的配置支持 TypeScript。

         b)Pinia:是 Vue 的存储库,Pinia 基于更加原子的设计,每个 store 都是完全独立的,它允许您跨组件/页面共享状态,比Vuex会更小一点,类似 Vuex, 是 Vue 的另一种状态管理方案。

Pinia 原生支持 TypeScript。

 (2) React:ReduxRedux Toolkit

     其中:a)Redux :是一个不可变状态容器,‌用于 JavaScript 应用的可预测状态管理。‌它提供了一个单一的全局存储来管理应用的状态

              b)Redux Toolkit :是 Redux 的一个增强工具集,‌集成了 Redux 的核心功能,‌并提供了一系列的工具和方法,‌以帮助开发者更高效地进行状态管理

 (3) Angular:NgRx(NgRx 是一个基于 RxJs 构建的状态管理库,‌它利用 TypeScript 的类型特性来简化实现,‌例如 reducer 的创建和促进类型安全编程。‌NgRx 提供了对状态管理的全面支持,‌包括数据的持久化、‌中间件支持等,‌适合构建大型、‌复杂的应用程序

五、社区支持

(1)vue和react的社区支持比较庞大,遇到问题方便及时快速得到解决 

 (2)vue更容易上手、react也一样但是由于国内用的angular相对较少,所有angular的资源相对没那么丰富

六、学习 曲线

(1)Vue的学习曲线相对较为平缓。它的API更加直观和易于理解,对于初学者来说更加友好。Vue还提供了许多工具和插件来帮助开发者提高开发效率。

(2)React的学习曲线相对较陡,特别是当你开始深入了解其生态系统(如Redux、React Router等)时。但是,一旦你掌握了React的核心概念和模式,你将能够构建出高性能和可维护的应用程序。

(3)Angular:Angular的学习曲线介于React和Vue之间。由于Angularjs(即Angular1)其MVC架构和内置的指令系统,它提供了更清晰的组织代码的方式。然而,随着Angular的发展(如升级到Angular 2+),它的API和概念也在不断变化,这可能给初学者带来一些挑战

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/843354.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

昇思25天学习打卡营第23天 | 基于MindSpore的红酒分类实验

学习心得:基于MindSpore的红酒分类实验 在机器学习的学习路径中,理解和实践经典算法是非常重要的一步。最近我进行了一个有趣的实验,使用MindSpore框架实现了K近邻(KNN)算法进行红酒分类。这个实验不仅加深了我对KNN算…

layui 让table里的下拉框不被遮挡

记录:layui 让table里的下拉框不被遮挡 /* 这个是让table里的下拉框不被遮挡 */ .goods_table .layui-select-title,.goods_table .layui-select-title input{line-height: 28px;height: 28px; }.goods_table .layui-table-cell {overflow: visible !important; }.…

用DrissionPage过某里滑块分析

最近我又在找工作了,悲哀啊~,面试官给了一道题,要求如下: 爬虫机试:https://detail.1688.com/offer/643272204627.html 过该链接的滑动验证码,拿到正确的商品信息页html,提取出商品维度的信息&a…

详解SVN与Git相比存在的不足

原文全文详见个人博客: 详解SVN与Git相比存在的不足截至目前,我们已既从整理梳理的SVN和Git在设计理念上的差异,也重点对二者的存储原理和分支管理理念的差异进行深入分析。这些差异也直接造成了SVN和Git在分支合并、冲突解决、历史记录管理…

数据结构之二元查找树转有序双向链表详解与示例(C/C++)

文章目录 1. 二元查找树(BST)简介2. 有序双向链表(DLL)简介3. 二元查找树的实现4. 转换为有序双向链表的步骤5. C实现代码6. C实现代码7. 效率与空间复杂度比较8. 结论 在数据结构与算法中,树和链表都是非常重要的数据…

【Linux】进程间通信之-- 共享内存与信号量的介绍(下)

前言 上一篇,我们由进程间通信,引入并讲述了管道、匿名管道和命名管道,本节,将继续学习进程间通信的另一种方式之,共享内存。还要学习几个系统调用接口,并演示两个进程通过共享内存来进行通信。。。 目录 1…

WGS84经纬度坐标 GCJ02火星坐标 BD09百度坐标互相转换

WGS84经纬度坐标 GCJ02火星坐标 BD09百度坐标互相转换 背景:uniapp做的微信小程序,使用到了相机拍照并获取位置坐标信息;在腾讯地图上展示坐标点位置信息; 由于业务需要我们的PC端用的不是腾讯地图,需要使用WGS84坐标或…

Java二十三种设计模式-代理模式模式(8/23)

代理模式:为对象访问提供灵活的控制 引言 代理模式(Proxy Pattern)是一种结构型设计模式,它为其他对象提供一个代替或占位符,以控制对它的访问。 基础知识,java设计模式总体来说设计模式分为三大类&#…

【网络】socket和udp协议

socket 一、六个背景知识1、Q1:在进行网络通信时,是不是两台机器在进行通信?2、端口号3、端口号vs进程PID4、目的端口怎么跟客户端绑定的呢?也就是怎么通过目的端口去找到对应的进程的呢?5、我们的客户端,怎…

uniapp小程序上传pdf文件

<template><view class"mainInnBox"><view class"formBox"><!-- 注意&#xff0c;如果需要兼容微信小程序&#xff0c;最好通过setRules方法设置rules规则 --><u-form :model"form" ref"uForm" :rules&quo…

Window版本nginx修改文件访问句柄数被限制,解决大并发量访问时无法响应问题

目录 一、问题背景 二、问题分析 三、解决办法 一、问题背景 Windows版本因为文件访问句柄数被限制为1024了&#xff0c;当大并发量访问时就会无法响应。会有如下错误提示&#xff1a;maximum number of descriptors supported by select() is 1024 while connecting to ups…

C# 基础语法(一篇包学会的)

C#&#xff08;读作"C Sharp"&#xff09;是一种现代的、通用的面向对象编程语言&#xff0c;由微软公司开发。它结合了C和C的强大特性&#xff0c;并去掉了一些复杂性&#xff0c;使得开发者可以更加高效地编写代码。 一、入坑C# (一) 安装和设置 首先&#xff0c…

【LeetCode】从中序与后序遍历序列构造二叉树

目录 一、题目二、解法完整代码 一、题目 给定两个整数数组 inorder 和 postorder &#xff0c;其中 inorder 是二叉树的中序遍历&#xff0c; postorder 是同一棵树的后序遍历&#xff0c;请你构造并返回这颗 二叉树 。 示例 1: 输入&#xff1a;inorder [9,3,15,20,7], …

鸿蒙OpenHarmony Native API【Rawfile】

Rawfile Overview Description: 提供操作rawfile目录和rawfile文件的功能 提供操作rawfile目录和rawfile文件功能 功能包括遍历、打开、搜索、读取和关闭rawfile Since: 8 Version: 1.0 Summary Files File NameDescription[raw_dir.h]提供rawfile目录相关功能[raw…

Debian Linux下rclone挂载谷歌云盘碰到的坑

可能是明月好久没有使用境外服务器挂载境外的云盘缘故吧,今天一个代维客户需要他的Linux服务器挂载谷歌云盘好进行云备份,本来是个很简单的事儿,没想到在rclone连接谷歌云盘的时候卡壳了,可是把明月给难为坏了,搜索到的简体中文教程倒是很多,但没有一个提到这个“坑”,最…

Docker启动PostgreSql并设置时间与主机同步

在 Docker 中启动 PostgreSql 时&#xff0c;需要配置容器的时间与主机同步。可以通过在 Dockerfile 或者 Docker Compose 文件中设置容器的时区&#xff0c;或者使用宿主机的时间来同步容器的时间。这样可以确保容器中的 PostgreSql 与主机的时间保持一致&#xff0c;避免在使…

C语言数组的相关案例

引导案例&#xff1a; 数组的遍历&#xff1a;这里需要注意的是我们在遍历数组时是使用for循环&#xff0c;这里则需要计算数组的长度 计算公式&#xff1a;sizeof(数组名) / sizeof(数组的数据类型) #include<stdio.h> int main() {int arr[] { 1,2,3,4,5,6,7,8 ,9,…

大厂面试-基本功

大厂面试第4季 服务可用性多少个9是什么意思遍历集合add或remove操作bughashcode冲突案例BigdecimalList去重复IDEA Debugger测试框架ThreaLocal父子线程数据同步 InheritableThreadLocal完美解决线程数据同步方案 TransmittableThreadLocal 服务可用性多少个9是什么意思 遍历集…