Google News
logo
Angular Interview Questions
Class decorators appear just before class definition, whereas class field decorators appear just before a field in the class definition. Examples of class decorators are @Component, @NgModule etc… Examples of a class field decorator are @Input, @Output etc…
The double curly braces represent interpolation. It is a special syntax. Angular converts it into property binding. You can think of it as an alternate for property binding. The name of the component is written inside the inner curly braces. During execution, the name is replaced by the actual string value of the property. For example,
 
<h2> {{apptitle}} <img src="{{imgname}}" style="height:30px"> </h2> 
 
Angular will evaluate and replace apptitle and imgname with their actual values.
This is a representation for ngModel used for two-way data binding. It is written as [(ngModel)] = “propertyvalue”.
The root module that you bootstrap to launch the application is called as a bootstrapping module. Every Angular application has a bootstrapping module. It is also called as the AppModule. The bootstrapping module is mentioned in the AppModule class.
 
@NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, FormsModule, HttpClientModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
With JIT, the compilation happens during run-time in the browser. It is the default way used by Angular. The commands used for JIT compilation are –
ng build ng serve 
 
In AOT compilation, the compiler compiles the code during the build itself. The CLI command for aot compilation is -
ng build --aot ng server –aot
 
AOT is more suitable for the production environment whereas JIT is much suited for local development.
The components, framework and CLI used by Angular applications are packaged as npm packages. Npm packages can be downloaded using the npm CLI client.
Angular JavaScript framework launched for the first time in 2009, the latest version of AngularJS is Angular 9 and it is launched on February 6th, 2020. Angular is one of the best and most popular frameworks and widely used for developing front-end desktop web applications or single-page applications by Angular JS Development Company.
 
Furthermore, Angular is the first choice for the front-end development for developers across the world. The new version of Angular is released every six months. In this blog, we shall overview the new features of version 9.

Angular 9 : Features
* Default Ivy Compiler
* Smaller Bundle Size
* Better Debugging
* Faster Compilation
* Ahead-of-time (AOT)
* Angular 9 requires Typescript 3.7


Angular 9’s compiling and rendering engine is known as Ivy. The older versions of Angular made use of View Engine. The bundle size produced by the View Engine is very large but with Ivy, this bundle has considerably reduced thereby helping Angular overcome its bundle issues.
 
For example, the simplest Hello World program was about 36Kb which is quite a large bundle size for a simple Hello World program. So, the Angular team decided that they will keep a threshold value of 10Kb. This was called the cake threshold because the head of that team decided to give the team all the cake in case they reduce the bundle size to below 10Kb.

The team was successful in reducing the bundle size incredibly to just 7.3Kb with the minified Ivy version and something even better i.e 2.7Kb with the Ivy Compressed version. This was indeed a great achievement and they did deserve all the cake!
 
Benefits of Using Ivy :
* Smaller bundle size
* Very helpful when it comes to debugging
* Brings faster compilation
To understand how Ivy reduces the bundle size, you will first need to understand how the View Engine works. When you compile any of your components using the View Engine, say for instance example.component, you basically get two JavaScript files. They are the example.component.js file which consists of the compiled TypeScript code and example.component.ngfactory.js file which is a static representation of the template code. So here, there will be a mapping of these two files which consumes a much longer build time.
 
So, the Angular team decided that the second file, i.e the .ngfactory.js file, can be removed by just adding the template code within the JavaScript code itself. The Ivy makes use of function calls rather than iterating over each element as in the View Engine.
First, update to the latest version of 8
ng update @angular/cli@8 @angular/core@8
Then, update to 9
ng update @angular/cli @angular/core
The main goal of Angular 9 is to make it available for all applications. The main benefits of Ivy is to reduce the size of applications for better user experience.