vue和html5区别,简单描述 vue 和其他框架的区别
现在vue已经是前端主流的框架了,采用MVVM模式,虚拟dom,diff算法,数据双向绑定,提供响应式和组件化的视图组件。将注意力集中保持在核心库。体积小,性能好,生态系统庞大,发展也很不错。相对应的还有React,Angular,Riot,Ember等框架,那么为什么要推荐使用vue呢,他较于其他框架优点是什么呢? 更强大的React跟他有什么区别呢?vuevue的优点:Vue学习简单, API
现在vue已经是前端主流的框架了,采用MVVM模式,虚拟dom,diff算法,数据双向绑定,提供响应式和组件化的视图组件。将注意力集中保持在核心库。体积小,性能好,生态系统庞大,发展也很不错。相对应的还有React,Angular,Riot,Ember等框架,那么为什么要推荐使用vue呢,他较于其他框架优点是什么呢? 更强大的React跟他有什么区别呢?
vue
vue的优点:
Vue学习简单, API简单,模式拥抱传统的web,入手快,适合快速开发
社区 和官网都在更新发展相对于的功能,React的JSX,Angular的TS等都可以支持,Angular的watcher慢等问题在vue中都得到了相应的解决
性能更好,体积更小
构建工具webpack等有默认配置,可以让你专注于应用,但同时又很灵活,可以根据你的需求配置
基于依赖追踪的观察系统并且异步队列更新,所有数据变化都是独立触发的,除非他们之间有明确的依赖关系
组件指令,生命周期,数据流都更清楚
在普通js对象上建立响应,提供自动化计算属性
和React比较
某个组件状态发生变化时,以该组件为根,重新渲染整个组件子树,(而vue会自动追踪)
css 也在JSX中,vue的模板形式比jsx读写起来更自然,提高开发效率,因为你更熟悉传统的web写法。而且vue的v-on等修饰符的功能React需要很多代码实现
React 学习更陡峭,vue的路由库和状态管理库都是由官方维护支持于核心库同步更新的,而React则给社区维护,生态系统相对分散,但是React的生态更繁荣。
和Angular.js比较
复杂性: VUE在api与设计上更简单,可以快速学习并投入开发
灵活性和模块化:Vue有vuecli可以快速构建。配置默认,不需要花费太多的时间在配置上,你可以专注于应用本身。同时提供了根据实际需求调整每个工具配置的灵活性,
数据绑定:Vue在不同组件内强制使用单向数据流,这使得数据流更加清晰易懂
指令和组件:vue的指令和组件分的更清晰
需要重量级别的polyfills来帮助,性能下降
浏览器本身不支持这些功能
computed方法不灵活
vue只能支持到IE9,(但是他可以支持到IE6)
发展缓慢,略显老旧,系统缺少完备的生命周期事件方法
接口设计理念不同
vue在普通js对象上建立响应,提供自动化计算属性,(而Ember是在Ember对象上手工为计算属性声明依赖)
vue的模板语法可以用全功能的js表达式,(而handlebars的语法和帮助函数很受限)
性能上,vue比ember好很多,vue能自动批量更新,(而Ember需手动管理)
vue性能更好(riot使用遍历DOM树)
vue有更多的成熟工具支持比如webpack,(riot构建靠社区)
大白话就是:
vue 和其他框架相比较
React:规模上学习曲线陡峭,性能上需手动实现方法避免不必要的子组件的渲染,HTML上要使用JSX 不如传统的HTML,CSS入手快,甚至现在css都要在jsx中。对新手或者想要快速开发一个项目的人员不友好,还要去学习JSX,想把原来项目迁移成新库的话也不是很友好。而且vue中的v-on等指令在react中需要大量代码实现。React的跨平台很强大,但是vue现在也有和Weex合作,vue也支持JSX快速构建项目等React有的功能。
Angular1:API复杂,灵活度不如VUE,指令组件划分不清晰,watcher多时性能越来越差
Angular2:学习成本大,必须要用TS,体积要比vue大,中小型项目不需要,不能快速的开发项目,要先学习
Rnockout 发展缓慢
Ember需要手动
Riot 构建工具不行
Polymer需要额外的工具,computed方法不灵活
下面是各个框架详细的介绍
一、React
1. 运行时性能
Vue应用中, 组件的依赖是在渲染过程中自动追踪的,所以系统精准的知道哪个组件确实需要被重新渲染,而React对于不必要重渲染的子组件时需要手动实现shouldComponentUpdate方法
2. HTML&&css
css也用JSX处理,并不是每个开发者都喜欢,vue也支持JSX,迁移的话vue更贴合传统的写法,这样新人参与更快
3. 规模
React 学习更陡峭,vue的路由库和状态管理库都是由官方维护支持于核心库同步更新的,而React则给社区维护,生态系统相对分散,但是React的生态更繁荣。
React的create-react-app 有一些局限性
4. 原生渲染
React Native 能同时跨多平台开发。vue 在和weex(阿里)合作,但成熟度不如weex
5. MobX
Mbox+react 月等于Vue
6. Preact 和其他类React库
类 React 的库们往往尽可能地与 React 共享 API和生态。但生态更小。因为这些库无法 100% 兼容 React生态中的全部,部分工具和辅助库也可能无法使用。或者即使看上去能工作,但也有可能随时发生不兼容,除非你用的这个类 React 库官方与 React 保持严格一致。
二、AngularJS(Angular1)
2009年诞生的JS框架,后被谷歌收购。核心功能:MVC,模块化,自动化双向数据绑定,语义化标签,依赖注入等。是以一个js文件形式发布的,可以通过script标签添加到网页中,vue早起开发的灵感来源
1.指令和组件
每件事情都是指令来做的,组件只是一种特殊的指令.vue 中指令和组件分的更清楚,指令只封装DOM操作,而组件代表一个自给自足的独立单元
2.灵活性
Angular必须遵守指定的规则,灵活性差
3.复杂性
API和设计比VUE复杂一些
4.运行时性能
watcher越多,就越慢,因为作用域内每一次变化,所有的watch都要重新计算。并且如果一些watcher触发另一个更新,脏检查循环可能要运行多次,要用深奥的技术,解决脏检查循环的问题,有时没有简单的办法来优化有大量watcher的作用域
三、Angular(Angular2)
1.TS
必须用TypeScript开发,在中小型项目中,TS并不是所有人都想用的。而Vue可以用也可以不用
2.运行时性能
运行时候性能都很快
3.体积
虽然体积在使用了tree-shanking和AOT后已经减小了许多, 但是还是比vue大
4.灵活性
Vue更灵活
5.学习曲线
学习曲线陡峭,API很大,要理解很多概念才能有效的工作。
设计目标是针对大型的复杂应用,但是这样对一些经验不丰富的开发者非常的不友好
以下都是一些小众的框架
四、Polymer.js:
谷歌2013年发布的一个新的webUI框架。和vue比较相似,vue的灵感来源之一
缺点
- computed方法的实现不灵活
- 基于web components 标准之上,需要重量级的polyfills来帮助工作,那么性能就会下降
- 浏览器本身不支持这些功能,而vue支持IE9的情况下不需要依赖polyfills来工作
复制代码
五、Knockout.js
微软出版的MVVM模型领域内的先驱,兼容IE6,核心功能:属性监控和依赖追踪,声明式绑定, 模板机制
缺点:
- 发展缓慢
- 缺少完备的生命周期事件
复制代码
六、Riot.js
MVP(模型-视图-呈现)开源客户端框架,特点体积小,不足1kb,但可以构建大规模的web应用程序,现在是Riot3.8版本,已经趋于稳定,可以用在生产环境
缺点:
- 国内相关资料很少,所以更适合定制化比较高的项目
- 微型场景更适合Riot,不想要太多的外部依赖,又需要组件化,数据驱动等现代化框架的能力
- 好用的Riot构建工具并不多
复制代码
七、Ember.js
是一个MVC模式的开源的js客户端框架,2011年12月发布,属于社区开发者,文档很友好,ember-cli快速构建,提供了大量的约定,只要按照约定,就会变得非常高效
缺点:
- 学习成本大,而且并不灵活
- 页面渲染慢
- 框架体积大
复制代码
更多推荐
所有评论(0)