What’s new in Angular 9.1

• Better application startup time on modern browsers.
• APIs for tapping into the CLI.
• More web standards support.
• Differential loading, in which the browser chooses between modern or legacy JavaScript based on its own capabilities. When users load an application, they automatically get the needed bundle.
• Web workers, which can speed up an application during CPU-intensive processing, now can be generated from the CLI.
• A dynamic imports capability for importing modules. This is useful when developers want to load a module conditionally or on demand. Dynamic imports will improve support from editors such as Visual Studio Code, which will be able to validate these imports.
• Builder APIs for tapping into ng build, ng test, and ng run to perform processes such as build and deployment.
• Workspace APIs in the CLI, with an API to make it easier to modify the workspace configuration. The workspaces namespace offers an API for interacting with workspace file formats.
• Improvements for migrating from AngularJS, the previous generation of the framework. A LocationUpgradeModule enables a unified location service to shift responsibilities to the Angular Location.
• TypeScript 3.3 support.
• Two new features, the Ivy renderer and Bazel build tool, remain in the preview stage. 
• Adding the ability to watch for AngularJS URL updates through the onUrlChange hook. This pull request adds a method to the LocationShim so updates in AngularJS can be tracked in Angular.
• The addition of overloads to the transform methods of SlicePipe, so there are better types than any for value and any as a return. In a breaking change, the slice pipe is now properly typed, so the Ivy renderer and fullTemplateTypeCheck will catch errors inside an ngFor using a slice. SlicePipe creates a new Array or String with a subset (slice) of the elements.
• An API to retrieve the value of history.state, useful in providing a backward-compatible Location service that can emulate the AngularJS $location service, since it will be necessary to read the state date in order to produce AngularJS location transition events. The feature also will be useful to any application that wants to access state data through Angular instead of going directly to DOM APIs. 
• DOCUMENT is no longer a token exported from @angular/platform-browser. It is now exported only from @angular/common.
• Attributes for aria-* are treated as safe HTML and are not being stripped by the HTML sanitizer. Previously, aria attributes were stripped by the HTML sanitizer as unsafe.
• Support for skipping leading trivia in the lexer. Leading trivia, such as whitespace or comments, is confusing for developers looking at source-mapped templates.
• Logging has been made more configurable in the compiler-cli, with CLI usage and integrations such as webpack plug-ins to filter excessive log messages.
• An AbstractType<T> interface will match classes whether they are abstract or concrete. Casting as AbstractType<MyConcrete> will return a type that is not newable. This type will be used to match abstract classes in the get() functions of Injector and TestBed. 
• An update schematic called “template-var-assignment” is introduced to analyze template files to warn developers if template variables are assigned to values. The schematic comes with a driver for TSLint.
• For service-worker, multiple apps can be supported on different subpaths of a domain. Until now, the service-worker has cached data of multiple apps in cache DB files in a different domain. This has made apps break when switching from one app to another in the same domain. The new capability solves this issue.
• Support for TypeScript 3.3. Support for TypeScript 3.1 and TypeScript 3.2 will be dropped.
• The addition of a command-line flag to expose Bazel build files on disk.
• Modification of Bazel to copy the workspace and bazel files to the project root directory before invoking Bazel.
• Removal of components from a FormaArray. This provides a convenience. Previously, FormArray had to be looped, removing each component until empty.
• Providing external tooling the ability for async providers to finish resolving before the document is serialized.
• An update schematic for the @angular/core package to migrate to the explicit query timing syntax. This affects ViewChild and ContentChild query resolution. While not yet required, queries with Ivy will be dynamic by default. So, specifying an explicit query timing ensures that developers can migrate smoothly to Ivy, once Ivy is the default renderer.
• A JSON schema for service worker configuration.
• For Bazel, ts_config has been added to extend support for the ng_module. This also is a step toward enabling the importing of material2 as a Bazel dependency.
• For the router, a hash-based navigation option has been added to setUpLocationSync. With this change, developers now can pass an option to setUpLocationSync to ensure that location changes run in hash-based apps.
• In the Angular core, users now can define timing of ViewChild/ContentChild queries. Previously, an inconsistency in resolution timing could cause confusion and code depending on a query result could stop working.
• In the compiler, support has been added for tokenizing a subset of an input string and tokenizing escape strings.
• The compiler-cli no longer supports external symbols by default.
• With SASS backing for Bazel, rules are added to the workspace for a project requiring the SASS extension to CSS. With SASS, developers can write visual styles for a website in a more advanced language that is compiled to CSS.
• A performance improvement for smaller images that uses pngcrsh, an optimizer that makes images smaller for all PNG files.
• createinjector() is removed from the pubic API. Createinjector() is an API for the planned Ivy renderer, which is due in a beta form later this year. Plans call for re-exporting the API when Ivy is released
• Consistency of typeof checks, in which the sequence of strictly not equal to null followed by typeof value == 'object' is used when testing whether value is an object. This is being done because there is no point to using double equal with null because undefined is ruled out by the typeof check. The improvement also would avoid an unnecessary ToBoolean check.
• The TypeScript compiler transformer, ngtsc, is exposed as a plug-in, enabling wiring of ngtsc into an existing TypeScript compilation binary.
• For the compiler-cli, generated SASS/Less (Leaner Style Sheets) files are resolved to .css inputs.
• For forms, a control and descendant controls can be marked as touched.
• Also for Bazel, a bug fix has been implemented in which the node memory limit for ng-module has been increased to prevent out-of-memory issues with large modules. When memory is not released correctly or a process continues to use more and more of it, process failure can result.
• To improve performance for @angular/platform-server, Angular 8.0 uses a shared DomElementSchemaRegistry instance. This addresses a problem in which ServerRendererFactory2 creates a new instance of DomElementSchemaRegistry for every request, which is very costly. Reusing a single instance avoids overhead per request.
• Also for forms, Angular 8.0 exports NumberValueAccessor and RangeValueAccessor directives.
• Provide smaller bundle sizes and better startup performance for Bazel so applications will load quickly, even on slow mobile connections.
• Make Angular code easier to debug, even as applications grow larger.
• IMproved Bazel peed rebuild times.
• Improve Bazel template type-checking.
• Differential loading of modern JavaScript, with the command-line interface (CLI) producing both legacy and modern (ECMAScript 2015 and later) JavaScript bundles as part of the build process. These will be differentially loaded client-side to improve loading speed and time to interactive (TTI) for modern browsers.
• A backward compatibility mode for the Angular router to simplify upgrades for large projects.
• Improved web worker bundling, with bundling added to the CLI.
• Opt-in usage sharing, with Google collecting data anonymously on factors such as commands used and build speed.
• Dependency updates for tools such as TypeScript, Microsoft’s typed superset of JavaScript.

