Difference between Angular versions

Difference between angular versions till 11th Dec 2021.
Until now Angular Version 13 released.

Angular Js

1. It is referred as Angular 1 version.
2. It aim's to simplify the development and testing of application by providing MVC(Model-View-Controller) and MVVM(Model-View-View-Model) architectures.
3. It's written in Javascript

Angular 2

1. Angular 2 totally rewritten and used typescript.
2. It's supported in mobile.
3. You can write in ES6, JS or in Dart.

Angular 3

This version is skipped due to mismatch of @angular/core, @angular/compiler and @angular/router libraries.

@angular/router was already version 3.x with huge development. So to avoid the confusion they skipped this version.

Angular 4

1. Reduced the size up to 60%
2. Faster compilation
3. Better bug fix alerts.
4. Supported typescript 2.1 and more. (Earlier it was supporting typescript 1.8)
5. No need to write a pattern for email validation.
6. *ngIf/else Now you can use else as well .
7. Renderer 2 in place.
8. Animations being pulled out of @angular/core so as to remove the extra code being imported into our production bundle. Though you can easily add animation by importing {BrowserAnimationsModule} from @angular/platform-browser/animations into NgModule.

Angular 5

1. Compiler Improvements
2. RxJS 5.5 support (Added new router life cycle events)
3. Angular Forms adds updateOn Blur / Submit
4. Angular Universal State Transfer API and DOM Support.
5. By default enabled Build Optimiser.
6. Internationalised Number, Date, and Currency Pipes
7. @angular/http replaced with @angular/common/http library.
8. HttpModule is replaced by HttpClientModule of @angular/common/http inject the HttpClient service, and remove any map(res => res.json()) calls, which are no longer needed.

Angular 6

1. Its released with Angular CLI 6.X and Angular material 6.X
2. Add ng update and ng add
3. Angular Elements
4. Component Dev Kit (CDK)
5. Angular Material Starter Components
6. CLI Workspaces
7. Schematics
8. Library Support
9. Tree Shakable Providers
10. Animations Performance Improvements
11. RxJS v6

Angular 7

1. Its released with Angular CLI 7.X and Angular Material 7.X
2. Performance improvements
3. Virtual scrolling
4. Drag and drops
5. Content projection support in angular element
6. Dependency updates : TypeScript 3.1 RxJS 6.3 Added support for Node 10
7. Bundle budgets in CLI.
8. **CLI Prompts: **The CLI will now prompt users when running common commands like ng new or ng add @angular/material to help you discover built-in features like routing or SCSS support. CLI Prompts are also added in Schematics.

Angular 8

1. Its released with Angular CLI 8.X and Angular material 8.X
2. Differential Loading by Default: It is a process by which the browser chooses between modern or legacy JavaScript based on its own capabilities.
3. Dynamic Imports for Route Configurations.
4. Builder APIs in CLI: It is an exciting feature, using this we can customize angular CLI commands like ng build, ng test,and ng run.
5. Workspace APIs in the CLI
6. Web Worker Support
7. Angular CLI 8.3.0 has added new UX for an initial app created using ng new.
8. ng deploy is added in Angular CLI 8.3.0

Angular 9

1. It came up with most awaited IVY Compiler.
2. Ivy Compiler: From version 9 all applications are moved to Ivy compiler and runtime by default. (In angular 8 it was in opt-in mode).

It provides the following advantages

• Smaller Bundle Size
• Faster Testing
• Better Debugging
• Improved CSS class and style binding
• Improved Type Checking
• Improved build errors
• Improved build times, enabling AOT on by default
• Improved Internationalisation

1. New Options for providedIn property in @Injectable Decorator, In addition to the previous root and module options, you have two additional options.
   platform : Specifying providedIn: 'platform' makes the service available in a special singleton platform injector that is shared by all applications on the page.
   any : Provides a unique instance in every module (including lazy modules) that injects the token.
   Component harnesses

2. Angular Material New Component
   Youtube player Component
   Google Maps Component

3. TypeScript 3.7 Support

Angular 10

1. Its synchronised with major release Angular CLI and Angular Material 10.
2. Date range picker added
3. Warnings about CommonJS imports:
4. Optional Stricter Settings
5. TypeScript 3.9
6. TSLib has been updated to v2.0
7. TSLint has been updated to v6
8. New Default Browser Configuration

Angular 11

1. Popular bug fixes
2. Automatic font inlining: During compile time Angular CLI will download and inline fonts that are being used and linked in the application. Which will make the application more faster.
3. Improved build and serve Reporting & Logging
4. Updated language service preview based on Ivy
5. Updated Hot Module Replacement(HMR) Support: Angular CLI has now added to support of serving application with HMR. Use ng serve --hmr
6. Faster Builds
7. Experimental webpack 5 support
8. TSLint and Codelyzer are deprecated
9. Removed Support of IE9/IE10 and IE Mobile.

Angular 12

1. Added Tailwind CSS support.
2. Passing context to HTTP Interceptors : No more dirty hacks for passing metadata to HTTP interceptors.
3. Now Supports inline Sass in styles property of @Component decorator
4. Added support of Tailwind CSS: Now you just need to install tailswindcss package and add tailwind.config.js to use tailwind CSS
5. Nullish Coalescing: power of nullish coalescing is now also available on Angular templates in v12!
6. Strict mode is enabled by default
7. The Ivy-based Language Service is moving from opt-in to on by default.
8. The Ivy-based Language Service is moving from opt-in to on by default.
9. Deprecated support for IE 11.

Angular 13

1. Creating dynamic components is easy now : The new API removes the need for ComponentFactoryResolver being injected into the constructor. Ivy creates the opportunity to instantiate the component with ViewContainerRef.createComponent without creating an associated factory.
2. IE 11 support is removed
3. Angular now supports the use of persistent build cache by default for new v13 projects, which results in 68% improvement in build speed.
4. RxJS 7.4 is now the default for the new apps.
5. Supports TypeScript 4.4
6. Accessibility improvements for angular material components
7. Dynamically enable/disable validators
8. Restore history after canceled navigation