It’s time for the compatibility opt-in preview of Ivy!

We’re looking for developers willing to give new things a try (with a few rough edges) and who want to share their experiences with us. If you are interested, you should follow the steps below and let us know what issues you run into.

This preview is primarily intended to validate backward compatibility, as performance and bundle size improvements are still in progress.

The plan is to make sure most Angular applications keep working without significant changes, and then to focus on leveraging the improvements to the underlying framework.

Current Status

We’ve achieved an important stability milestone with Ivy’s backward compatibility. Based on our testing across thousands of test suites inside of Google (97% of test suites are passing at Google), we’re reasonably confident that the majority of applications will work without changes across the ecosystem. We have several known issues that we are working on, but we expect that there will be a long tail of smaller issues to fix.

Now that we’ve hit this milestone, we need your help with identifying and reporting these issues. Opt in to the preview, give it a try, and let us know what breaks.

There are three things we’re going to be doing with issues reported to us:

1. Fix them — Whenever possible, we want to use this input to address backward compatibility issues.
2. Acknowledge them — Some of the issues reported will be from applications relying on unspecified behavior or behavior that is not part of our public API. We likely won’t be able to revert these changes, but we want to understand and help developers identify if they are running into one of these.
3. Automate them — If there are any large scale issues or patterns that we discover across the ecosystem (such as a dependency or problematic code written by a popular schematic), we want to build schematics and TSLint rules to automate migrations.

What about performance and bundle size?

We are still working on improvements for bundle size and runtime performance. When you update today, you won’t yet see all of these benefits.

We are currently seeing that generated code and Hello World apps are smaller, but in some cases Angular itself is bigger. Here are some early results we’ve seen from apps upgrading to Ivy:

ng new my-app @ 8.1.0-next.1

Before Ivy
Main Bundle (135 KiB)

With Ivy Preview
Main Bundle (122 KiB)

Real World Angular @ 8.1.0-next.1

Before Ivy
Main Bundle (358 KiB)
Lazy Chunks (7.7–34 KiB)

With Ivy Preview
Main Bundle (400 KiB)
Lazy Chunks (3.3–27 KiB)

We are now working on reducing the framework size so that we have reduced bundle sizes for real applications in nearly every case before making Ivy the default. Additional benefits will also be possible as we offer new ways of bootstrapping that will leave out more of Angular from your main bundle.

We’ll be making more announcements about performance and bundle size milestones for real world applications in the next several months as we get closer to turning Ivy on by default for all applications.

What should I expect to see today?

Your app should build and function as it does today. You’ll note the following benefits that are due to the new compiler and instruction set:

• Minor improvements in bundle size — ng new is 10% smaller and generated code should see ~25% reduction in size
• Better re-compilation performance — incremental compilation, re-building in AOT mode is 40% faster
• Better testing performance — Within Angular, we’ve seen framework unit tests are 1.5x faster, Material Unit tests are 2.7x faster, and memory usage in Material unit tests is down 81%
• More debuggable instructions — Add breakpoints to HTML and step through rendering of the template, and more easily debug change detection because you can step up to the template function in the stack trace and see where you are

We also have fixed many long-standing bugs, improved confusing behavior, and addressed some performance issues.

• Class bindings always override other classes (7289)
• ContentChildren queries select host node (10098)
• Queries have inconsistent resolution timing (21800, 25961)
• Descendants flag works inconsistently (14769, 27504)
• Change detection still running for detached components that are projected (21324)
• Local template ref behavior inconsistent / confusing
• Adding components to entry-components list is no longer necessary (28826)

How do I opt in?

We have published a guide here: https://angular.io/guide/ivy

You should always run the latest version of Angular from npm (tagged next) whenever using Ivy. We’ll be making frequent changes over the coming months. You can use ng-update to get to the latest version as follows:

ng update @angular/core --next

Once you are on the latest version, update your src/tsconfig.app.json to include "enableIvy": true under a top level angularCompilerOptions key.

When you run ng build, we’ll do the Angular compatibility compilation (ngcc) of your node_modules folder and will update all of your metadata files into a format we can convert into Ivy instructions.

Give us feedback

We’re rapidly approaching a future where the benefits of Ivy are automatic and universal for all developers and Project Ivy comes to a conclusion. In the meantime, open an issue, or reach out to devrel@angular.io to give us feedback about your experiences with the opt-in preview.