Difference between Angular versions

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

Angular Js

It is referred as Angular 1 version.

It aim's to simplify the development and testing of application by providing MVC(Model-View-Controller) and MVVM(Model-View-View-Model) architectures.

It's written in Javascript

Angular 2

Angular 2 totally rewritten and used typescript.

It's supported in mobile.

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

Reduced the size up to 60%

Faster compilation

Better bug fix alerts.

Supported typescript 2.1 and more. (Earlier it was supporting typescript 1.8)

No need to write a pattern for email validation.

*ngIf/else Now you can use else as well .

Renderer 2 in place.

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

Compiler Improvements

RxJS 5.5 support (Added new router life cycle events)

Angular Forms adds updateOn Blur / Submit

Angular Universal State Transfer API and DOM Support.

By default enabled Build Optimiser.

Internationalised Number, Date, and Currency Pipes

@angular/http replaced with @angular/common/http library.

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

Its released with Angular CLI 6.X and Angular material 6.X

Add ng update and ng add

Angular Elements

Component Dev Kit (CDK)

Angular Material Starter Components

CLI Workspaces

Schematics

Library Support

Tree Shakable Providers

Animations Performance Improvements

RxJS v6

Angular 7

Its released with Angular CLI 7.X and Angular Material 7.X

Performance improvements

Virtual scrolling

Drag and drops

Content projection support in angular element

Dependency updates : TypeScript 3.1 RxJS 6.3 Added support for Node 10

Bundle budgets in CLI.

**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

Its released with Angular CLI 8.X and Angular material 8.X

Differential Loading by Default: It is a process by which the browser chooses between modern or legacy JavaScript based on its own capabilities.

Dynamic Imports for Route Configurations.

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.

Workspace APIs in the CLI

Web Worker Support

Angular CLI 8.3.0 has added new UX for an initial app created using ng new.

ng deploy is added in Angular CLI 8.3.0

Angular 9

It came up with most awaited IVY Compiler.

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

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

Angular Material New Component
Youtube player Component
Google Maps Component

TypeScript 3.7 Support

Angular 10

Its synchronised with major release Angular CLI and Angular Material 10.

Date range picker added

Warnings about CommonJS imports:

Optional Stricter Settings

TypeScript 3.9

TSLib has been updated to v2.0

TSLint has been updated to v6

New Default Browser Configuration

Angular 11

Popular bug fixes

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.

Improved build and serve Reporting & Logging

Updated language service preview based on Ivy

Updated Hot Module Replacement(HMR) Support: Angular CLI has now added to support of serving application with HMR. Use ng serve --hmr

Faster Builds

Experimental webpack 5 support

TSLint and Codelyzer are deprecated

Removed Support of IE9/IE10 and IE Mobile.

Angular 12

Added Tailwind CSS support.

Passing context to HTTP Interceptors : No more dirty hacks for passing metadata to HTTP interceptors.

Now Supports inline Sass in styles property of @Component decorator

Added support of Tailwind CSS: Now you just need to install tailswindcss package and add tailwind.config.js to use tailwind CSS

Nullish Coalescing: power of nullish coalescing is now also available on Angular templates in v12!

Strict mode is enabled by default

The Ivy-based Language Service is moving from opt-in to on by default.

Deprecated support for IE 11.

Angular 13

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.

IE 11 support is removed

Angular now supports the use of persistent build cache by default for new v13 projects, which results in 68% improvement in build speed.

RxJS 7.4 is now the default for the new apps.

Supports TypeScript 4.4

Accessibility improvements for angular material components

Dynamically enable/disable validators

Restore history after canceled navigation