• vue和angular的区别:


    相同:

    1.数据绑定:vue和angular绑定都可以用{{}}

    2.都支持内置指令和自定义指令

    3.都支持内置过滤器和自定义过滤器。

    区别:

    1.学习成本和API 设计:vue相比于angular来说更加的简单

    angular:学习成本比较高,比如增加了dependency injiction特性。Angular 尽管学习曲线较为陡峭,但却是构建完整复杂应用的好选择。

    vue:本身提供的API都比较简单、直观。Vue.js 是轻量级的开发框架,很适合开发小规模灵活的 Web 应用程序;

    在 API 与设计两方面上 vue比 angular 简单得多,因此你可以快速地掌握它的全部特性并投入开发。

    2. 性能上:

    angular:依赖对数据做脏检测,所以watcher越来越多;

    vue:使用基于依赖追踪的观察,并且使用异步队列更新,所有的数据都是独立触发的。

    .vue的双向绑定是基于ES5 的 getter/setter来实现的,而angular而是由自己实现一套模版编译规则,需要进行所谓的“脏”检查,vue则不需要。

    因此,vue在性能上更高效,但是代价是对于ie9以下的浏览器无法支持。

    3.运行速度:vue相当于angular要变得小巧很多,运行速度比angular快.

    4.指令:vue指令用v-xxx,angular用ng-xxx

    angular用的指令是ng-前缀的,而vue是v-

    5.组件:vue有组件化概念,angular中没有

    6.数据存放位置: vue中数据放在data对象里面,angular数据绑定在$scope上面。

    7.挂载数据方式:

    angular挂载数据的方法
    var app = angular.module('myApp', []);
    app.controller('customersCtrl', function($scope) {
        $scope.list = [{},{},{}];
        $scope.method = function(){
            console.log("angular");
        }
    })

    vue挂载数据的方法
    var V = new Vue({
        el:"#app",
        data:{
            list:[{},{},{}]
        },
        methods:{
            method:function(){
                console.log("vue");
            }
        }
    })

    可以看出angular所有的数据和方法都是挂载在$scope上,

    而vue的数据和方法都是挂载在vue上,只是数据挂载在vue的data,方法挂载在vue的methods上。

    8.数据绑定
    Angular 1 使用双向绑定,
    Vue 在不同组件间强制使用单向数据流。这使应用中的数据流更加清晰易懂。

    10.总结:Vue.js 有更好的性能,并且非常非常容易优化,因为它不使用脏检查。Angular,当 watcher 越来越多时会变得越来越慢,因为作用域内的每一次变化,所有 watcher 都要重新计算。并且,如果一些 watcher 触发另一个更新,脏检查循环(digest cycle)可能要运行多次。 Angular 用户常常要使用深奥的技术,以解决脏检查循环的问题。有时没有简单的办法来优化有大量 watcher 的作用域。Vue.js 则根本没有这个问题,因为它使用基于依赖追踪的观察系统并且异步列队更新,所有的数据变化都是独立地触发,除非它们之间有明确的依赖关系。唯一需要做的优化是在 v-for 上使用 track-by。

  • 相关阅读:
    jQuery 如何存储,获取和删除 Cookies
    mysql调用存储过程出现Illegal mix of collations错误
    vim IDE
    android 播放Raw文件夹下的音乐文件
    7种形式的Android Dialog使用举例
    Chronometer 计时器使用
    获取屏幕,适应屏幕
    android 碎片
    安卓开发者必备的42个链接
    自定义TabActivity,TabActivity的美化
  • 原文地址:https://www.cnblogs.com/dhpong/p/10771267.html
Copyright © 2020-2023  润新知