Understanding the Magic Behind NgRx Store

What'new in Angular 18

Introduction Wednesday May 22, 2024, the Angular core team releases a new version of...

What's new in Angular 18

A study guide that helps you learn the new version of Angular

Frontend Nation x Angular Space Partnership

Hi there, This event is 100% FREE! If you are looking for a place to gather insights into all major frontend technologies in 2024, we have a can’t-miss event just for you and we’re sponsoring! Frontend Nation 2024, an online event brought to you by the organizers of Vue.js Nation, Nuxt Nation, and V

Episode 24/21: Angular 18

Angular 18 is out. For the first time, the main feature is an experimental one: the zoneless...

Angular viewChild,viewChildren, contentChild (Full Guide)

A super-detailed guide to the new Angular signal queries: viewChild(), viewChildren, contentChild() and contentChildren().

Structure Initialization Logic Without ngOnInit Utilize Observables and Ngonchanges

Angular v18 is now available! - Angular Blog

Today we are excited to share the next milestone in the evolution of Angular! Over the past three releases we’ve introduced a lot of new features and improvements. This time we focused on polishing…

Angular 18 – what’s new?

Master Angular 18 with signals-based inputs, model-driven state, and zoneless experiments to build high-performance, reactive apps.

Change Detection Big Picture – Unidirectional data flow

Master Angular unidirectional data flow to prevent ExpressionChangedAfterItHasBeenCheckedError and build predictable, stable apps.

Running change detection – Autorun with zones

Master Angular change detection with NgZone. Manage async tasks efficiently and ensure UI updates even when code runs outside the zone.

Optimization techniques – Reusing views

Avoid expensive re-renders in Angular by caching your components and views using ViewContainerRef to boost performance and UI speed.

Running change detection – Components tree

Understand Angular’s internal view hierarchy and LView structure to master change detection performance and handle dynamic components.

Expression changed error – Debugging algorithm

Debug „ExpressionChangedAfterItHasBeenChecked” errors efficiently using breakpoints and Proxies to stabilize your state management.

Change Detection Big Picture – Rendering cycle

Master the Angular rendering cycle by understanding how Zone.js, change detection, and browser pipelines sync to update your UI.

Expression changed error – Causes and workarounds

Stop Angular’s ExpressionChangedAfterItHasBeenCheckedError by mastering change detection, DOM updates, and async task strategies.

Optimization techniques – OnPush strategy

Optimize Angular performance with OnPush change detection. Reduce unnecessary component checks and simplify state management today.

Debugging techniques – Chrome DevTools

Debug mysterious Angular change detection cycles using Chrome DevTools. Master callstacks and logpoints to pinpoint the exact cause.

Debugging techniques – Profiling

Identify and eliminate performance bottlenecks in Angular apps using the built-in Profiler and custom timing APIs for faster UI.

Running change detection – Preventing autorun

Optimize Angular performance by using NgZone.runOutsideAngular to bypass redundant change detection for heavy, DOM-intensive tasks.

Change Detection Big Picture – Operations

Master Angular change detection by exploring the internal refreshView function and the precise sequence of operations behind your UI.

Running change detection – Detached views

Optimize Angular performance by mastering detach and reattach methods. Control component updates manually for faster, efficient UI.

Debugging techniques – Global utils

Struggling to debug complex Angular apps? Use the global ng namespace to inspect components, directives, and state right from the console.

Debugging techniques – Debug element

Master Angular unit testing with DebugElement. Learn to query DOM nodes, inspect components, and verify state for more reliable tests.