New features in Angular 7.2

Released in early January 2019, Angular 7.2 enhances router capabilities, including:

• The addition of the Navigation type during navigation. This offers target URLs, Navigation, and NavigationExtras data.
• Allow for passing of state to routerLink directives, as well as passing of state to NavigationExtras.
• Restoration of a whole object when navigating back to a page managed by the Angular router.
• The addition of the pathParamsOrQueryParamsChange mode for runGuardsAndResolvers. This provides an option in which guards and resolvers will ignore changes to matrix parameters. Guards and resolvers will be rerun when the path changes, when path parameters change, or if query parameters change. The primary use of this mode is when updating the UI and getting the URL in sync with local changes.

Also new in Angular 7.2 is an ng-schematics capability for the Bazel build tool. Schematics are created for building a project with an ng new command. Version 7.2 also has bug fixes for Bazel, the router, and the core of the framework.

New features in Angular 7.1

While considered a minor release mainly focused on bug fixes, the router in Angular 7.1 has added the pathParamsChange mode for runGuardsAndResolvers, meaning guards and resolvers will ignore changes to optional parameters such as query and matrix parameters. When the path or any params change, the guards and resolvers will run.

Other new features in Angular 7.1 include:

• A bug fix to the Ivy compiler so it now can generate inputs and aliases properly. The compiler had been generating an outdated input property format, resulting in SimpleChange objects not being properly generated, breaking some ngOnChanges hooks in forms tests.
• Also in the compiler, a bug fix generates a relative path only in summary file errors. Previously, errors in the summary file included absolute file names, which is considered undesirable, since the output of a build should not depend on the current working directory. This can cause nondeterminism issues in builds.
• The compiler now can mark an InvokeFunctionExpr as pure.
• For the core of the framework, a static dependency to @angular/compiler has been removed from @angular/core.
• A regression in the router has been fixed in which the navigateByUrl promise did not resolve on CanLoad failure.
• For service workers, typing has been added to the public API guard and lint errors have been fixed.

