111. What is Angular Ivy?
Angular Ivy is a new rendering engine for Angular. You can choose to opt in a preview version of Ivy from Angular version 8.
1. You can enable ivy in a new project by using the --enable-ivy flag with the ng new command
```bash
ng new ivy-demo-app --enable-ivy
```
2. You can add it to an existing project by adding `enableIvy` option in the `angularCompilerOptions` in your project's `tsconfig.app.json`.
```javascript
{
"compilerOptions": { ... },
"angularCompilerOptions": {
"enableIvy": true
}
}
```
112. What are the features included in ivy preview?
You can expect below features with Ivy preview,
1. Generated code that is easier to read and debug at runtime
2. Faster re-build time
3. Improved payload size
4. Improved template type checking
113. Can I use AOT compilation with Ivy?
Yes, it is a recommended configuration. Also, AOT compilation with Ivy is faster. So you need set the default build options(with in angular.json) for your project to always use AOT compilation.
```javascript
{
"projects": {
"my-project": {
"architect": {
"build": {
"options": {
...
"aot": true,
}
}
}
}
}
}
```
114. What is Angular Language Service?
The Angular Language Service is a way to get completions, errors, hints, and navigation inside your Angular templates whether they are external in an HTML file or embedded in annotations/decorators in a string. It has the ability to autodetect that you are opening an Angular file, reads your `tsconfig.json` file, finds all the templates you have in your application, and then provides all the language services.
115. How do you install angular language service in the project?
You can install Angular Language Service in your project with the following npm command
```javascript
npm install --save-dev @angular/language-service
```
After that add the following to the "compilerOptions" section of your project's tsconfig.json
```javascript
"plugins": [
{"name": "@angular/language-service"}
]
```
**Note:** The completion and diagnostic services works for .ts files only. You need to use custom plugins for supporting HTML files.
116. Is there any editor support for Angular Language Service?
Yes, Angular Language Service is currently available for Visual Studio Code and WebStorm IDEs. You need to install angular language service using an extension and devDependency respectively. In sublime editor, you need to install typescript which has has a language service plugin model.
117. Explain the features provided by Angular Language Service?
Basically there are 3 main features provided by Angular Language Service,
1. **Autocompletion:** Autocompletion can speed up your development time by providing you with contextual possibilities and hints as you type with in an interpolation and elements.
2. **Error checking:** It can also warn you of mistakes in your code.
3. **Navigation:** Navigation allows you to hover a component, directive, module and then click and press F12 to go directly to its definition.
118. How do you add web workers in your application?
You can add web worker anywhere in your application. For example, If the file that contains your expensive computation is `src/app/app.component.ts`, you can add a Web Worker using `ng generate web-worker app` command which will create `src/app/app.worker.ts` web worker file. This command will perform below actions,
1. Configure your project to use Web Workers
2. Adds app.worker.ts to receive messages
```javascript
addEventListener('message', ({ data }) => {
const response = `worker response to ${data}`;
postMessage(response);
});
```
3. The component `app.component.ts` file updated with web worker file
```javascript
if (typeof Worker !== 'undefined') {
// Create a new
const worker = new Worker('./app.worker', { type: 'module' });
worker.onmessage = ({ data }) => {
console.log('page got message: $\{data\}');
};
worker.postMessage('hello');
} else {
// Web Workers are not supported in this environment.
}
```
**Note:** You may need to refactor your initial scaffolding web worker code for sending messages to and from.
119. What are the limitations with web workers?
You need to remember two important things when using Web Workers in Angular projects,
1. Some environments or platforms(like @angular/platform-server) used in Server-side Rendering, don't support Web Workers. In this case you need to provide a fallback mechanism to perform the computations to work in this environments.
2. Running Angular in web worker using `@angular/platform-webworker` is not yet supported in Angular CLI.
120. What is Angular CLI Builder?
In Angular8, the CLI Builder API is stable and available to developers who want to customize the `Angular CLI` by adding or modifying commands. For example, you could supply a builder to perform an entirely new task, or to change which third-party tool is used by an existing command.
Comments
Post a Comment
please do not enter any spam link in the comment box