1.angular

1.1. 简介:

angular是最早出现的框架,
angularjs是通过directive(指令)去封装组件,react和vue是通过component。

1.2. 优点:

1、背后靠山(google),有着稳定的维护团队。且google的Adwords业务就使用了angular,作为一个赚钱的业务,google也会让它的环境更稳定一些。
2、angular+typescript,google和微软的双剑合璧。angular全面支持typescript语法,typescript不仅包含es6中的语法,也包括一些新的语法,
最重要的一点是它增加了类型规则,这让代码的可读性和可维护性大大的提高,它也可以让有java或.net背景的开发人员更快的掌握。
3、完整。其实相对react和vue来说,angular更可以说是一个框架,而react和vue本身只能算是一个库。angular自带了几乎所有页面应具有的功能,路由、表单、ajax、模版、双向数据绑定等等。它原生的form表单模块非常强大,除了双向绑定的基本功能,还自带验证等,开发人员不需要再去为了这些功能找第三方库,angular一个框架就包含了这些的所有,因此对于选择困难症人群,这是一个优点。
4、每个框架都有自己的cli脚手架,可以快速搭建项目雏形。angular-cli自带国际化。
5、它的每一个组件都是一个文件夹,html、js、和css文件是分开的,让代码更加清晰
而且它的各类型文件单独存在,在开发中使用任何IDE都可以检查代码。可以使用自带的格式化功能,让开发过程中的代码更整洁

1.3. 缺点:

1、难调试,angular的代码整洁、规范,很容易维护和审查,但是它的控制台报错信息太差了,大部分情况是无法看出问题到底在哪,这就在开发过程中给调试增加了很大的难度。而react和vue在开发中会更加明确的让开发人员了解到错误出在哪里。
2、太重了,它自带了很多模块,这解决了开发人员在选择上耗费的时间,压缩后达到了168k,是vue50k的三倍还多,即使在4版本中,拆分了一些功能,但是它依然还是很重
3、学习成本,angular它有超多的概念,有一些单单通过文档还很难于理解,还有不友好的api文档。因为它的东西太多,所以api文档内容也很多,增大了阅读难度。这就导致了刚接触angular的人很难上手。也给心理上造成了很大的压力,那文档一看就不想看了,还有api,它是英文的。

2.React

2.1. 简介:

react本身不能算作一个框架,因为它本身的功能有限,不过它有一个庞大的生态系统,全世界无数开发人员在为它提供开源包,
也许对于开发人员一个很难完成的问题已经有其他人员帮你完成了,只需要引入就好了。

2.2. 优点:

1、后台(facebook)
2、轻量,体积小本来应该是算在react和vue的优点中,但是在一个大型的项目中,就比如一般的react要用的是 react+redux+react-router或许还要加上发送请求的axios,如果有一些其他的需求还要再加包,vue也同样,vue+vuex+vue-router+vue-axios,这就导致react和vue体积小的优点在逐步减小。所以这一方面我们应该说react和vue的 可组装性 是强于angular的,更加灵活,想用什么用什么。
3、react的单项数据流机制,这相对angular的双向数据流来说,因为单向,所以它的各种变化都是可预计的,不像双向数据流,一旦数据流复杂起来,大家都互相触发变化,开发人员根本猜不出你改变一个地方会在另外什么地方跟着变。
4、react-native,一个优秀的移动端开发框架,使用react特有的jsx语法,可以让开发人员像写pc端页面那样去写移动端,它自动适配了不同的移动端的屏幕分辨率。jsx语法是将html融入到js中。
5、state,所有的数据都储存在state中,只可以使用setState方法去改变。开发人员可以把所有的数据都存放在state中,让所有组件都去这里边取数据,当然如果组件过多的话会让顶级组件的state过重,这时可以将公用的放在顶级state中,各自私用的存放在自身的state中。这样在开发和维护的过程中只需要关注各个state就好。

2.3. 缺点:

