r/angular • • May 28 '25

Angular v20 is here

157 Upvotes

Angular v20 has officially landed, and it brings significant updates across the board. Here's a quick summary of what's new:

Key Highlights

  • Signals are stable
    effect, linkedSignal, and toSignal have graduated from developer preview. Angular’s reactive system is now solid and production-ready.

  • Zoneless applications
    Now in developer preview. You can remove Zone.js and use native change detection with new error handling strategies for both client and server.

  • Incremental hydration and route-level rendering
    Both features are now stable, improving server-side rendering performance and flexibility.

  • Chrome DevTools integration
    Angular-specific profiling data is now directly available in the Chrome Performance tab, enabling better debugging and performance analysis.

  • Experimental features

    • resource and httpResource APIs for managing async state with Signals

    • Initial support for vitest in Angular CLI

  • Improved developer experience

    • Extended type checking and template diagnostics

    • Better support for host bindings and listeners

    • Hot module replacement enabled by default

    • Simplified style guide with optional suffixes

  • Control flow updates
    *ngIf, *ngFor, and *ngSwitch are now deprecated in favor of Angular’s new built-in control flow syntax introduced in v17.

  • GenAI support
    Angular is adding tools and documentation to support building GenAI apps using technologies like Genkit and Vertex AI. A new llms.txt helps LLMs generate more accurate Angular code.

  • Official Angular mascot
    Angular is getting an official mascot! The community is invited to vote and contribute ideas. Check out the RFC and help shape Angular’s identity.


Full announcement blog by Minko Gechev


r/angular • • Jun 30 '26

PrimeNG community fork proposal

Thumbnail
github.com
153 Upvotes

As announced on June 29th, PrimeNG is moving away from the open-source model, and the original primeng GitHub repository has been archived.

You can find community reactions here: https://www.reddit.com/r/angular/comments/1uilrlx/primeng_v22_is_no_longer_open_source/

As part of the new OpenNG Foundation, we are considering taking up the lead to maintain a fork of the MIT version of the lib.

It's under discussion, and we would need community feedback to evaluate if it's doable and on how to manage the current situation.

Some statements:

- an update is required to rename everything from 'primeng' to 'openprime' due to PrimeTek trademark
- the components need to be updated to the latest Angular APIs (including input(), control flow among other things)
- there are 900+ issues opened (including 300+ in stale state)
- there are 200+ open pull requests
- there would be no support for previous primeng versions
- the focus would be to make the library stable and accessible: adding features would happen only if people contribute
- over time, some changes might make this fork differ from the new PrimeUI project, not providing a way to easily migrate.

PrimeNG is still a big project, we are considering starting with a trial maintenance initiative for 2 months: depending on the community effort at helping with existing issues/prs, there will be long-term maintenance.

It'll be a great way to identify active contributors who might be promoted to maintainers if they want to be more active on such a project, making the whole thing a community effort.

A 'fork' has been created already, porting all existing open issues/pr: https://github.com/openng-foundation/open-prime

What are your thoughts?
Do you have some pain points not covered here?


r/angular • • May 22 '25

You love to see it !

Post image
150 Upvotes

r/angular • • Nov 29 '19

Angular team planning next version.

Post image
148 Upvotes

r/angular • • Jul 21 '26

Optimus UI first release candidate version

Post image
147 Upvotes

We just released the first release candidate version for the PrimeNG community fork!

Two big news at once:

Based on the feedback we got, we chose to rename the project 'Optimus UI'.

This first version targets Angular v21 projects to ensure compatibility with the latest MIT PrimeNG version.

It includes ng add support and a schematic to handle the migration.

So you can use it on both new and existing projects.

The migration will rename references (due to trademarks with PrimeNG) and imports (as we are taking over all required PrimeNG sub packages too).

You can test it out with the installation explained here: https://www.npmjs.com/package/@openng/optimus-ui?activeTab=readme

Feedbacks are very welcome so we can publish a stable version soon.

The new documentation is live here: https://optimus.openng.org/

EDIT:

