Angular Versions

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 JS to Angular 8, Angular Version History, Angular Version List, All Angular Versions

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

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

Ref: Version 10 of Angular Now Available by Stephen fluin.

Angular 11[ref]

Angular 11 is released in November 2020. With the new features and fixes:

Automatic Inlining of Fonts
Component Test Harnesses
Improved Reporting and Logging
Updated Language Service Preview
Updated Hot Module Replacement (HMR) Support
Faster Builds
Experimental webpack 5 Support
Linting
Housekeeping
Roadmap

Angular 12[ref]

Angular 12 is the latest major version released in May 2021. With the new features and fixes:

Moving Closer to Ivy Everywhere. The key moment in the next evolution of Angular has finally arrived.
- Now that View Engine is deprecated, it will be removed in a future major release.
- Current libraries using View Engine will still work with Ivy apps (no work is required by developers), but library authors should start planning to transition to Ivy.
Transitioning from Legacy i18n Message IDs
The Future of Protractor
Nullish Coalescing

The nullish coalescing operator (??) has been helping developers write cleaner code in TypeScript classes for a while now. We’re thrilled to announce that you can bring the power of nullish coalescing to Angular templates in v12!

Now, in templates, developers can use the new syntax to simplify complex conditionals. For example,
{{age !== null && age !== #ff0000 ? age : calculateAge() }}
Becomes
{{ age ?? calculateAge() }}
Give this a try today and let us know what you think!

Learning Angular

We’re always working to improve the Angular learning experience for developers. As part of this effort, we have made some meaningful changes to our documentation. We wrote a content projection guide, with more new content in the works.

Stylish Improvements
More Great Features
- Running ng build now defaults to production which saves teams some extra steps and helps to prevent accidental development builds in production!
- Strict mode is enabled by default in the CLI. Strict mode helps catch errors earlier in the development cycle. Learn more about the strict mode in the documentation and find the original announcement on our blog.
- The Ivy-based Language Service is moving from opt-in to on by default. The Language Service helps to boost your productivity when building apps by providing great features such as code completion, errors, hints, and navigation inside Angular templates. Check
  out this video, tour to learn more.
- In the v11 update, we added experimental support for Webpack 5. Today, we’re happy to announce that we’re releasing a production-ready version of Webpack 5 support in Angular.
- We’re also updating the supported TypeScript version to 4.2 — check out this post for more details on what is included.
Deprecating support for IE11

Note: update below on 04/25/2023.

Angular 13[ref]

Angular 13 is released in November 2021. With the new features and fixes:

Support for TypeScript 4.4
Enhancements to Angular Tests
100% Ivy and No More Support for View Engine
Ergonomic APIs
- Angular v13 has reduced the load time using ergonomic code-splitting APIs and granular code disruption at a component level. The new release of ESBuild has also brought an enhancement of performance.
Angular CLI Enhancements
Changes to the Angular Package Format(APF)
Changes in Framework and Dependency Updates
Component API Updates
No Longer Support for Internet Explorer 11
Accessibility Update in Angular Material

Angular 14[ref]

Angular 14 is released in June 2022. With the new features and fixes:

Stand-alone Components
Strictly Typed Forms
Angular CLI Auto-Completion
Improved Template Diagnostics
Streamlined Page Title Accessibility
Latest Primitives in the Angular CDK
Angular DevTools is Now Present Online
Optional Injectors
Built-in Enhancements
Extended Developer Diagnostics:

Angular 15[ref]

Angular 15 is released in November 2022. With the new features and fixes:

Standalone Stable APIs
Directive Composition API
Improve Stack Traces for Debugging
Http with provideHttpClient
Stable Image Directives
Dependency Injection
Functional Route Guards
Automatic Imports in Language Service
Angular CLI improvements
CDK Based Listbox

Angular 16 [ref]

Angular 16 is released in May 2023. With the new features and fixes:

Angular Signals
Server-Side Rendering
Experimental Jest Support
esbuild-Based Build System
Required Inputs
Router Inputs
Standalone Project Support

Other Features

Angular 16 comes with many other changes that improve the developer experience:

Auto-importing of components and pipes through the language service.
Support for TypeScript 5.0, ECMAScript decorators, service workers, and SCP through the CLI.
CSP support for online styles.
Self-closing tags.
Cease of support for ngcc and TypeScript 4.8.

Angular 17 [ref]

Angular 17 is released in November 2023. With the new features and fixes:

Typescript 5.2
New Declarative Control Flow
Deferrable Loading
Support for View Transition API
Improved Server-Side Rendering
Router Refactoring
Upgrade to Node js 18.13.0

Angular 18 [ref]

Angular 18 is released in May 2024. With the new features and fixes:

New zoneless change detection with signals.
Routes redirect as a function.
New Signal APIs in developer preview.
Material 3, signals, deferable views, and built-in control flow from version 17 are now stable in version 18.
Application robust hosting with Firebase.
Fallback content for ng-content.
Form’s new control state change events.
SSR improvements and event replay.
Typescript 5.4 features.

Summary

As you have seen above Angular is constantly growing with better features and faster performance. In upcoming versions, more exciting features are coming like Ivy renderer, and Bazel which are currently in opt-in previews

For the detailed angular versions updates and changes refer to the angular changelog.

References: