Angular Performance and Optimization Checklis

Image for post

Angular is one of the powerful and high performing front-end framework. Applications will start becoming slow as it grows if you are not aware of how to optimize the application, it will start affecting end-user experience.

To know in advance and fix the performance, it is better to know the optimization techniques. There are many ways we can optimize your Angular application, Here I would like to discuss some of the techniques which were really helpful in my development.

Angular Optimization Techniques:

We Should Not Call methods From Angular Templates

To know more about these techniques, Please check this article.

Let’s move to our main discussion.

When “leak” words come to mind it means something is happening messy. Sometimes it becomes really hard to find where the issue is and hard to resolve it. In software development, it is one of the basic things to write a clean code that can make you different than others. Sometimes when we develop the larger applications as time goes it grows with code and it becomes slow. It is really essential to know from the beginning to keep our application more cleaner to reduce the bundle sizes and avoid any leaks.

As discussed Memory leak happens in each and every application, Let’s discuss how impact the Angular Application. In this article, we will create a memory leak in the Angular Application and will resolve and discuss different methods to resolve it.

When an application becomes slower we mostly refresh or reload the page so it releases memory and the application becomes normal but we don’t know what is actually happening in the background until we dig more about it.

There are some reasons which sometimes produce memory leaks in Angular.

  1. working on the same application for a long time.
  2. Using ngIf to render the application multiple times which depends on the observables.
  3. calling multiple observables in the applications and not unsubscribing it after use.
  4. subscribing to the listeners such as form controls and not unsubscribing it after the component gets destroyed.
  5. when we use shareReplay but not add the unsubscribe logic to handle it.

Let’s create some of the scenarios to discuss the memory leak.

#javascript #typescript #angular

Understanding Memory Leaks in Angular
1.40 GEEK