Angular Authoring is Broken: It’s Verbose, but It Doesn’t Have to Be?—?Introducing a New Lightweight Fork

? Based on Angular 19 (always syncing)

? Removal of requirements for selectors

? Automatic imports for standalone components

? Automatic imports for standalone directives

? Automatic imports for standalone pipes

That’s right, you no longer need to add duplicate imports for standalone components, pipes, and directives!

Want to see the code or even play around with, use Treaty starter kit template Try it out today on the starter kit: https://github.com/treatyjs/experimental-angular-class-authoring-, feel free to watch this video to see this in action https://www.youtube.com/watch?v=7mYjB43BClg

How does Optional Selectors work?

Currently it works but adding the selectors at compile time for you, I will look at changing it more at a later stage. notes: the compiler will strip any suffix of component. pipe and Directives.?

Why Fork?It??

Mainly to counter the argument that improving the authoring experience in Angular requires a radical new format like Svelte, Vue, or React. Before Angular releases the much-anticipated RFC, I thought it would be beneficial for people to experience what lightweight authoring can look like in Angular and to have a chance to experiment.

Is It Compatible with?Angular?

Absolutely. The treaty as a whole was always intended to be compatible with the Angular runtime, compiling into Ivy. This means your libraries and components can be imported in both Angular and Treaty without conflict.

Will This Be on?NPM?

Likely not; however, you can import it from the builds repos and start experimenting today, just as you can with Angular currently. The reason for this is that class authoring is being considered by Angular, and Treaty intends to rely on their long-term implementation. Treaty is taking its time to ensure things are done correctly and aims to function as a pre-transformer rather than a raw transform that necessitates a long-term fork of Angular.

Small Background:

TreatyJs is a meta-framework I started about a year ago with the sole purpose of revolutionising the authoring experience, full stack typesafe, easy deploy meta-framework. I decided to create a lightweight fork of Angular because while the intentions of TreatyJs will remain the same, class authoring has always been on the agenda. I know Angular is looking into this, and there is a shared concept based on their presentations. While the long-term vision is to support any changes using the custom compiler, there was a real need to get this out for people to experiment with and provide feedback?—?especially compared to radical changes like Analog and Treaty’s own authoring playground.

Can We Expect Any Other?Changes?

Possibly. The aim is to showcase functionality that is currently missing. While this will ideally be integrated into Treaty’s own Ivy compiler, I see a need to propose some ideas within the Angular code. Although I will never possess the same level of knowledge as the Angular team, this is designed to illustrate where improvements can be implemented.

Features Being Considered for the Fork: Allowing constants to be used in templates?—?I believe this has been on people’s wish lists for some time. My aim is to release the first version, which requires tracking constants and enums only outside of the class.

Supporting input spreading {…someInputs}?—?To maintain Angular runtime compatibility, my initial idea is a createStruct({…}) or struct({…}), which would prevent the object from having additional keys/indices upon creation. This would allow for type-checking and create bindings at build time.

Comparison:?

Angular

Treaty

Overall, this decision wasn’t made lightly and is by no means intended to change the course of Angular. I’ve always loved Angular since AngularJS and have been using it since the initial beta of Angular+. The team has done an excellent job, and I wanted to help provide hands-on experience to other developers with a simpler Single File Component in Angular.

Treaty RFC/Technical outlines for the?changes:

Optional Selectors: https://github.com/treatyjs/treaty/discussions/2 Enhancing TreatyJs with Implicit Import Resolution: https://github.com/treatyjs/treaty/discussions/3

Try it out today on the starter kit: https://github.com/treatyjs/experimental-angular-class-authoring-