AngularJS  2 尽管还在Alpha阶段,但主要功能和文档已经发布。让我我们了解下Angular 1 和 2 的区别,以及新的设计目标将如何实现。

1.从移动app开发上面分析:

Angular 1.x 专注于web开发,没有涉及到移动这方面的内容,还好后来杀出个程咬金IONIC移动app开发框架,让angularjs1.x很好的支持了移动开发

Angular 2目标:原生移动支持 – iOS 和 Android

Angular 2 会有两层,应用层和渲染层。例如一个组件可以用不同的 @View 修饰器修饰,根据运行环境可以在运行时生效。

与 React Native 一样,Angular 2 支持:

一次学习,到处书写。这意味着创建原生应用时可以重用你在创建 web 应用时学习的知识。尽管总是有些区别。

2.从服务器端渲染提供支持分析:

支持服务器端的渲染对于搜索引擎的优化和用户感知体验来说是非常重要的;在一个比较大型的Angular 1 的应用中,即使使用了预先定义的缓存模块,我们可以清楚地看到当应用开始启动时,页面的加载过程。

这时候看来 Angualr2 的这部分特征不是很清晰明朗,但是这种思路或许可以从以下几个方面得到体现:

启动开始, 同时所有的组件都被绑定

而渲染没有实现

一个页面在服务器被渲染后 , 然后发送到客户端

Angular 将会把它解析 ,接着会把解析后的页面注入到 DOM 中,这样就避免了出现闪烁的效果

3.从依赖注入分析

在Angular 1  的世界里,依赖注入在构建多模块应用时是一项技术的飞跃, 但是在一些极端的案例中,如果不做出一些重要的变化是不能解决这些问题的。

Angular 1.x 包含对象全局池

Angular 1 其中一个 DI 案例中每个应用仅有一个对象全局池。这就意味着,如果说主路由 loadsbackendService 我们导向了路由 B,可以延迟加载其他服务指定到这个路由。

问题就是,我们说可以延迟加载一个 secondbackendService,使用完全不同的实现:这就会重写第一个!当前还没有办法同一名字有两个不同实现的两个服务,这就会阻止用一个安全的方式从 Angular 1 实现延迟加载。

Angular 1.x 的多重依赖注入机制

在 Angular 1 中, 我们可以使用在多重地方使用不同的方法进行注入:

在链接方法中通过位置注入

在直接定义中通过名字注入

在controller方法中通过名字,等等。

Angular 2 将会作出怎样的该进

而在 Angular 2 中有且仅有一种依赖注入机制: 在构造函数中通过类型注入。

constructor(keyUtils: KeyboardUtils) {
        this.keyUtils = keyUtils;
    }
});

事实上,如果只有一种机制,那么它将变得更加容易学习。同时这种依赖注入器是类似层级结构,在不同层次的组件树,有可能实现对相同类型的不同实现。

如果一个组件没有定义依赖,它会代理给上层注入器查找依赖,依次往上。这让 Angular 2 提供原生的懒加载成为可能。

4.从主要目标分析

Angular 2 的主要目标是创建一个简单易用并且快速工作的 web 框架。让我们看看这是如何达到的:

目标:更易于推论

在当前版本的 Angular 中,我们有时不得已对应特定的使用场景推论框架内部构建,比如必须推论应用事件初始化和摘要循环:

在 Angular 1 中没有摘要循环结束事件 (查看原因),因为这种事件可能会促发更多的变化,以至于使摘要循环持续下去

我们必须推论何时调用 $scope.apply 或 $scope.digest,而这并不总是容易的

有时我们必须调用 $timeoutto让Angular 结束摘要循环,当 DOM 稳定时再做一些操作

为了使 Angular 2 更易于推论,一个目标是创建更多开箱即用的透明内部构建。

话说:Angular1.x显然非常成功,那么,为什么要剧烈地转向Angular2?

1.性能的限制

AngularJS当初是提供给设计人员用来快速构建HTML表单的一个内部工具。随着时间的推移,各种特性被加入进去以适应不同场景下的应用开发。然而由于最初的架构限制(比如绑定和模板机制),性能的提升已经非常困难了。

2.快速变化的WEB

在语言方面,ECMAScript6的标准已经完成,这意味着浏览器将很快支持例如模块、类、lambda表达式、 generator等新的特性,而这些特性将显著地改变JavaScript的开发体验。

在开发模式方面,Web组件也将很快实现。然而现有的框架,包括Angular1.x对WEB组件的支持都不够好。

3.移动化

想想5年前......现在的计算模式已经发生了显著地变化,到处都是手机和平板。Angular1.x没有针对移动应用特别优化,并且缺少一些关键的特性,比如:缓存预编译的视图、触控支持等。

4.简单易用

说实话,Angular1.x太复杂了,学习曲线太陡峭了,这让人望而生畏。Angular团队希望在Angular2中将复杂性封装地更好一些,让暴露出来的概念和开发接口更简单。

