Reducing the size of main.js

I am trying to reduce the size of the main.js file that is generated using ionic build --prod.

For my project, I am using the template property for my pages and components rather than using templateUrl and placing the html in an external html file. I find this helps with code maintenance because the class and rendering are in the same file. One thing I noticed is that the AOT compiler keeps a copy of the original template strings as well as includes the template generation code that is based on these template strings. This means that there are basically 2 copies of all templates in the final build output. When I moved the html to separate files and used templateUrl to reference the files the size of build.js was reduced by the total size of all html.

This is also the case with ionic components that are defined using the template property. The extra copy of the html is included in the final build output.

The main.js file is still huge though.

Anyone have other tips related to tree shaking or other optimizations to help reduce the size of the file?

1 Like

where you able to get any thing