Authors: Jatin Ramanathan, Minko Gechev You may know Angular as the web framework from Google, but Google actually has another web framework: Wiz. Both Angular and Wiz are used by thousands of engineers and thousands of apps inside of Google. Wiz is an internal framework that is used by some of the most popular Google products such as Search, Photos, Payments and many others. Over the last year we’ve been exploring ways for Angular to benefit from the performance of Wiz and Wiz to benefit from the developer experience of Angular. Historically, Angular and Wiz have been serving differ ..read more

Angular v17.3 introduces the improved API for declaring outputs as a developer preview. The new output API provides developers with: a simpler and safer API for declaring outputs in directives. a consistent API aligned with the new signal inputs, queries or model functions. more correct types for emitting values. The existing @Output API with EventEmitter does not guarantee proper type safety and could cause subtle runtime errors to surface. The new output API is now available in developer preview and we would like your feedback. The new API Outputs allow component authors to emit ..read more

Lighting consoles are electronic devices used in theatrical lighting design to control multiple stage lights at once. Traditionally, lighting consoles are standalone physical devices. The nstudio team wanted to bring the power and versatility of the lighting console to mobile devices. This is the story of how we used Angular and NativeScript to bring that vision to reality. We developed Blackout, an iPad app that provides the same features as standalone lighting consoles on a table. The app supports a versatile DMX (Digital Multiplex) control platform, compatible with industry-standard sA ..read more

Signal Input is now available in developer preview for Angular devs In Angular 17.1 we introduced signal-based inputs as a reactive alternative to decorator-based @Input(). The new inputs provide developers with new ways that: allow you to integrate and benefit from Angular signals today:▹ providing easier ways to run logic whenever an input changes. ▹ efficient solutions for deriving state from inputs. ▹ enabling a smoother experience with OnPush and future Zoneless. improve code quality and developer productivity by increasing type safety of inputs. Those are available in d ..read more

We rarely write blog posts about minor releases, but today we have a few surprises for you — experimental support for Material 3, signal queries, model inputs, Netlify loader, and hydration debugging support in Angular DevTools. In the next few paragraphs you’ll learn more about the individual features and find links to documentation. Experimental Material 3 Over the past months we’ve been working hard to transition the Angular ecosystem to the latest version of Material Design for the Web. In the process we worked with the Material Design team at Google to understand what M3 means for th ..read more

Introduction We’re thrilled to announce that Angular 17.2 features experimental support for Material 3 theming in Angular Material. In this blog post we’re updating you on the latest news about this feature and providing a preview of what’s next for Material 3 support. What is Material 3 Material 3 is the latest evolution of Material Design, Google’s open-source design system. Material 3 for Angular is implemented as an alternate theme, compatible with the same Angular Material components and Sass mixins you use today. Material 3 themes are based on design tokens (implemented as ..read more

Over the past year we’ve been evolving Angular based on developer feedback and community trends. We receive developer feedback from dozens of sources including GitHub, social media, interviews, conferences, etc. One of the strongest guiding indicators which has been highly influential in our prioritization process are the results from the Angular developer survey. In 2023 we delivered a lot to address developers needs for higher performance and better developer experience. Just to mention a few improvements: to make Angular more enjoyable to use, we shipped a brand new build pipeline that impr ..read more

Nikolay Vitkov from the Puppeteer Team co-authored this blog post. Puppeteer, a powerful tool for automating browser interactions, is now even easier to integrate with your Angular projects thanks to the newly released @puppeteer/ng-schematics package. This package provides an out-of-the-box experience for setting up and running Puppeteer tests, minimizing the configuration burden and accelerating your automation journey — especially creating end-to-end tests! Quick setup for new project For new projects, integrating Puppeteer is a breeze. Run ng e2e and choose the Puppeteer option ..read more

Photo by Mike van den Bos on Unsplash The Angular community has asked for an intuitive, built-in method to lazy load components, directives, and pipes. In Angular v17, we’ve created Deferrable Views, a new feature that will make the process of defer loading dependencies significantly more intuitive. We built the deferrable views feature alongside the new control flow syntax using the same “@-syntax”. Our goal is for it to be ergonomic and familiar when using this new syntax in your component templates. Deferrable views help you optimize your initial bundle size and improve the initial loa ..read more

Last month marked the 13th anniversary of Angular’s red shield. AngularJS was the starting point for a new wave of JavaScript frameworks emerging to support the increasing need for rich web experiences. Today with a new look and a set of forward-thinking features we bring everyone along to the future with version 17, setting new standards for performance and developer experience. In v17 we’re happy to introduce: Deferrable views which brings performance and developer experience to the next level Up to 90% faster runtime with a built-in control flow loops in public benchmarks Up to 87% f ..read more