Angular 8 vs Angular 9 Performance Results
Angular 9 is the latest stable release from Angular and to be very precise currently, 9.1.11 is the recent version and as you are already aware it was widely discussed in recent web development due to one of the major enhancement brought it in using IVY as a default rendering engine, so you might be wondering, what are the areas it made improvements? So in this article, we will go through performance tests compared to the previous version of angular with the latest angular stable version
To test the performance of Angular 9 against its previous version of Angular i.e. Angular 8, we have performed the results with very small hello world applications and also one set includes the real-world Angular application with the help of https://github.com/gothinkster/angular-realworld-example-app
- 1st Result - Hello World Application –https://universal-tutorial-angular-9.herokuapp.com/ VS https://universal-tutorial-angular-8.herokuapp.com/
- 2nd Result - Real World Application –https://angular-realworld-9.herokuapp.com/ VS https://angular-realworld-8.herokuapp.com/
Result 1 - Performance Comparision for Hello World or Small Application
The web application consists of very small information about the dist folder sizes and the images of the Google Lighthouse Results and the package.json file which includes all the libraries for the web applications.
Angular 8 (8.2.7)
Mobile
Desktop
Angular 9 (9.0.0-rc.13)
Mobile
Desktop
Build Size: Both applications have almost the same content and same information and Angular 9 performed well in compressing the build files, so it ended up producing the dist folder with all the file sizes includes around 424,369 bytes whereas Angular 8 produced larger build files and overall file sizes are around 662,798 bytes, which means Angular 9 produced 35% less build file sizes compared to Angular 8
Google Light House Performance Results: We conducted multiple tests and an average score of Angular 8 comes around 84 whereas Angular 9 scored 93 out of 100 for the mobile version. Now coming to the Desktop version the average score remains almost the same but still, Angular 9 performed well and scored 99 against 95 with Angular 8
Result 2 - Performance Comparision for Real World Angular Application
The web application consists of a very small Login and Signup and some small section to load the feeds and comments using pagination
Angular 8 (8.2.7)
https://www.universal-tutorial.com/media/angular-tutorials/angular_9_performance_results/Angular_8_RealWorld.mp4
Angular 9 (9.0.0-rc.13)
https://www.universal-tutorial.com/media/angular-tutorials/angular_9_performance_results/Angular_9_RealWorld.mp4
Build Size: Both applications have almost the same content and same information and Angular 9 performed well in compressing the build files, so it ended up producing the dist folder with all the file sizes includes around 767,862 bytes whereas Angular 8 produced larger build files and overall file sizes are around 824,135 bytes, which means Angular 9 produced 7% fewer build file sizes compared to Angular 8
Google Light House Performance Results: We conducted multiple tests and an average score of Angular 8 comes around 69 whereas Angular 9 scored 74 out of 100 for the mobile version. Now coming to the Desktop version the average score remains almost the same but still, Angular 9 performed well and scored 93 against 92 with Angular 8
You can compare the results of your web application using https://developers.google.com/speed/pagespeed/insights/
So let's all hope that we get the final version of Angular 9 soon and start deploying our applications live with improved performance and speed compared to what we are having right now !!