概述
本教程操作环境:windows7系统、Dell G3电脑。
近十年以来,IT行业发展火热,衍生了很多新职业,例如UI设计师、开发工程师、软件测试工程师等等,在众多备受瞩目的新生职业中,Web前端工程师是其中的一员。那么Web前端三大主流框架是什么呢?
web前端三大主流框架是Angular、React、Vue。
1、Angular
AngularJS由Misko Hevery 等人于2009年创建,后来呗谷歌所收购。它是一款优秀的前端JS框架被应用多多种产品中去。它不仅是一个理念先进的前端开发框架,还是一种端对端的解决方案。它遵循架构设计中的MVC模式,提倡数据与逻辑处理组件的松耦合。AngularJS通过指令技术实现了对HTML的自然扩展,以及通过编译技术实现了数据模型与展现视图的双向自动同步,减轻了复杂的DOM操作。另外它也对前端的自动化测试技术提供了良好的支持。
Angular是一种用于创建单一应用程序界面的前端框架,它有许多核心功能例如数据绑定,服务,指令以及依赖注入等等。它具有模块功能强大,拥有自定义命令等优点
特性:
1.良好的应用程序结构
2.双向数据绑定
3.指令
4.HTML模板
5.可嵌入、注入和测试
优点:
1.模板功能强大丰富,自带了极其丰富的angular指令。
2.是一个比较完善的前端框架,包含服务,模板,数据双向绑定,模块化,路由,过滤器,依赖注入等所有功能;
3.自定义指令,自定义指令后可以在项目中多次使用。
4.ng模块化比较大胆的引入了Java的一些东西(依赖注入),能够很容易的写出可复用的代码,对于敏捷开发的团队来说非常有帮助。
5.angularjs是互联网巨人谷歌开发,这也意味着他有一个坚实的基础和社区支持。
缺点:
1.angular入门很容易但深入后概念很多,学习中较难理解。
2.文档例子非常少,官方的文档基本只写了api,一个例子都没有,很多时候具体怎么用都是google来的,或直接问misko,angular的作者。
3.对IE6/7兼容不算特别好,就是可以用jQuery自己手写代码解决一些。
4.指令的应用的最佳实践教程少,angular其实很灵活,如果不看一些作者的使用原则,很容易写出四不像的代码,例如js中还是像jQuery的思想有很多dom操作。
5.DI依赖注入如果代码压缩需要显示声明。
2、React
React,facebook出品,正式版推出是在2013年,比angular晚了4年,但得益于其创新式的VirtualDOM,性能上碾压angularJS,一经推出,火的一塌糊涂。 特点很多,VirtualDOM、JSX、Diff算法等,支持ES6语法,采用函数式编程,门槛稍高,但也更灵活,能让开发具有更多可能性。
特性
1.声明式设计:React采用声明范式,可以轻松描述应用。
2.高效:React通过对DOM的模拟,最大限度地减少与DOM的交互。
3.灵活:React可以与已知的库或框架很好地配合。
优点:
1.速度快:在UI渲染过程中,React通过在虚拟DOM中的微操作来实现对实际DOM的局部更新。
2.跨浏览器兼容:虚拟DOM帮助我们解决了跨浏览器问题,它为我们提供了标准化的API,甚至在IE8中都是没问题的。
3.模块化:为你程序编写独立的模块化UI组件,这样当某个或某些组件出现问题是,可以方便地进行隔离。
4.单向数据流:Flux是一个用于在JavaScript应用中创建单向数据层的架构5.同构、纯粹的javascript:因为搜索引擎的爬虫程序依赖的是服务端响应而不是JavaScript的执行,预渲染你的应用有助于搜索引擎优化。6.兼容性好:比如使用RequireJS来加载和打包,而Browserify和Webpack适用于构建大型应用。它们使得那些艰难的任务不再让人望而生畏。缺点:React本身只是一个V而已,并不是一个完整的框架,所以如果是大型项目想要一套完整的框架的话,基本都需要加上ReactRouter和Flux才能写大型应用。
3、Vue
Vue作为最后推出的框架(2014年),借鉴了前辈angular和react的特点(如VirtualDOM、双向数据绑定、diff算法、响应式属性、组件化开发等)并做了相关优化,使其使用起来更加方便,更容易上手,比较少适合初学者。
特性:
1.轻量级的框架
2.双向数据绑定
3.指令
4.插件化
优点:
1.简单:官方文档很清晰,比Angular简单易学。
2.快速:异步批处理方式更新DOM。
3.组合:用解耦的、可复用的组件组合你的应用程序。
4.紧凑:~18kbmin+gzip,且无依赖。
5.强大:表达式无需声明依赖的可推导属性(computedproperties)。
6.对模块友好:可以通过NPM、Bower或Duo安装,不强迫你所有的代码都遵循Angular的各种规定,使用场景更加灵活。
缺点:
1.新生儿:Vue.js是一个新的项目,没有angular那么成熟。
2.影响度不是很大:google了一下,有关于Vue.js多样性或者说丰富性少于其他一些有名的库
3.不支持IE8。
扩展知识:Vue.js与其他框架的区别?
1. 与AngularJS的区别
相同点:
都支持指令:内置指令和自定义指令。
都支持过滤器:内置过滤器和自定义过滤器。
都支持双向数据绑定。
都不支持低端浏览器。
不同点:
1.AngularJS的学习成本高,比如增加了Dependency Injection特性,而Vue.js本身提供的API都比较简单、直观。
2.在性能上,AngularJS依赖对数据做脏检查,所以Watcher越多越慢。
Vue.js使用基于依赖追踪的观察并且使用异步队列更新。所有的数据都是独立触发的。
对于庞大的应用来说,这个优化差异还是比较明显的。
2. 与React的区别
相同点:
React采用特殊的JSX语法,Vue.js在组件开发中也推崇编写.vue特殊文件格式,对文件内容都有一些约定,两者都需要编译后使用。
中心思想相同:一切都是组件,组件实例之间可以嵌套。
都提供合理的钩子函数,可以让开发者定制化地去处理需求。
都不内置列数AJAX,Route等功能到核心包,而是以插件的方式加载。
在组件开发中都支持mixins的特性。
不同点:
React依赖Virtual DOM,而Vue.js使用的是DOM模板。React采用的Virtual DOM会对渲染出来的结果做脏检查。
Vue.js在模板中提供了指令,过滤器等,可以非常方便,快捷地操作DOM。
(学习视频分享:web前端)
以上就是web前端三大主流框架是啥的详细内容,更多请关注靠谱客其它相关文章!
最后
以上就是落后大地为你收集整理的web前端三大主流框架是啥的全部内容,希望文章能够帮你解决web前端三大主流框架是啥所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复