Angular performance results in depth
Angular 11 was released on Nov 24th, 2020, and finally Angular has released a version that performed well compared to all its ancestor versions. In this article, we are demonstrating the performance of Angular 11 against previous versions.
But coming to Angular 10 was released on 24th June 2020, and since this is a very small release as it was released just 4 months after Angular 9, but it was failed to beat the Angular 9 in terms of Performance web.dev
For performance analysis, the latest Angular versions are considered i.e. Angular 8.2.3, Angular 9.1.1 and Angular 10.0.2, and Angular 11.0.5
For comparison, we have referred to the real world angular application and credits to Real-world Angular Repo
We have hosted the applications in Heroku, so you can follow these repos, in case you want to test something on your end.
- Angular 8.2.3 https://angular-realworld-8.herokuapp.com/
- Angular 9.1.11 https://angular-realworld-9.herokuapp.com/
- Angular 10.1.0 https://angular-realworld-10.herokuapp.com/
- Angular 11.0.5 https://angular-realworld-11.herokuapp.com/
Respective Git repos can be found as below
- Angular 8.2.3 https://github.com/allabouttech0803/angular-realworld-8
- Angular 9.1.11 https://github.com/allabouttech0803/angular-realworld-9
- Angular 10.1.0 https://github.com/allabouttech0803/angular-realworld-10
- Angular 11.0.5 https://github.com/allabouttech0803/angular-realworld-11
Bundle Size (Lower the value better)
After comparing the size of the dist files, Angular 9 beats other versions with large margin and all credit goes to IVY. Tough Angular 10 and Angular 11 versions are developed on top of IVY, we see that for the same repo the dist files increased drastically by 20% approximately.
Build Time (Lower the value better)
To generate the production build files Angular 8 took 16179ms and Angular 9 took 16481ms while Angular 10 took slightly more i.e. 25584ms, and Angular 11 took just 16631ms, all the repos the projects are built with the server having 32GB RAM and processor clocked at 2.2GHz and Angular 9 and Angular 11 are winners, we have used the command ng build --aot --prod
web.dev performance score (Higher the value better)
We have used Google's web.dev to measure the application performance and here Angular 8 application scored 50 and the 9 scored the highest 52 and Angular 10 scored 50 which is less than Angular 9 but Angular 11 beats all of them with a score of 53
Conclusion :
So we can conclude that Angular 9 and Angular 11 are still better compared to Angular 10 in the point of performance, but in Angular 11 there are some major bug fixes in the IVY rendering engine and new date range picker included and Typescript is updated with 4.0.5 in Angular 11 and improved reporting and logging, and so in case you are benefitting from any of these features you can think of upgrading to Angular 11