AngularJs 1.x和AngularJs2的区别的更多相关文章

  1. AngularJS 服务 provider factory service及区别

    一.概念说明 1.服务是对公共代码的抽象,如多个控制器都出现了相似代码,把他们抽取出来,封装成一个服务,遵循DRY原则,增强可维护性,剥离了和具体表现相关的部分,聚焦于业务逻辑或交互逻辑,更加容易被测 ...

  2. AngularJS 中 Provider 的用法及区别

    在一个分层良好的 Angular 应用中,Controller 这一层应该很薄.也就是说,应用里大部分的业务逻辑和持久化数据都应该放在 Service 里. 为此,理解 AngularJS 中的几个 ...

  3. angularjs link compile与controller的区别详解,了解angular生命周期

     壹 ❀ 引 我在 angularjs 一篇文章看懂自定义指令directive 一文中简单提及了自定义指令中的link链接函数与compile编译函数,并说到两者具有互斥特性,即同时存在link与c ...

  4. angularJS——ng-bind指令与插值的区别

    在AngularJS中显示模型中的数据有两种方式: 一种是使用花括号插值的方式: <p>{{text}}</p> 另一种是使用基于属性的指令,叫做ng-bind: <p ...

  5. angularjs 中的$digest和$apply区别

    $digest和$apply 在Angular中,有$apply和$digest两个函数,我们刚才是通过$digest来让这个数据应用到界面上.但这个时候,也可以不用$digest,而是使用$appl ...

  6. angularJS之ng-bind与ng-bind-template的区别

    ng-bind-template 指令用于告诉 AngularJS 将给定表达式的值替换 HTML 元素的内容. 当你想在 HTML 元素上绑定多个表达式时可以使用 ng-bind-template ...

  7. AngularJS表达式

    1. AngularJS使用表达式把数据绑定到HTML. 2. AngularJS表达式的特点: 表达式写在双大括号内:{{表达式}}. 表达式把数据绑定到HTML,这与ng-bind指令有异曲同工之 ...

  8. AngularJs项目实践总结

    今年3月接触AngularJs,并且在6月的项目中开始应用,从踩坑到填坑花了不少时间,根据项目中的实际应用情况总结了一些经验,如下: 一.UI控件选择 Angularjs是不缺控件的,Github里现 ...

  9. 02、AngularJs的数据绑定

    我们知道,AngularJs中的数据绑定是双向绑定的,View的改变,会改变Model,Model的改变也会改变View中的值,废话不多说,我们直接上代码. <!DOCTYPE html> ...

随机推荐

  1. linux Tar 命令参数详解

    tar命令 . 作用 tar命令是Unix/Linux系统中备份文件的可靠方法,几乎可以工作于任何环境中,它的使用权限是所有用户. . 格式 tar [主选项+辅选项] 文件或目录 eg: tar z ...

  2. 【转】C++可变参数列表处理宏va_list、va_start、va_end的使用

    VA_LIST是在C语言中解决变参问题的一组宏他有这么几个成员: 1)va_list型变量: #ifdef     _M_ALPHA typedef    struct{ char* a0; /*po ...

  3. 【Eclipse】Ubuntu 下菜单栏失效了,怎么办?(已解决)

    如果你的 Ubuntu 的版本是 13.10 , 且你又安装了 Eclipse , 你就会发现 Eclipse 的菜单不起作用了. 就是点击 File , Edit ... 这些菜单,不会显示子菜单了 ...

  4. Mavan学习之pom聚合

    所有用Maven管理的真实的项目都应该是分模块的,每个模块都对应着一个pom.xml.它们之间通过继承和聚合(也称作多模块,multi-module)相互关联.那么,为什么要这么做呢?我们明明在开发一 ...

  5. JVM学习--内存分配策略(持续更新)

    一.前言 最近学习<深入java虚拟机>,目前看到内存分配策略这块.本文将进行一些实践. 二.内存分配策略 1.大对象直接进入老年代 书中提到了: 下面进行测试,代码如下: public ...

  6. JVM学习--开启应用的gc日志功能

    一.开启方法 For Java 1.4, 5, 6, 7, 8 pass this JVM argument to your application: -XX:+PrintGCDetails -XX: ...

  7. linux系统下kvm虚拟机的安装

    一 KVM虚拟机简介 KVM是kernel-based Virtual Machine的简称,目前已成为学术界的主流VMM之一.KVM的虚拟化需要硬件支持(如Intel VT技术或者AMD V技术) ...

  8. 【CF687D】Dividing Kingdom II 线段树+并查集

    [CF687D]Dividing Kingdom II 题意:给你一张n个点m条边的无向图,边有边权$w_i$.有q个询问,每次给出l r,问你:如果只保留编号在[l,r]中的边,你需要将所有点分成两 ...

  9. python nose测试框架全面介绍八---接口测试中非法参数的断言

    在测接口时,会有这样的场景,输入非法的参数,校验返回的错误码及错误内容 通常做法为发请求,将错误的返回结果拿出,再进行对比匹配:但存在一个问题,需要再写错误返回分析函数,不能与之前正常发请求的函数共用 ...

  10. Unity3D如何有效地组织代码?(转)

    问题: Unity3D可以说是高度的Component-Based Architecture,同时它的库提供了大量的全局变量.如何来组织代码呢? 答: - Unity有一些自身的约定,譬如项目里的Ed ...