This is the final episode of 2024, and it’s been a busy holiday season! From Observable Standardization to Signal-based Forms and Router integration in DevTools, and even more.
Observables Standardization
There are developments that Observables—and even Signals—are becoming Web Standards. Dominic Farolino is leading the implementation and showcased what’s currently possible and what’s planned at TechStackNation.
There will be differences compared to RxJS Observables. For instance:
The standardized Observable might be hot, meaning it multicasts like the share operator.
Cancellation will use the AbortSignal, similar to the native fetch, instead of unsubscribe.
In some cases, the Observable may return a Promise when it completes.
Alex Rickabaugh and Pawel Kozlowski from the Angular team continued the discussion with Dominic, particularly around Observables vs. Signals.
Alex noted that Observables represent events at specific points in time, while Signals represent state that is always available. He also highlighted that BehaviorSubject is actually used to hold state. That is not eventing and will probably not be part of the standard.
This is the explainer for the Observable API proposal for more ergonomic and
composable event handling.
Introduction
EventTarget integration
This proposal adds a .when() method to EventTarget that becomes a better
addEventListener(); specifically it returns a new
Observable that adds a new event listener to the target
when its subscribe() method is called. The Observable calls the subscriber's
next() handler with each event.
Observables turn event handling, filtering, and termination, into an explicit, declarative flow
that's easier to understand and
compose
than today's imperative version, which often requires nested calls to addEventListener() and
hard-to-follow callback chains.
Example 1
// Filtering and mapping:element.when('click').filter((e)=>e.target.matches('.foo')).map((e)=>({x: e.clientX,y: e.clientY})).
Forms are a central part of many Angular applications, and an official Signal-based solution is eagerly awaited.
A branch is now available, though Matthieu Riegler from the Angular team explained that the project is still in an early brainstorming phase. Expect significant changes before it reaches an RFC.
Starting with Angular 19.0.5, the Angular DevTools extension now provides router insights. It shows which routes are lazy-loaded, eagerly loaded, and currently active.
ng-news
