Note: this article was originally published on 06/07/2021.
I put these articles as pair here:
- Angular Versions --- this article
- Angular Version Change Frequency
I published an article, C# Versions. Actually, it summarizes the C# version info just for my own reference. However, that article is quite hot, with more than 3k readers within 20 days. So, I knew that article is helpful not just for myself, but for a lot of readers.
This article provides a history of each major release of Angular, and we give the major features for each version.
If you have already installed Angular on your local PC, you can check your Angular version from the command prompt,
ng version
Return will be,
Overview
Angular (commonly referred to as "Angular 2+" or "Angular v2 and above") is a TypeScript-based open-source web application framework led by the Angular Team at Google and by a community of individuals and corporations.
Angular combines declarative components, directives, templates, dependency injections, end-to-end tooling, and integrated best practices to solve development challenges.
Till now, Angular Team has released the following Angular versions (1~18 by 11/06/2024).
Angular JS 1.x
- AngularJS usually referred to as “Angular.js” or Angular 1.x.
- lt was initially released in Oct 2010 (7 years ago).
- Last major version release was : 1.7.x,
- Now in Long Term Support(LTS) mode. Official Site: https://angularjs.org/
- It is a JavaScript-based open-source front-end web application framework.
- It is a framework for client-side model–view–controller (MVC) and model–view–viewmodel (MVVM) architectures, along with components commonly used in rich Internet applications aiming to simplify both the development and the testing of applications.
Angular 2
- Angular 2 is released in September 2016.
- It is a complete rewrite from AngularJS, and written entirely in TypeScript.
- The major difference between Angular 1.x and Angular 2+ (see more here: Angular JS and Angular 2+),
- Angular 1.x was not built with mobile support in mind, where Angular 2 is mobile-oriented.
- Angular 1.x was written by JavaScript; Angular 2+ is written entirely in TypeScript.
Angular 3
No angular version 3, due to that version mismatch between @angular/core, @angular/compiler and @angular/router libraries.
In Angular 2, due to some active and huge developments on the router section, like route-preload, the @angular/router is already in a 3.X version:
- @angular/core v2.3.0
- @angular/compiler v2.3.0
- @angular/compiler-cli v2.3.0
- @angular/http v2.3.0
- @angular/router v3.3.0
This caused confusion. Releasing Angular as version 3, with its route on version 4 will have more confusion. Then the solution is to skip version 3.
Angular 4
- Angular 4 was released in March 2017.
- It is backward compatible with 2.x for most applications. There is no major change in Angular 4 from Angular 2.
- Angular 4 is not a complete rewrite of Angular 2, but emphasizing making angular apps faster, compact.
- Under the hood changes: New changes reduced the size of the generated code for components by around 60%.
- Faster Compilation
- Better Bug fixes Alert.
- Some Changes from Angular 2,
- Animations being pulled out of @angular/core
- Renderer 2 in place of Renderer from the same @angular/core.
- *ngIf/else .
- No need to write a pattern for email validation
Angular 5
Angular 5.0.0 was released in November 2017, with major features below,
- Build Optimizer: production builds created with the Angular CLI will now apply the build optimizer by default.
- Angular Universal State Transfer API and DOM Support.
- Compiler Improvements
- Internationalized Number, Date, and Currency Pipes
- HttpClient:
- @angular/http is deprecated in Angular 5. It is replaced with @angular/common/http library.
- HttpModule is not more use in Angular 5. It is replaced by HttpClientModule of @angular/common/http library in each of modules, inject the HttpClient service, and remove any map(res => res.json()) calls, which are no longer needed.
- Angular CLI v1.5 will generate v5 projects by default.
- Angular Forms adds
- updateOn
- Blur / Submit
- RxJS 5.5 support
- New Router Lifecycle Events:
- GuardsCheckStart,
- ChildActivationStart,
- ActivationStart,
- GuardsCheckEnd,
- ResolveStart,
- ResolveEnd,
- ActivationEnd,
- ChildActivationEnd
- New Router Lifecycle Events:
Angular 6
Angular 6.0.0 was released in May 2018, with major features:
- Two new angular CLI commands added :
- ng update
- 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
Ref: Angular 6, CLI 6 and Material 6 Features and angular 6 blog by Stephen fluin.
Angular 7
Angular 7.0.0 was released in Oct 2018 with major features;
- CLI Prompts - The CLI will now prompt users when running common commands like
- ng newng
- add @angular/material
- Bundle budgets in CLI.
- Angular Material & CDK
- Virtual Scrolling
- Drag and Drop
- Content Projection support in Angular Elements
- Dependency updates
- TypeScript 3.1
- RxJS 6.3
- Added support for Node 10
Ref: version 7 of Angular by Stephen fluin.
Angular 8
Angular 8 is released in May 2019, with major features:
- 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 we can customize angular CLI commands like,
- ng build
- ng test
- ng run
- Workspace APIs in the CLI
- Web Worker Support
- Angular CLI 8.3.0 has added a new UX for an initial app created using ng new.
- ng deploy: added in Angular CLI 8.3.0
Ref: version 8 of Angular by Stephen fluin.
Angular 9
Angular 9 is released in Feb 2020. Angular 9 came up with the 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 Internationalization
- New Options for providing property in @Injectable Decorator, In addition to the previous root and module options, you have two additional options.
- platform: Specifying provided: '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
Ref: Version 9 of Angular Now Available — Project Ivy has arrived! by Stephen fluin.
Angular 10
Angular 10 is released in Jun 2020. This is a smaller release comparison to other major releases because of just a four-month time from the previous major release v9.
- New Angular Material Component
- Date Range Picker: Check out this blog to see how to use angular material data range picker.
- Warnings about CommonJS imports: When you use a dependency that is packaged with CommonJS, it can result in larger slower applications. Starting with version 10, we now warn you when your build pulls in one of these bundles.
- Optional Stricter Settings
- TypeScript 3.9
- TSLib has been updated to v2.0
- TSLint has been updated to v6
- New Default Browser Configuration
Join the conversation! Your thoughts help the community grow.