最近更新
阅读排行
关注本站

angular、avalon、Vue、react的区别

阅读:5305 次   编辑日期:2016-11-28

目录:

概述:

最近双向绑定很火啊,不用双向绑定都不好意思啊,恰巧现在的公司因为历史原因,angular、avalon、Vue都有用(还有React ),抛开怎么使用不谈(自己去看教程~),但是这几个有什么区别、有什么优缺点?今天我们来说说~

angular、avalon、Vue、React 的区别

angular:

谷歌团队维护的angular是一个大而全的框架,功能强大,双向绑定、数据过滤、路由等功能一应俱全,社区生态完善。但是只支持IE8以上浏览器。
说道angular的数据绑定不得不说ta的脏检测机制,angular对常用的事件进行了封装,触发之后进入digest流程,digest流程会检查所有的watcher,若有变更就渲染,但是如果页面中的watcher过多必然会影响页面性能。

avalon:

司徒正美老师的avalon是一个更适合中国互联网环境的框架,因为支持到IE6啊,IE6是多么让中国前端苦恼的一件事,不过随着最近几年的发展,IE6已经逐渐的不被重视。
avalon的数据绑定是靠Object.defineProperty来实现的,然后定义的时候设置set get访问器,每次数据读取设置都需要通过访问器,然后检查是否改变。其中avalon对于不支持Object.defineProperty的采用了VBScript模拟实现。这方便的性能比angular更好。
但是avalon相比angular功能的确差点意思啊~不过日常用足够了,中小项目建议选择avalon。
不过再最新的chrome中双向绑定偶尔会失效,因为chrome升级之后中文无法同步到vm,解决办法,找到compositionEnd:
	function compositionEnd() {
        composing = false;
        setTimeout(updateVModel)
    }
当然下载最新的avalon也能解决了。

Vue:

话说我很喜欢尤雨溪老师的Vue,angular是大而全Vue就是小而美,适合移动端开发。Vue也许是这几个框架里面性能最好的。
Vue实现双向绑定的原理与avalon类似,但是Vue不支持IE8。可以配合使用第三方 CSS 动画库,如 Animate.css。
Vue2.0已经实现虚拟DOM,没错就是React 让人眼前一亮的Virtual DOM。也一样支持组件式开发。Vue 提供了Vue-cli 脚手架,能让你非常容易地构建项目,包含了 Webpack。
下载最新的Vue

React :

最后说说React 吧,是由facebook团队维护,优点很多,虚拟DOM,组件化、热部署等等,缺点我个人觉得JSX语法不是很符合前端的书写习惯、版本不够稳定。
React 通过diff机制计算出小的页面渲染代价,并且通过get/set实现热部署。
React 则是选择把这些问题交给社区维护,因此创建了一个更分散的生态系统。但相对的,React 的生态系统相比 Vue 更加繁荣。

小结:

总的来说angular大而全,Vue小而美,avalon更加优雅,React 生态系统更加繁荣。

教程:

angular教程:http://www.apjs.net/
将本篇文章分享到:
top