What's new in angular 13.
See this and many other articles at lucaspaganini.com
Angular 13 was recently released, let me tell you what I consider to be the most relevant changes.
Build Cache
You can now cache your builds, so if a module hasn't changed, Angular doesn't have to rebuild it. That alone will improve your build speed by around 68%.
{
"cli": {
"cache": {
"enabled": true,
"path": ".angular/cache",
"environment": "all"
}
}
}
TestBed Destroy After Each
Tests are now faster because Angular does a better job of tearing down after each test. That introduced some race conditions in my codebase, so I had to turn that off. I'd say it needs a few weeks to become stable.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting(),
{ teardown: { destroyAfterEach: false } }
);
Dropped Support for Internet Explorer 11
Finally, we're dropping support for Internet Explorer 11, which allows Angular to leverage modern browser features, such as CSS variables.
Dependency Updates
TypeScript 4.4 and RxJS 7.4 are now supported! I made a video on RxJS 7, the link is in the description.
Dynamically create components
If you create components dynamically, good news, you don't need the component factory anymore, just use ViewContainerRef.createComponent
const componentFactory =
componentFactoryResolver.resolveComponentFactory(Component);
const componentRef = componentFactory.create(injector);
viewContainer.insert(componentRef.hostView);
const componentRef = viewContainer.createComponent(Component);
Conclusion
References are below. Subscribe if you're into web development, and have a great day.
Top comments (0)