Angular 应用主要由组件及其 HTML 模板组成。由于浏览器无法直接理解 Angular 所提供的组件和模板,因此 Angular 应用程序需要先进行编译才能在浏览器中运行。Angular 提供了

两种方式来编译angular应用程序:

  1. 即时编译 (JIT,Just in time),它会在运行期间在浏览器中编译你的应用。

  2. 预先编译(AOT,Ahead of time),它会在构建时编译你的应用。

注:当你运行 ng build(仅编译)或 ng serve(编译并启动本地服务器) 这两个 CLI 命令时 JIT 编译是默认选项;要进行 AOT 编译,只要让 ng build 或 ng serve 命令中包含 --aot 标志。

带有 --prod 标志的 ng build 命令 (ng build --prod) 会默认使用 AOT 编译。

一:AOT:在浏览器下载和运行代码之前的编译阶段,Angular 预先(AOT)编译器会先把你的 Angular HTML 和 TypeScript 代码转换成高效的 JavaScript 代码。好处如下:

  1. 渲染得更快:使用 AOT浏览器下载预编译版本的应用程序。 浏览器直接加载运行代码,所以它可以立即渲染该应用,而不用等应用完成首次编译;
  2. 需要的异步请求更少:编译器把外部 HTML 模板和 CSS 样式表内联到了该应用的 JavaScript 中。 消除了用来下载那些源文件的 Ajax 请求;
  3. 需要下载的 Angular 框架体积更小:如果应用已经编译过了,自然不需要再下载 Angular 编译器了。 该编译器差不多占了 Angular 自身体积的一半儿,所以,省略它可以显著减小应用的体积;
  4. 提早检测模板错误:AOT 编译器在构建过程中检测和报告模板绑定错误,避免用户遇到这些错误;
  5. 更安全:AOT 方式会在发给客户端之前就把 HTML 模板和组件编译成 JavaScript 文件。 不需要读取模板,也没有客户端组装 HTML 或执行 JavaScript 的危险操作,受到注入类攻击的机会也比较少。

Angular--AOT和JIT两种编译方式带来的改变的更多相关文章

  1. AOT和JIT以及混合编译的区别、优劣

    AOT,JIT是什么? JIT,即Just-in-time,动态(即时)编译,边运行边编译: AOT,Ahead Of Time,指运行前编译,是两种程序的编译方式 区别 这两种编译方式的主要区别在于 ...

  2. Java三种编译方式

    Java程序代码需要编译后才能在虚拟机中运行,编译涉及到非常多的知识层面:编译原理.语言规范.虚拟机规范.本地机器码优化等:了解编译过程有利于了解整个Java运行机制,不仅可以使得我们编写出更优秀的代 ...

  3. 两种include方式及filter中的dispatcher解析

    两种include方式 我自己写了一个original.jsp,另外有一个includedPage.jsp,我想在original.jsp中把includedPage.jsp引进来有两种方式: 1.& ...

  4. Java中String对象两种赋值方式的区别

    本文修改于:https://www.zhihu.com/question/29884421/answer/113785601 前言:在java中,String有两种赋值方式,第一种是通过“字面量”赋值 ...

  5. Nginx 的两种认证方式

    简介: 今天来研究一下 Nginx 的两种认证方式. 1.auth_basic 本机认证 2.ngx_http_auth_request_module 第三方认证 一.安装 Nginx shell & ...

  6. java的两种同步方式, Synchronized与ReentrantLock的区别

    java在编写多线程程序时,为了保证线程安全,需要对数据同步,经常用到两种同步方式就是Synchronized和重入锁ReentrantLock. 相似点: 这两种同步方式有很多相似之处,它们都是加锁 ...

  7. wdcp支持两种安装方式

    v3.2版本已发布,支持多PHP版本共存共用,支持SSL证书,更多可看论坛 v3版讨论区 更多安装说明请看 http://www.wdlinux.cn/bbs/thread-57643-1-1.htm ...

  8. WCF全双工通信实例分享(wsDualHttpBinding、netTcpBinding两种实现方式)

    最近在研究WCF通信,如果没有接触过的可以看我的前一篇文章:https://www.cnblogs.com/xiaomengshan/p/11159266.html 主要讲的最基础的basicHttp ...

  9. python常有模块:模块、引入语法、两种执行方式、模块搜索顺序

    今天主要讲了以下几点:一.模块三问.定义及分类二.import和from的语法三.文件的两种执行方式及搜索顺序四.内置函数 一.模块.import和from的语法 1.什么是模块   模块是一堆功能函 ...

随机推荐

  1. redis数据类型--zset

    数据结构: zset是有序的,不运行重复的,带有分值score的 数据结构对比: 操作命令: zadd myzset 10 java 20 python 20 ruby 40 mysql 50 php ...

  2. 小白探究UE4网络系列(一)、UE4网络基础类分析

    转载请标明出处:http://www.cnblogs.com/zblade/ 一.概要 捣鼓UE4也有两个多月了,从这儿开始,逐步探究UE4中经典的值复制,RPC两种同步方式.想要弄到其复制和调用的原 ...

  3. mac office软件的安装与破解

    1.mac  office 软件的安装及破解  http://10176523.cn/archives/29/ 下载后安装  切记不要登录 然后用这个文件 破解

  4. git配置文件—— .gitattributes

    目录 .gitattributes 文档 1. gitattributes文件以行为单位设置一个路径下所有文件的属性,格式如下: 2. 在gitattributes文件的一行中,一个属性(以text属 ...

  5. HTML5基础 实例

    <!DOCTYPE html><html> <head> <title>李清照简介</title> </head> <bo ...

  6. BZOJ 3065 带插入区间K小值(sag套线段树)

    3065: 带插入区间K小值 Time Limit: 60 Sec  Memory Limit: 512 MBSubmit: 4696  Solved: 1527[Submit][Status][Di ...

  7. WOE(证据权重)为何这样计算?

    更多大数据分析.建模等内容请关注公众号<bigdatamodeling> 先简单回顾一下WOE的含义.假设x是类别变量或分箱处理过的连续变量,含R个类别或分段,取值为{C1, ..., C ...

  8. 关于OV7670摄像头的分辨率设置

    关于OV7670摄像头的分辨率设置最近一直在纠结如何把OV7670输出的图片分辨率缩小,以减少数据量来适应数据的传输,在网上看了好多也没有关于寄存器的具体设置,最终又读了几遍数据手册,加上网友们写的帖 ...

  9. jquery (对内容,元素,属性,class的操作)

    对内容的操作: 捕获:获得内容 text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML 标记)val() - 设置或返回表单字段的值. 设置:设置内容 ...

  10. 一线大厂面试官最喜欢问的15道Java多线程面试题

    前言 在任何Java面试当中多线程和并发方面的问题都是必不可少的一部分.如果你想获得更多职位,那么你应该准备很多关于多线程的问题. 他们会问面试者很多令人混淆的Java线程问题.面试官只是想确信面试者 ...