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.
  • 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
  • 25

    This website collects cookies to deliver better user experience

    Difference between Angular versions