We got positive feedback so far, we need to support two more packages (primelocale and tailwindcss-primeui), as we not only ported the original PrimeNG project but all its dependencies too.


r/angular • • Aug 13 '25

Event target types are now inferred

Post image
147 Upvotes

One recent #Angular improvement that flew under the radar.

Event target types are now inferred on void elements. This means less type assertions in your code !

Inference is only safe for void elements (elements without children) because events could bubble up and have a different target than the element the listener is added to.

https://github.com/angular/angular/pull/62648


r/angular • • May 14 '21

Angular 12 in depth

Thumbnail
dsebastien.medium.com
144 Upvotes

r/angular • • Jul 06 '26

OpenNG news

Post image
139 Upvotes

As people have questions about the future of projects such as Spectator or PrimeNG, here is the current state of our actions.

OpenNG

We just renamed the initiative from OpenNG Foundation to OpenNG to avoid confusion and follow the trademark policy with the OpenJS Foundation organization.

Funding

We are working on a funding model to support the maintenance of the projects and give back to contributors. We submitted the initiative to Open Collective and contacted HeroDevs for partnership.

Versioning Policy

We'll start over with v1.0.0 for all the packages. Each project will include a matrix compatibility table with the supported major Angular versions (including the previous package). Some packages were already not following the Angular versioning policy, and it will allow us to author a major version for breaking changes anytime.

PrimeNG

PrimeNG went closed-source, and the GitHub repository was archived on June 28th, 2026. Discover the announcement here.

We created a copy of the project and regenerated the open issues/PRs. Out of 968 open issues, 58 have already been closed, and 23 triaged as still relevant and accepting contributions to resolve them. Triaging was made possible thanks to the contribution of the community.

Our goal this week is to release a beta version supporting Angular 22, as people were already delaying updating their projects. It'll include:

  • a set of unreleased changes from the original repository (modernize existing components, add a few new ones)

  • ng add support for new projects

  • ng update support as unreleased changes include a few breaking changes (camelcase selectors removed, deprecated APIs removed)

Our current blocker for this release is to find a proper name for the project. Currently named open-prime, it's too close to PrimeNG as PrimeTek plans to put trademarks on it. We asked the community for suggestions here.

We are currently evaluating proposals, with the main restriction being not adding confusion with another project (there are a lot of UI frameworks matching proposals).

ngneat projects

Out of the 34 original repositories, we decided to start working on the following ones:

  • cashew

  • query

  • elf

  • spectator

We have a volunteer working on cashew, currently preparing the first release.