New features in Angular 7.0

Released in October 2018, Angular 7.0 has the following new features:

• Application performance has been improved by automatically adding or removing the reflect metadata polyfill, making applications smaller in production.
• Default bundle budgets have been introduced; they will warn users when applications exceed 2MB. There will be an error if the initial bundle exceeds 5MB.
• With the CLI Prompts capability, the Angular CLI can prompt users to help them make decisions. The ng new capability asks if users want to add routing and what type of styles to use, while ng add @angular/material asks users what theme they want and if they want gestures or animations.
• The CLI documentation has been integrated into the main Angular.io docs.
• For Angular Material and the CDK (Component Dev Kit), Angular 7 features visual improvements from the Material Design 2018 refresh as well as virtual scrolling, for dynamically loading and unloading parts of the DOM to build high-performing, large lists of data. Also, applications can be fitted with a drag-and-drop capability.
• Angular Elements components now support content projection via slots.

New features in Angular 6.1

Google’s Angular 6.1 arrived in late July 2018. Version 6.1 is slated to be the last minor release in the Angular 6.x line. 

Its router scroll position restoration lets developers configure the router to remember and restore scroll position while the user navigates an application. New events reset the scroll position; pressing the Back button restores the prior position. To turn this capability on, use this setting RouterModule.forRoot(routes, {scrollPositionRestoration: 'enabled'}). This capability is expected to become the default setting in a future release.

Angular Version 6.1 also adds ShadowDOM Version 1 view encapsulation, by which CSS is connected to components. The component decorator has better cross-browser support and is necessary for content project with Angular Elements. ShadowDOM improves on CSS and DOM, letting developers bundle CSS with markup, hide implementation details, and build self-contained components in vanilla JavaScript.

Angular 6.1’s scroll position management automatically resets or remembers a scroll when navigating around an application. This capability comes into play when using the Angular router. Developers have been building their own scroll positioning for Angular, but now they get this function out of the box.

Other capabilities in Angular 6.1 include:

• The ability to pipe an object through the keyvalue pipe, which provides an array suitable for use within an *ngFor.
• Schematics chaining has been improved through support for returning a rule from an existing rule. Developers can more dynamically determine rules to follow when designing schematics.
• TypeScript 2.9 is now supported, in addition to Versions 2.8 and 2.7.

New features in Angular 6.0

Version 6 continues an emphasis on being smaller, faster and easier to use. The new features include:

• Version 4 of the Webpack module bundler for JavaScript, generating smaller modules through a technique known as scope hosting.
• A new method of connecting modules and services, in which services can be “tree-shakable,” meaning they can be left out of an application if not used.
• Support for the RxJS 6 library for JavaScript, reducing bundle sizes for common use cases.
• The Angular command-line interface, bringing commands such as ng update, for updating dependencies and code. Another command in the CLI, ng add, helps developers more quickly add application features, such as starting out with a Material Design application rather than with a blank application. Material Design is Google’s language for designing applications. The ng add command also supports turning applications into progressive web apps, which support offline webpages.
• CLI support for libraries, with developers able to choose ng-packgr for transpiling libraries to an Angular format or use the Bazel tool to build libraries. Previously, developers had to build and package libraries by hand if they wanted to share components and services with other teams.
• Capabilities are included from the Angular Elements project, which packages components as reusable Custom Elements in an Angular application. A future release of Angular will make it possible to package Custom Elements for use in third-party applications, including those not using Angular.
• The Tree component in Angular Material and the Component Dev Kit to help visual tree structures such as a list of files.
• An optional, backward-compatible generic type to support typed nativeElement.