1、react的灵活性就导致了在选择上要耗费成本,确定使用框架的人要去考量这个项目有哪些功能,要用到哪些包还要去看哪些包的质量要高一些,因为相同的功能也会有很多开源人员贡献包。这些工作耗费的时间成本也是一个项目不得不考虑的问题。这一问题在vue上也同样存在
2、react的jsx语法,它学习起来并不是很难,应该是比ts要简单一些。但是它的写法是把html和js结合起来,这就导致在一些IDE上,你没法对它格式化,如果格式化的话,它会将html像js语法那种格式排列。代码的可读性要差一些。而且在js中写html时就要避免两者出现相同的关键字,比如class,在jsx中就要写成className,还要是驼峰式写法
3、使用redux,redux在处理数据流的时候是使用saga语法,开发人员要去学习saga的写法,然后saga的异步操作和同步操作是分开在两个函数中写,要在组件本身写一次,数据流到父组件时还要再写一遍,写法上要更复杂,如果想简化它,就要用一个前端应用框架-DVA,就还是通过加东西来增加开发效率。
4、virtual DOM,vue会跟踪每一个组件的依赖关系,不需要重新渲染整个组件树.而对于React而言,每当应用的状态被改变时,全部组件都会重新渲染,所以react中会需要shouldComponentUpdate这个生命周期函数方法来进行控制

3.Vue

3.1. 简介:

vue的一个特点是每一个.vue文件都是一个组件,在这一个vue文件中包括style、scripts、template三个标签来包含css、js和html。
它是最后一个出现的框架,所以在它的实现中,它取其他两个框架之长,去其他两个框架之短,借鉴了许多好的设计理念,
比如angular的指令、双向绑定,react的component思想。

3.2. 优点:

1、国产框架,所以它对国内开发者在学习它时要更友好。所以它的学习成本是三个框架中最低的。中文的api文档,我觉得单这一点,就让国内的开发者在学习vue时能够节省超多的精力。
2、vuex,完成了redux的功能且在写法上更加便捷,不再需要dva这种框架去帮他简便写法。
3、vue的体积是三个框架中最小的,加上它的处理机制,在非大型项目的对比中,它的性能是最高的。vue在非大型项目上,有了react和angular的优点,且更简单,更易上手。
4、vue会跟踪每一个组件的依赖关系,不需要重新渲染整个组件树
5、vue实现了数据的双向绑定,react数据流动是单向的

3.3. 缺点:

1、vue的响应系统无法检测属性的添加和删除,以及某些数组的修改,开发人员有时会忽略这一点。
2、它毕竟发展的时间没有它们长,生态环境要更小,有时在开发中出现了问题,无法在网络上寻求到有效的帮助

4.综合

4.1. 效率:

angular、react和vue都是mvvm模式,(model,view,view-model),angular的数据绑定、操作dom就是通过viewmodel完成的。react和vue的view-model的高效率通过框架自身提供的virtual dom(虚拟dom)来实现,它是一个js对象,我们数据的变化会被映射到这个虚拟dom上,然后虚拟dom再去和真实的dom通过各框架自己的算法进行对比,来修改真实dom结构,这就要比angular的viewmodel直接绑定真实dom树的操作要更有效率一些

4.2. 后台:

angular是google升级、维护。
react由facebook升级、维护。
vue是由中国人尤雨溪和他的团队负责。

