Back to: Angular Tutorials For Beginners and Professionals
Angular Versions and Versioning in Detail
In this article, I am going to discuss Angular Versions and Versioning in detail. Please read our previous article where we gave a brief introduction to the angular framework. At the end of this article, you will understand the different angular versions and in each version what are the new features introduced as well as what improves. Till now Google has released 7 versions of angular, they are as follows:
- Angular JS: 2010
- Angular 2: 2016
- Angular 4: 2017
- Angular 5: November 2017
- Angular 6: March 2018
- Angular 7: October 2018
- Angular 8: May 2019
- Angular 9: Feb 2020
Angular JS 1.x:
- It is based on the model–view–controller (MVC) and model–view–View-Model (MVVM) architecture.
- The current stable version is 1.6.10.
- It extends the HTML supports by adding tags, attributes, and expressions.
- It provides event handling in a simpler manner as well as provides a built-in template and routing.
- Some of the important features are Form Validation, Dependency Injection, Animations, etc
The Angular 2 Framework is completely re-write from its original Angular 1 or Angular JS and this is completely re-write from the scratch using the Typescript language. It was released in September 2016 by Google. Some of the features of Angular 2 are as follow:
- By default Angular 2 applications are mobile-friendly.
- It supports many languages such as ES5, ES6, Typescript or Dar to write Angular 2 code.
- It is based on Component-based architecture.
Why not Angular 3?
The Angular 2 Framework is a single repository. That means each package is downloadable with the @angular/package-name convention. For example @angular/core, @angular/compiler, @angular/HTTP, @angular/router, etc. as shown in the below image.
The Angular Development Team skipped Version 3 and the reason behind this is a version mismatch. As you can see in the above image, all the package names were assigned with version 2, but the router package by mistake was given version 3. Therefore, the Angular Development team skipped this version and directly jumped to version 4 to maintain compatibility with Angular Router’s version.
The Angular 4 was released in March 2017 and it is not completely re-write from Angular 2. In Angular 4 there are few minor changes and some new features are added.
For most of the applications, this release is backward compatible with 2.x.x. Angular 2 and was released in March 2017 and there is no major change in Angular 4 from Angular 2. Angular 4 is not the complete rewritten form of Angular 2. In this release, the angular team has laid the emphasis on making the app faster. Some of the features of Angular 4 are as follows:
- By the new changes, it reduces the size of the generated code up to 60%.
- The animation moved to a separate package called @angular/animations.
- It provides faster compilation.
- It supports for email validator i.e. with Angular 4, we don’t require writing a pattern to validate email.
- Provides better support bug fixes alert.
- It supports if-else statements.
The Angular 5 was released in November 2017 and this version doesn’t bring any significant change from Angular 4. In this version, lots of new features, as well as many new improvements, are done. Some of the features of Angular 5 are as follows:
- The HTTPClient API was introduced by Angular 5 which is used to simplify the HTTP library for Angular applications. This library is much more secure, efficient and faster than the earlier HTTP library as well as it also provides some additional features such as typed requests, testability, and response objects.
- Support for Internationalized Number, Date, and Currency Pipes. The earlier versions of angular were fully dependant on the browsers to get the number, date and currency format which resulted in inconsistency for users.
- The Build Optimizer was introduced which optimizes the build size and improves the application speed.
- Type checking in templates
- Improved Compilation. The compiler uses TypeScript transforms, a new feature of TypeScript 2.3 available onwards.
- Zone speed improvements
- New Router Lifecycle Events
Angular 6 was released in May 2018 and this version was released along with Angular CLI 6 and Material 6. Some of the features of Angular 6 are as follows:
- Updated Angular CLI (Command Line interface): With Angular 6, some new commands are added such as ng-update which is used to migrate from the previous version to the current version, ng-add which is used to quickly add application features.
- Updated CDK, Component Development Kit: This supports to create custom UI elements without the need of the angular material library.
- Multiple Validators: This basically used to validate the user input on a form.
- Usage of RxJS, a reactive JS library
- Tree Shaking on Services: Now the tree shaking can be applied to services to remove the unused code. That means it will remove the code from the final bundle if that code not being used or not referenced in the application.
Angular 7 was released in October 2018. The following are some of the features of Angular 7.
- CLI (Command Line Interface) Prompts: In Angular 7, the CLI prompt has been modernized to version 7.0.2. With the new and updated version of angular CLI, when the user executes common commands such as ng add @angular/material or ng new, it will prompt users.
- Application Performance: The Angular 7 application is much faster as compared to the previous versions of the angular application. This version does not aim only on making the application small but makes the application small too as much as possible.
- Bundle Budget: Now in Angular 7, the developers can set up a budget limit of their bundle size. A default setting of the bundled budget has 2 MB as the lower limit and 5 MB as the higher limit. The developer can also change these settings as per need. Reduction in bundle size improves the performance of the application.
- Angular Compiler: The new angular compiler offers an 8-phase rotating ahead-of-time compilation. The NGCC (Angular Compatibility Compiler) will convert node_modules compiled with Angular Compatibility Compiler (NGCC), into node_modules which appear to have been composed with TSC compiler transformer (NTSC). Also, the Ivy rendering engine can use such a “legacy” package due to this compiler change.
- Drag and Drop: With this feature, now the user can drag and drop the items on the list to reorder the list. It also allows the transfer of elements between the lists. Using the CDK drag handle, a user can customize the drag area as per requirement. Multiple handles apply on a single item if requires. As per the user’s command, the item may move along the X-axis or the Y-axis because the movement of drag and drop restricts along an axis.
- Virtual Scrolling: The Scrolling feature was introduced in the previous angular 6 while Angular 7 comes with virtual scrolling. The Virtual scrolling allows the users to bind a list of elements even it’s too long in small packets. As per the scroll movements, the data will be supplied into packets at the user end.
Angular 8 was introduced in May 2019. Some of the features of Angular 8 are as follows:
- Support TypeScript 3.4
- Speed and Performance
- Supports Web Workers
- Small and Modular Applications
- Preview of Ivy available
- Lazy loading
- Improvement of ngUpgrade
Angular Version numbers indicate the level of changes that are introduced by the release. This use of semantic versioning helps you understand the potential impact of updating to a new version. The angular version number has three parts. They are as follows:
For example, version 6.3.7 indicates major version 6, minor version 3 and patch version 7. The version number is incremented based on the level of changes included in the release.
Major releases contain significant new features, some but minimal developer assistance is expected during the update. When updating to a new major release, you may need to run update scripts, refactor code, run additional tests, and learn new APIs.
Minor releases contain new smaller features. Minor releases are fully backward-compatible. No developer assistance is expected during the update, but you can optionally modify your apps and libraries to begin using new APIs, features, and capabilities that were added in the release. We update peer dependencies in minor versions by expanding the supported versions, but we do not require projects to update these dependencies.
Patch releases are low risk, bug fix releases. No developer assistance is expected during the update.
If you are updating within the same major version, then you can skip any intermediate versions and update them directly to the targeted version. For example, if you want to update from 7.0.0 to 7.2.5. then you can update directly. You don’t need to update from 7.0.0 to 7.1.0 before updating it to 7.2.5.
If you are updating from one major version to another, then it is recommended that you don’t skip major versions. For example, if you want to update version 5.x.x to version 7.x.x, it is recommended you update to the latest 6.x.x release first. After successfully updating to 6.x.x. then update to 7.x.x.
- A Major release every 6 months.
- 1 to 3 minor releases for each major release.
- A patch release in almost every week.
All major releases are supported for 18 months. 6 months of active support during which regularly scheduled updated and patches are released. 12 months pf long-term support (LTS) during which only critical fixes and security patches are released.
The following table provides the status for angular versions under support. As you can see, at the moment, angular 4, 5 and 6 are no longer under support.
In the next article, I am going to discuss the Angular Environment Setup in detail. Here, in this article, I try to give an overview of Angular Versions in detail. I hope you enjoy this article.