DEV Community

Cover image for Ng-News 25/04: Angular 19.1, Strategies for 2025, Q&A and More
ng-news for This is Angular

Posted on

Ng-News 25/04: Angular 19.1, Strategies for 2025, Q&A and More

Angular 19.1 has been released with new features like HMR for templates and a schematic for removing unused imports. The monthly Q&A session covered topics like the new resource function and Angular's 2025 strategy. There's also discussion about the "inject" function and the promising new bundler, Rspack.

Angular 19.1

Angular 19.1 has been released, and it comes with at least three main features.

The first is HMR for templates. If you're in development/serve mode, and you change a template, the browser used to do a reload, which resets the application state. Now, in 19.1, only the template will update itself. This even works for single-file components (SFC).

In Angular 19.0, we got a warning if a component's imports were not used. With 19.1, we have a schematic that can remove them. Unfortunately, it's not yet available as an ESLint rule; hopefully, that's just a question of time. Until then, you can run that schematic within a Git Hook.

For those of you who are using the ngTemplateOutlet directive: if it contains a component, you can now directly access the component instance.

https://angular.love/angular-19-1

What’s new in Angular 19.1? | Ninja Squad

Angular 19.1 is out!

favicon blog.ninja-squad.com

Monthly Q&A Session

The monthly Q&A session took place, and Jeremy showcased the new resource function. He highlighted that it's not a replacement for the HttpClient but a basic function for any asynchronous task. So, instead of HTTP, it could also process IndexedDB or tRPC.

He also confirmed the plan for optional RxJS and elaborated a little bit on what that means for its future usage. RxJS will not be required to write a new Angular application, but if needed, the support will be first-class.

He also confirmed that Signal Forms and httpResource are in the planning phase.

Angular Strategy for 2025

According to Minko Gechev, the Angular product lead, the plan for 2025 is to quickly move zoneless from experimental to developer preview, introduce SignalForms as a successor to template-driven and ReactiveForms (while still supporting the old ones with Signals), and finally replace Karma with the Modern WebTest Runner. Additionally, an RFC for selectorless is planned; selectorless means that we will only have one import instead of two for components/pipes/directives.

Angular's strategy is based on the Developer Survey, where they had a sample size of 10,000. Surprisingly, the feature that most people expressed negative opinions about was RxJS. The most positive response was for Signals.

Angular 2025 Strategy. For the past two and a half years… | by Minko Gechev | Jan, 2025 | Angular Blog

For the past two and a half years, we’ve been laser focused on improving developer experience and performance for all Angular developers…

favicon blog.angular.dev

inject() as ServiceLocator?

Sometimes technical discussions center around the proper term for a given thing. A popular example in Angular is whether the inject function is a ServiceLocator or not, and if so, if it should be avoided. The main point that gets missed, however, is the problem with the ServiceLocator pattern itself.

Matthieu Riegler published an article where he discusses that. He says that inject aligns more with DI because the dependencies are defined during the construction phase rather than appearing elsewhere; inject uses Angular's DI; and we can separate the implementation from what the consumer requires. On the other hand, you can violate inject if you use runInInjectionContext. That means it could happen anywhere, and the declarative style from the beginning is missing.

Mattieu also published a decision tree, which guides you toward finding the right Signal-based type/function for your problem.

Rspack

The term Rspack will show up quite often this year. Rspack is a bundler, like webpack or esbuild, and it promises faster build times. It comes from ByteDance, the company behind TikTok, and it primarily solves their need, which is for handling huge codebases/mono repositories. It is written in Rust and is compatible with webpack.

Angular doesn't officially support it, but Colum Ferry from Nx is researching and working on an Angular integration. There are already some versions that are quite promising.

You can learn more about it by heading to ng-rspack-build on GitHub, following Colum Ferry, or reading an article by Manfred Steyer.

GitHub logo Coly010 / ng-rspack-build

Rspack plugin and loaders to build Angular applications

Rsbuild Plugin Angular

Angular Rspack and Rsbuild Tools

GitHub Actions License

NPM Version NPM Version NPM Version NPM Version


Build Angular with Rspack and Rsbuild

The goal of @ng-rsbuild/plugin-angular and @ng-rspack/build is to make easy and straightforward to build Angular applications with Rspack and Rsbuild.

Documentation

The documentation for this project can be found at angular-rspack.dev.

Rsbuild Support

Thank you to Brandon Roberts and Analog for their work on building Angular applications with Vite which both inspired this plugin and provided a basis for the compilation implementation.

Currently, the Rsbuild support is more feature complete than the Rspack support. There exists an Rsbuild plugin that can be used with a rsbuild.config.ts file to support compiling Angular applications with Rsbuild.

Setup for SSR Application

Prerequisites: Angular SSR Application already created with ng new --ssr.

  1. Install Rsbuild: npm install --save-dev @rsbuild/core
  2. Install this plugin: npm install --save-dev @ng-rsbuild/plugin-angular
  3. Create an rsbuild.config.ts file at the root of your project with the following:
import
Enter fullscreen mode Exit fullscreen mode

Rspack

Fast Rust-based web bundler

favicon rspack.dev

Top comments (0)