前端三大主流框架的区别相关推荐

  1. 前端三大主流框架的区别(三)

    前面两篇已经做了细致的分析,这一篇就总结总结三大主流框架吧 1.angular 1.1. 简介: angular是最早出现的框架, angularjs是通过directive(指令)去封装组件,rea ...

  2. python的前端框架_web前端三大主流框架之Python异步框架如何工作?

    这篇文章我们从 socket 编程的例子来看看 Python 异步框架是如何工作的,需要了解下简单的 socket 编程以及 Linux 提供的 I/O 复用机制. Python 异步框架也是基于操作 ...

  3. Web前端三大主流框架是什么?Web前端前景与就业形势

    近十年以来,IT行业发展火热,衍生了很多新职业,例如UI设计师.开发工程师.软件测试工程师等等,在众多备受瞩目的新生职业中,Web前端工程师是其中的一员.那么Web前端三大主流框架是什么呢? 一.We ...

  4. web前端三大主流框架是什么?

    转载自品略图书馆 http://www.pinlue.com/article/2020/07/1217/0311017786310.html web前端三大主流框架是什么?前端开发师的岗位职责有哪些? ...

  5. web前端三大主流框架介绍

    转自:微点阅读  https://www.weidianyuedu.com web前端三大主流框架是什么? 前端开发师的岗位职责有哪些?微点阅读小编整理了相关内容供大家参考了解,请各位小伙伴随小编一起 ...

  6. 浅谈web前端三大主流框架

    转自:微点阅读(www.weidianyuedu.com)http://www.weidianyuedu.com/ web前端三大主流框架是什么?前端开发师的岗位职责有哪些?小编整理了相关内容供大家参 ...

  7. Web前端三大主流框架是什么?它们的优点和缺点试什么?

    一.Web前端三大主流框架是什么 React: 1.声明式设计:React采用声明范式,可以轻松描述应用. 2.高效:React通过对DOM的模拟,最大限度地减少与DOM的交互. 3.灵活:React ...

  8. Web前端三大主流框架是什么?Web前端前景与就业形势分析

    近十年以来,IT行业发展火热,衍生了很多新职业,例如UI设计师.开发工程师.软件测试工程师等等,在众多备受瞩目的新生职业中,Web前端工程师是其中的一员.那么Web前端三大主流框架是什么呢? 一.We ...

  9. web前端三大主流框架_小猿圈web前端之前端的主流框架都有哪些?

    社会在不断发展,互联网更新换代也是飞速,web框架也是经历一代又一代的革新,那么当今时代什么框架是前端的主流框架呢?小猿圈web前端讲师查了一些资料,整理出当今时代比较流行的三种框架,下面说一下这三种 ...

  10. web前端三大主流框架_web前端三大主流框架

    于前端开发工程师来说,组件化模块的框架能够帮助我们更加快速的搭建自己的网站.下面本篇文章和大家介绍一下web前端的三大主流框架:Angular.React.Vue,让大家可以对这三个框架有一定的了解, ...

最新文章

  1. windows10 mysql 5.5.36 安装
  2. 深度学习与机器学习的思考
  3. mysql安装版和解压版哪个好_iqooneo3和小米10青春版哪个好 参数区别哪个性价比高...
  4. 学习使用markdown(markdown篇)
  5. [Qt教程] 第39篇 网络(九)进程和线程
  6. 改变UITableView选中行高亮的颜色
  7. 详细解读css中的浮动以及清除浮动的方法
  8. 阿里发布《2015-2016中国云栖创新报告》,北上杭深广排名前5
  9. xmu1214: 购物
  10. 给 layui upload 带每个文件的进度条, .net 后台代码
  11. win10默认壁纸_渐变彩色Hero壁纸,微软免费Win10主题《Pride 2020 Flags》下载
  12. 谷歌地球 hosts文件_NO—谷歌地球===YESgt;gt;GoogleEarth
  13. 最长重复子字符串:123321||12321
  14. 2016-2017 ACM-ICPC, South Pacific Regional Contest (SPPC 16)
  15. 硬件工程师有没有35岁危机?
  16. 企业微信应用开发(JS-SDK网页式开发)第一集:创建应用以及配置可信域名
  17. python中英文文本情感分析
  18. 深度学习去燥学习编码_您不应该学习编码的5个理由
  19. 微信电商小程序流量入口介绍
  20. PostgreSQL引入的JSONB解释

热门文章

  1. IT男改变生活之12306选择上,中,下铺
  2. (第六章)UI--PS 基础 图层蒙版与混合模式
  3. 10个免费商用的图片网站分享
  4. xp系统怎么关闭wmi服务器,WinXP系统如何启用WMI服务,教您WinXP系统如何启用WMI服务...
  5. SQL Server 无法启动WMI服务
  6. dht11温湿度传感器工作原理引脚功能电路接线图
  7. python 数学公式显示_python 数学公式·
  8. USB数据采集卡关于高电压数据采集提供的解决方案
  9. Flutter实战】文本组件及五大案例
  10. 深度学习之图像分类(二十一)-- MLP-Mixer网络详解