Angular--AOT和JIT两种编译方式带来的改变
Angular 应用主要由组件及其 HTML 模板组成。由于浏览器无法直接理解 Angular 所提供的组件和模板,因此 Angular 应用程序需要先进行编译才能在浏览器中运行。Angular 提供了
两种方式来编译angular应用程序:
即时编译 (JIT,Just in time),它会在运行期间在浏览器中编译你的应用。
预先编译(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 代码。好处如下:
- 渲染得更快:使用 AOT浏览器下载预编译版本的应用程序。 浏览器直接加载运行代码,所以它可以立即渲染该应用,而不用等应用完成首次编译;
- 需要的异步请求更少:编译器把外部 HTML 模板和 CSS 样式表内联到了该应用的 JavaScript 中。 消除了用来下载那些源文件的 Ajax 请求;
- 需要下载的 Angular 框架体积更小:如果应用已经编译过了,自然不需要再下载 Angular 编译器了。 该编译器差不多占了 Angular 自身体积的一半儿,所以,省略它可以显著减小应用的体积;
- 提早检测模板错误:AOT 编译器在构建过程中检测和报告模板绑定错误,避免用户遇到这些错误;
- 更安全:AOT 方式会在发给客户端之前就把 HTML 模板和组件编译成 JavaScript 文件。 不需要读取模板,也没有客户端组装 HTML 或执行 JavaScript 的危险操作,受到注入类攻击的机会也比较少。
Angular--AOT和JIT两种编译方式带来的改变的更多相关文章
- AOT和JIT以及混合编译的区别、优劣
AOT,JIT是什么? JIT,即Just-in-time,动态(即时)编译,边运行边编译: AOT,Ahead Of Time,指运行前编译,是两种程序的编译方式 区别 这两种编译方式的主要区别在于 ...
- Java三种编译方式
Java程序代码需要编译后才能在虚拟机中运行,编译涉及到非常多的知识层面:编译原理.语言规范.虚拟机规范.本地机器码优化等:了解编译过程有利于了解整个Java运行机制,不仅可以使得我们编写出更优秀的代 ...
- 两种include方式及filter中的dispatcher解析
两种include方式 我自己写了一个original.jsp,另外有一个includedPage.jsp,我想在original.jsp中把includedPage.jsp引进来有两种方式: 1.& ...
- Java中String对象两种赋值方式的区别
本文修改于:https://www.zhihu.com/question/29884421/answer/113785601 前言:在java中,String有两种赋值方式,第一种是通过“字面量”赋值 ...
- Nginx 的两种认证方式
简介: 今天来研究一下 Nginx 的两种认证方式. 1.auth_basic 本机认证 2.ngx_http_auth_request_module 第三方认证 一.安装 Nginx shell & ...
- java的两种同步方式, Synchronized与ReentrantLock的区别
java在编写多线程程序时,为了保证线程安全,需要对数据同步,经常用到两种同步方式就是Synchronized和重入锁ReentrantLock. 相似点: 这两种同步方式有很多相似之处,它们都是加锁 ...
- wdcp支持两种安装方式
v3.2版本已发布,支持多PHP版本共存共用,支持SSL证书,更多可看论坛 v3版讨论区 更多安装说明请看 http://www.wdlinux.cn/bbs/thread-57643-1-1.htm ...
- WCF全双工通信实例分享(wsDualHttpBinding、netTcpBinding两种实现方式)
最近在研究WCF通信,如果没有接触过的可以看我的前一篇文章:https://www.cnblogs.com/xiaomengshan/p/11159266.html 主要讲的最基础的basicHttp ...
- python常有模块:模块、引入语法、两种执行方式、模块搜索顺序
今天主要讲了以下几点:一.模块三问.定义及分类二.import和from的语法三.文件的两种执行方式及搜索顺序四.内置函数 一.模块.import和from的语法 1.什么是模块 模块是一堆功能函 ...
随机推荐
- 一条数据的HBase之旅,简明HBase入门教程2:数据模型
[摘要] 上一篇文章讲了HBase项目与应用概况信息,这篇文章讲述HBase的数据模型以及一些基础概念,数据模型可以说决定了HBase适合于什么应用场景. 华为云上的NoSQL数据库服务CloudTa ...
- Eclipse for Tricore 的安装方法
1.安装JDK32位版 2.安装Eclipse for Tricore 32位版(应该也只有32位的) 3.OK(如果打开Tricore提示找不到JDK的话,在网上搜索如何配置JDK,修改环境变量) ...
- AUTH_USER_MODEL 添加报错(粗心)
HINT: Add or change a related_name argument to the definition for 'UserProfile.user_permissions' or ...
- IPV6-ONLY
1.ipv4地址已经耗尽,未来可能只支持ipv6-only. 2.在一个纯IPV6环境下,路由器会自动将IPV4地址转成IPv6地址. 苹果这样要求,对于大多数开发者而言,并不困难.目前大多数应用无需 ...
- [TimLinux] Python C3 MRO
MRO:Method Resolution Order,即方法解析顺序,是python中用于处理二义性问题的算法 采用过的算法: 1. DFS(深度优先算法) 2. BFS(广度优先算法) 3. C3 ...
- HDU 1808 Halloween treats
Every year there is the same problem at Halloween: Each neighbour is only willing to give a certain ...
- 修改IE默认页的指向
方法一: 1.打开IE浏览器 → 单击 工具 → Internet选项 2.填上你要设置的主页网址 3.重启IE浏览器,成功设置主页 方法二: 1.按住键盘"win+r" → 输入 ...
- vue中通过.sync修饰符实现子组件修改父组件数据
vue父子通讯是单向数据流,也就是子组件不能修改父组件的值,但是在一些情况下是需要这样做的. 先看官方文档: 接下来举例实现 1.实现一个双向数据绑定,子组件改变的时候,父组件也在改变 父组件 < ...
- eclipse新建maven项目报错Could not resolve arachetype org.apache.maven.archetypes:mmaven-archetype-quickstart:1.1 from any of the configured repositories
使用eclipse新建maven项目,按下图所示选择后,报错 报错截图 报错详细信息 Could not resolve archetype org.apache.maven.archetypes:m ...
- 权值初始化 - Xavier和MSRA方法
设计好神经网络结构以及loss function 后,训练神经网络的步骤如下: 初始化权值参数 选择一个合适的梯度下降算法(例如:Adam,RMSprop等) 重复下面的迭代过程: 输入的正向传播 计 ...