When you ship your Angular application to production, you want it to perform at its very best. Performant applications lead to a high-quality user experience.

In this article, I will show you how you can measure the performance of your Angular application. Knowing the bottlenecks that slow down your application will help you to make informed decisions on how you can best optimize your application.

Bundle Inspection

The npm package source-map-explorer is great at inspecting the JavaScript bundles that are generated by the Angular production build output.

To install source-map-explorer, simply run the following command from the root of your project’s workspace directory:

npm i source-map-explorer --save-dev

After installing source-map-explorer, build your application for production and remember to use the --source-map flag. This tells Angular to include source maps as part of the build:

ng build --prod --source-map

#software-development #front-end-development #programming #javascript #angular