Angular 20: A Personal Reflection on the Changes

Angular 20 is here, and it’s a big one.

The framework continues modernizing, refining, and adapting to today’s frontend landscape. From a cleaner control flow syntax to better hydration and more flexible dependency injection, Angular 20 reflects a team pushing the framework forward. But amid the improvements, some decisions feel more cosmetic than considered, and not all changes work in favor of clarity or real-world developer experience.

Let’s dive into the highlights, the questionable choices, and where Angular might go next.

The Suffix Removal

One of the most controversial changes in Angular 20 is the removal of default suffixes like .component.ts, .directive.ts, and .pipe.ts in filenames and selectors.

On paper, it’s a move toward simplicity: shorter names, fewer characters, cleaner visuals. But in practice, this decision feels like a step backward.

These suffixes are not just naming conventions — they are semantic markers. They communicate intent, aid in discoverability, and help teams navigate large codebases. Stripping them away makes it harder to understand the role of a file at a glance, and it complicates file searches, refactoring, and onboarding.

Minimalist naming may appeal in small demos or side projects, but in enterprise-scale applications, where Angular truly shines, clarity always wins. This change prioritizes aesthetics over long-term maintainability.

New Control Flow Syntax

On a brighter note, Angular 20 stabilizes its new control flow syntax: @if, @for, and @switch. This is a substantial improvement over the old microsyntaxes (*ngIf, ngFor*, etc.), which often felt cryptic and unintuitive.

The new syntax is clean, block-scoped, and easier to reason about:

@if (user) {
  <p>Welcome, {{ user.name }}</p>
}

It’s more expressive, more readable, and reduces mental overhead. This change aligns Angular’s templates with the kinds of control flow seen in JSX, Svelte, and other modern UI paradigms. It’s a clear win for readability and maintainability.

Dependency Injection

Angular 20 also brings improvements to its already-strong dependency injection system. Multi-providers can now be used more freely with standalone components, and dependency injection is supported in more contexts, including functional guards and resolvers.

This gives developers greater composability and reduces the need for verbose boilerplate in places where DI previously wasn’t available. It helps Angular feel more flexible and modern — and it’s a smart, incremental evolution of a core strength of the framework.

Testing

Testing in Angular 20 is now a bit more ergonomic, with improvements in environment setup and test APIs. The team has been listening clearly to feedback about the testing experience, feeling clunky or overly rigid.

However, Angular still hasn’t fully embraced the tooling revolution happening elsewhere in the JavaScript ecosystem. There’s no native support for tools like Vite, Vitest, or zero-config ESM test runners. While the improvements are appreciated, Angular’s testing experience is still conservative compared to newer frameworks.

SSR and Hydration

Server-side rendering and hydration have been long-time pain points in Angular. With version 20, hydration gets a serious boost: better error handling, improved debugging tools, and more predictable behavior across server and client.

Angular is becoming more production-ready for SSR-heavy use cases — a necessary evolution for performance-sensitive or SEO-focused apps. Still, frameworks like Next.js and Nuxt offer a more seamless SSR developer experience. Angular is catching up, but it’s not quite there yet.

Project Structure & CLI

Angular 20 continues to refine the CLI and encourages more streamlined, Nx-style project structures. This is great for small to medium projects and aligns well with standalone APIs.

But the framework risks assuming too much about how developers should structure their applications. Mature teams working in monorepos or with advanced domain-driven designs may still need to override or ignore many of the CLI’s decisions. Simplified doesn’t always mean suitable for everyone.

Conclusion

Angular 20 is a thoughtful release in many ways. It moves the framework forward in areas that matter: control flow, dependency injection, hydration, and it shows a clear intent to modernize.

But some decisions feel out of touch with the needs of large-scale Angular developers. The removal of suffixes, in particular, reflects a design philosophy that prioritizes aesthetic minimalism over practical clarity.

Angular remains a powerful, enterprise-ready framework. But as it evolves, it must remember what made it successful in the first place: explicit, structured, and scalable architecture — not clever shortcuts or superficial neatness.

That’s all for today, happy coding, everyone! 😊