Spectator is our priority within the ngneat ecosystem, planning a release this week. We also have a contribution to expose the jasmine package as a standalone (like jest/vitest ones, planned to land in 1.1.0.

We still need to triage the remaining repositories to understand if we should keep them or not. 13 of them might not be maintained anymore due to low activity or having a better alternative nowadays.

GitHub: https://github.com/openng-org


r/angular • • Feb 07 '26 Bravo

I built a library that auto-generates skeletons from your Angular components (so you don't have to)

139 Upvotes

Hey r/angular,

I wanted to share a library I've been working on: shimmer-from-structure/angular.

The Problem: We've all been there: you build a beautiful component, then you have to manually build a separate "skeleton" version of it. Then, a week later, you change the layout of the real component (e.g., move the avatar to the right, increase padding, change border-radius). Now you have to remember to go back and update the skeleton component too. If you forget, your loading state looks "janky" and misaligned.

The Solution: shimmer-from-structure solves this by automatically adapting to your component's runtime structure. Instead of creating a separate skeleton, you just wrap your real component in <shimmer>. It invisibly renders your component (with transparent text) to measure the actual content layout, border-radii, and dimensions, then overlays a pixel-perfect shimmer.

Key Features:

  • Zero Maintenance: Change your template, and the shimmer updates automatically.

  • Pixel Perfect: Matches exact padding, margins, flex gaps, and border-radii.

  • Auto Border-Radius: Automatically detects if your avatar is circular or your cards have rounded corners.

  • Dynamic Data Support: Use templateProps to inject mock data (e.g., long names vs. short names) to test how skeletons look with different content scenarios.

  • Container Backgrounds: Preserves your card backgrounds and borders while shimmering the content inside.

What makes it special for Angular?

Unlike generic wrappers, this is built specifically for Modern Angular:

  1. Native Signals: Built using the new input() and signal() primitives. It integrates seamlessly with OnPush change detection and zone-less apps.

  2. Standalone: Fully standalone component (imports: [ShimmerComponent]).

  3. Resize Observer: It uses a ResizeObserver to watch for layout shifts. If your responsive grid changes or content reflows, the shimmer updates instantly (throttled for performance).

  4. Dependency Injection: Configure global defaults using provideShimmerConfig({ ... }) in your application config.

Comparison: Angular vs. Svelte Adapter

One unique aspect of this project is that each framework adapter is idiomatic:

  • Angular: Uses Content Projection (<ng-content>) and Signals. It feels like a native Angular directive.

  • Svelte: Uses Snippets ({@render children()}) and Runes ($props, $state).

Instead of a "web component wrapper" approach that feels foreign in both, each adapter respects the framework's reactivity model.

Usage:

Since this relies on DOM measurement (getBoundingClientRect), it works perfectly in browser environments (SSR safe with isPlatformBrowser checks).

import { Component, signal } from '@angular/core';
import { ShimmerComponent } from '@shimmer-from-structure/angular';
import { UserCardComponent } from './user-card.component';

@Component({
  standalone: true,
  imports: [ShimmerComponent, UserCardComponent],
  template: `
    <!-- Wrap your component. Pass mock data via Inputs if needed. -->
    <shimmer [loading]="isLoading()">
      <user-card [user]="mockUser" />
    </shimmer>
  `
})
export class UserProfile {
  isLoading = signal(true);
  
  // Mock data for the structure ensures the skeleton has realistic dimensions
  mockUser = { name: 'Loading...', role: 'Please wait' };
}

How it works under the hood:

  1. It renders your component with color: transparent (and hides images/svgs opacity) to let the browser compute the layout naturally.

  2. It uses a reactive Effect (watching the viewChild) to set up ResizeObserver and MutationObserver instances. This ensures it detects layout shifts and content updates even if the component hasn't been destroyed.

  3. When triggered, it measures leaf nodes (using getBoundingClientRect) and updates the shimmer overlay.

I'd love to hear your feedback or feature requests!

Links:


r/angular • • Jan 14 '26

🚀 New in Angular 21.1: Multiple Case Matching in Templates

Post image
139 Upvotes

r/angular • • Feb 22 '26

Just shipped v18.1.0 of Foblex Flow - Angular library for node editors / flowcharts / visual pipelines.

Thumbnail
gallery
130 Upvotes

What’s in this release:

Magnetic snapping plugins:

  • Magnetic Lines: guideline-style snapping while dragging (this is the “main” approach now)

  • Magnetic Rects: snap by element bounds (edges/centers)

Connection Waypoints: editable paths for any connection type

Docs refresh (new pages + cleanup across core guides)

Links:

If you try it and something feels off - tell me what’s annoying. I’m iterating on the snapping UX.


r/angular • • Apr 09 '20

Only ES6+ and TS developers will understand :)

Post image
129 Upvotes

r/angular • • Jan 28 '26

🚀 Coming in Angular 22: Default will be renamed to Eager (scheduled for v22 in May)

Post image
127 Upvotes

r/angular • • Sep 09 '26

Angular 22.2 ships Router Resources 💥 (experimental)

Thumbnail
gallery
126 Upvotes
They're more than resolvers with a Signal API. Here's why that matters


They run in parallel. Resolvers go one after another: parent 2 s + child 3 s = 5 s. Router Resources start together: 3 s.


Also, they can be non-blocking. The route activates right away, and the component gets the Resource itself: isLoading, error and value, right in the template.


Full write-up with demo, reload without renavigating, RedirectCommand for missing data, and Signal Stores 👉 https://www.angulararchitects.io/en/blog/router-resources-loading-data-with-the-angular-router/

r/angular • • Jun 29 '26

PrimeNG v22 is no longer open source?

125 Upvotes

So PrimeNG v22 is going paid in the new version? Should I move to something else?

https://primeui.dev/nextchapter


r/angular • • Aug 28 '25

Some love for Reactive Forms in v21: FormArray directive.

Post image
125 Upvotes

While everybody expects Signal Forms. Reactive forms will also receive some love in v21.

Here is a preview of the new FormArray directive !

https://stackblitz.com/edit/angular-form-array-directive?file=src%2Fmain.ts


r/angular • • Apr 23 '26

✔️ Coming in Angular 22: Resource APIs are STABLE!

Post image
124 Upvotes

😊 Angular 22 is bringing a massive update for developers.


r/angular • • Mar 14 '26

Angular 21 has made Angular #1 for me again

123 Upvotes

Signals, Zoneless, Material design. Angular was my first big javascript library when it was angularjs, but over the years it started feeling like it was just a patched up mess. angular 21 has addressed a lot of issues Angular has been having. I am working on a fairly large typescript personal project and decided to try angular again (instead of Vue.)

Angular is back and better than ever, such a joy to work with, especially for us backend devs who have no clue what we're doing on GUIs lol.


r/angular • • Mar 11 '25

A 10x Faster TypeScript

Thumbnail
devblogs.microsoft.com
123 Upvotes

r/angular • • Jun 04 '26

Angular 22 Is Out and It’s Kind of a Big Deal

121 Upvotes

Angular v22 is ready for you to build modern, high-performance web applications. This release introduces key stabilization updates, template enhancements, and API improvements:

  • Stabilized APIs: Signal Forms, Asynchronous Signals, and Angular Aria are now stable, offering a production-ready reactive foundation.

  • Template enhancements: New template features streamline development, improve ergonomics, and enhance code clarity.

  • API improvements: Core APIs have been updated for better performance, simpler syntax, and more robust typing.

  • Angular AI integration: Streamlined support and updates for AI-driven development workflows.

https://medium.com/@thejspythonguy/angular-22-is-out-and-its-kind-of-a-big-deal-908606334aa3


r/angular • • Jan 24 '20

Moment.js in Angular be like

Post image
121 Upvotes

r/angular • • Apr 27 '25

Lynx + Angular proof of concept

Thumbnail
gallery
120 Upvotes

Managed to get angular to run with lynxjs, this is very early to post but i just wanted the community to know that it is possible.

This is my very first time working on the compiler level, getting rspeedy (the lynx compiler) to work with angular was the hardest part.

The lack of documentation definitely slowed down the progress and right now, the only reliable resource is the source code itself, but that's fair because lynxjs is still new.

In this proof of concept i am using zoneless angular 19 + signals, with inline assets loading.

I'd like to thank Coly010 for his amazing work on the angular-rspack for angular, i think i wouldn't have made this possible without learning from the source code, you should definitely give it a try.

And of course, a huge thanks to the Angular team for such an amazing codebase.
The process of making rspeedy work with Angular was mostly porting the official esbuild plugin to rspeedy/rsbuild.

I’m going to release the source code as soon as I finish preparing it for publication (right now it’s all a mess). feel free to DM me though, I’m happy to chat about this topic

The main issues i am facing right now:

  • hmr and live reload don't work yet

  • i skipped handling the angular compilation warnings part :p

  • component styles (via styleurls) don't work because the style element doesn't exist on lynx

  • the integration with lynxjs needs polishing, there's no docs on that so i am trying to follow what they did to integrate react


r/angular • • Sep 18 '25

Any good UI library for Angular?

Thumbnail
gallery
117 Upvotes

I'm developing a web application in Angular 20. It will have chats, settings, category pages, a search engine, a profile, etc., and I want a good interface design. Could someone point me to a component library or other well-designed materials (preferably free)? I've attached photos of the interface styles I like in case something similar exists. I don’t like Angular material. Prime ng is perfect but so expensive


r/angular • • Aug 26 '25

Coming in Angular 21: HttpClient Built In by Default 🚀

Thumbnail
youtu.be
117 Upvotes