Episode 23/05: RxAngular Template & CDK
Tags: angular, webdev, javascript, programming
Published: 2023-02-06 10:48:57

RxAngular is a popular tool belt for boosting Angular's performance. It was released in version 1 and became, therefore, stable.

Next to that, Max Koretsky covered the ExpressionChangedAfterItHasBeenCheckedError in detail. Brandon Roberts showed how to write compact feature states in NgRx. Joshua Morony discussed the results of a current survey from DevJobsScanner.

{% embed https://youtu.be/oe5J6iAnULs %}

## RxAngular

Angular has an automatic change detection that relies on zone.js. It is quite fast but has one problem: It runs too often.

Rx-Angular is a set of libraries that can significantly improve the performance with or without zone.js.

After years of development and testing, rx-angular/template and rx-angular/cdk became stable and are available in version 1. Initiated by Michal Hladky, it started out as an insider tip, it quickly grew in terms of popularity.

{% embed https://twitter.com/hoebbelsB/status/1620107272314847232 %}

rx-angular/template consists mainly of alternative directives to the native ones. For example, instead of ngIf, there is an rxIf. There are further counterparts for the async pipe and the ngFor directive.

You can also use the underlying library rx-angular/cdk. As the name says, it provides tools to build your own high-performant directives, components, etc.

{% embed https://www.rx-angular.io/ %}

In my opinion, rx-angular is a powerful booster that allows you to tweak and tune Angular in multiple ways. And as the saying goes "with great power comes great responsibility": Make sure you study the documentation carefully and fully understand the implications of the various options.

Btw. there is also rx-angular/state which is a state management library. But that one is already on version 1.7 and stable for quite some time.

## Advanced Angular Content

### NgRx
Brandon Roberts published an insightful video about NgRx. He used the latest additions to squeeze a complete feature state into a single file only.

{% embed https://youtu.be/KjpzdzH7-Lg %}

### Job Market

If you have doubts that Angular's future is secure, you should watch Joshua Moronoy's latest YouTube video. He discusses a survey that actually asked companies for which frameworks they were hiring. React ended up with 54%, Angular with 32%, and Vue with 10%.

{% embed https://youtu.be/WC3hiMiH5kI %}

### ExpressionChangedAfterItHasBeenCheckedError

Max Koretskyi explained the famous ExpressionChanged exception. Why it actually occurs and what we can do about it.

{% embed https://indepth.dev/posts/1514/deep-dive-into-the-infamous-expressionchangedafterithasbeencheckederror-in-angular %}

## Minor Releases

### Cypress 12.5

Other than that, we had a new minor release for Cypress. Version 12.5 brings debugging functionalities when you run the tests in the Cypress Cloud, which is Cypress' commercial product.

{% embed https://www.cypress.io/blog/2023/01/31/introducing-in-app-test-results/ %}

### PrimeNg 15.2

PrimeNg went up to 15.2. Its main new features are additional themes.

[ChangeLog](https://github.com/primefaces/primeng/blob/master/CHANGELOG.md#1520-2023-01-30)