Along with the Angular 6 release, framework packages are being moved to Version 6 as well, including @angular/core, @angular/common, @angular/compiler, the Angular CLI, and Angular Material + CDK (Component Dev Kit).

New features in Angular 5

Despite the “5” designation, the AngularJS upgrade was just the fourth release for the framework, which was initially called AngularJS and debuted in 2012. Angular 5’s release took longer than expected, missing previous release targets of September 18 and October 23, 2017.

Key Angular 5 features include:

• An emphasis on making it easier to build progressive web apps, so apps can be cached in the browser. The progressive web apps concept, the product of a joint effort between Google and Mozilla, is about enabling development of browser-based apps that offer a superior, native-like experience. Google is still building support for capability in the command-line interface (CLI).
• A build optimizer that makes the application smaller by eliminating unnecessary code. (The build optimizer is a command-line tool.)
• Making Material Design components compatible with server-side rendering. Google needs to fix a few bugs before releasing this functionality.
• Angular Universal State Transfer API and DOM support, for sharing code between server- and client-side versions of an application.
• The compiler has been improved to support incremental compilation. The compiler operates as a TypeScript transform, for faster rebuilds.
• Pipes for internationalized number, date, and currency. This increases standardization across browsers and eliminates the need for i18n polyfills.
• To remove more polyfills, the ReflectiveInjector has been replaced with the StaticInjector. As a result, application size is reduced for most developers.
• Multiple names are supported for components and directives, which is useful in helping users migrate without breaking changes.
• Angular 5 has an updated Httpclient.
• CLI 1.5, which generates Angular 5 projects by default.
• For Angular forms, developers can run validation and value updates on blur and submit rather than on every input event.
• The RxJS reactive programming library has been updated to version 5.5.2 or later, featuring operators that eliminate the side effects of code-splitting and tree-shaking problems. Also, RxJS now distributes a version using ECMAScript modules, pulled in by default by the Angular CLI.
• Router hooks have been added for tracking router cycles from the beginning of running guards until completion of activation.

Angular 5 does have an issue with production build source maps, with some maps resulting in undefined sources for errors. Also, many previously deprecated APIs, such as Opaque Token, have been removed.

The history of Angular’s versions

Released in November 2017, Angular 5 followed closely the releases of versions 2 and 4, which arrived in September 2016 and March 2017, respectively, skipping over a version 3 designation. (Because the router for Angular already had reached version 4 by the time Angular 3 was due, Google just went right to calling the upgrade itself Angular 4.)

Although the original AngularJS JavaScript development framework already was a hit with developers, Google undertook a rewrite for the second generation, focused on better performance. “We couldn’t get more performance out of the old architecture,” Green said. Angular 2 was rewritten in TypeScript, Microsoft’s typed superset of JavaScript. “TypeScript let us do static analysis of source code. This is something we can’t do in JavaScript, so it becomes much more predictable,” Green said. TypeScript also lets Angular show developers errors in HTML templates.

Another feature added in Angular 2 was a compiler that sits in between written code and output shipped to a production application. This compiler optimizes the generation of template-rendering; code then can run at maximum speed in JavaScript virtual machines.

Angular 2 also offered a much cleaner component model. Interoperation with technologies such as web components was also a focus in Angular 2.

Angular 4, meanwhile, offered view-engine improvements and code-generation reductions. The Angular 4.3 upgrade, was released in July and featured HttpClient, which provided a smaller, easier-to-use library for making HTTP requests.

Angular 4.3 also has an attribute, @.disabled, for conditionally disabling animations as well as new router life cycle events. Since the 4.0 version, Angular also enhanced animations so parent and child elements can be coordinated across page transitions.