1. Angular 6 new features

1.1. 主要的新特性

按照官方的说法,Angular 6 体积将会更小、更加易于使用,同时运行速度也更快。当然,最重要的是,官方承诺平滑升级,没有破坏性变更。

主要新特性包括:

  • Angular elements
  • CDK
  • Ivy renderer
  • Bazel & Closure compiler
  • ng update & ng add
  • RXJS 6, Webpack 4, TypeScript 2.7 support

1.2. Angular elements

Angular Elements 可以用来把组件打包成 Web Component,甚至可以用在非 Angular 项目里面。

1.3. CDK

利用@angular/cdk,你可以基于 @angular/material 来构建自己的 UI 组件库。同时删除了对@angular/flex-layout 的依赖,因为 CDK 将会支持响应式设计。

1.4. Ivy renderer

默认不会启用 Ivy 渲染引擎,如果你想用,需要手动修改编译参数。启用 Ivy 渲染引擎会带来很多好处:渲染速度更快、打包的体积更小,同时更加灵活。

(注:实际上这已经是第二次换渲染引擎了,第一次换到 Render2,这次换成了 Ivy,希望 Ivy 能带来让人眼前一亮的效果。)

1.5. Bazel and Closure compiler

“作为一款高质量的工具, ABC (Angular + Bazel + Closure) 工程里面倾注了我们大量的努力,你可以利用它来构建高质量的 Angular 应用。 ”

Bazel 是 Google 内部一直使用的强大构建工具,根据 Brad Green 在上次演讲(www.ngfans.net/topic/105/p… )中提到的内容,Angular 项目组采用 Bazel 的原因是,为了让构建工具保持统一,同时也让外部公司能享受到 Google 内部构建工具带来的好处。

对于 Angular 来说,最看中的是 Bazel 的增量编译特性和编译速度,按照官方的说法,Bazel 的目标是:重新编译项目到浏览器能运行,只要 2 秒的时间。

Closure 也是 Google 内部一直使用的一款工具,它可以对 JS 代码进行压缩和优化,生成的包体积更小(比如典型的死码消除特性)、对 JS 引擎更加友好。

1.6. ng update & ng add

从 Angular CLI 1.7 开始你可以运行:

ng update

这样就可以自动更新 package.json 里面定义的依赖包,RxJS 和 TypeScript 版本也会自动更新。

另一个命令是:

ng add

这个命令用来帮助开发者给自己的应用增加新特性。例如,你可以把一款普通应用变成 Progressive Web Apps (PWA) ,你还可以一开始就指定应用的类型,而不是创建空白的项目。

1.7. RXJS 6, Webpack 4 & TypeScript 2.7 support

升级到 RXJS 6 可以缩小打包的体积。

Angular 目前使用的 webpack 版本是 3.x,很快 webpack 4.x 就要来了,Angular CLI 已经做好了升级的准备。同样,升级到 webpack 新版本之后,可以利用 scope hosting 特性让编译之后的体积变得更小。

最后一点就是,Angular 6 将会升级 TypeScript 到 2.7 。

1.8. Reference

Copyright © Guanghui Wang all right reserved,powered by GitbookFile Modified: 2019-08-25 13:56:34

results matching ""

    No results matching ""