Reduce bundle.js size #1268

[IhsenBouallegue]

Reduce bundle.js size

Close: #1268

Description

Descriptive pull request text, answering:

• Add webpack plugins to reduce the size of JS files

Size of bundle.js and bundle.js.map:
Before minimizing js:

After minimizing js:

Size of bundle.js:
Before minimizing js:

After minimizing js:

[IhsenBouallegue]

Minifying the bundle breaks the app.
It seems that it has to do with AngularJS:
https://stackoverflow.com/questions/62677457/webpack-minimize-option-breaks-application-if-set-to-true
We need to look further into that.

[BridgeAR]

@IhsenBouallegue good catch! We could deactivate renaming the variables as a first step and later on implement the suggestion from stackoverflow.

[IhsenBouallegue]

@IhsenBouallegue good catch! We could deactivate renaming the variables as a first step and later on implement the suggestion from stackoverflow.

I agree!
And for the sake of documentation, here is a summery:

• I tried solving it with ng-annotate-webpack-plugin (which is deprecated) and it didn't work.
• I tried solving it with babel-plugin-angularjs-annotate (which we already have installed) and it didn't work.
• Finally, I resorted to disablign keep_classnames and keep_fnames. Which worked and surprisingly had an acceptable impact on the size (about 2.9 MB increase)
  So the numbers look pretty much the same and now it should work.
• It is also worth mentioning that I tried minifying the HTML and CSS, but that resulted in undefined variables and many errors. So I left it out.

From what I tested on version 1.90.0, we have a 60% decrease in size of bundle.js and about 20% decrease in overall build size. Which is well worth it 💯

[sonarcloud]

[CodeCharta Analysis] Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
No Duplication information

[sonarcloud]

[CodeCharta Visualization] Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
No Duplication information

[ce-bo]

Very nice improvement! 🚀
On my machine, the median loading time of bundle.js is roughly at 185ms (before the median was 400ms).
The transmitted bytes (over network) for bundle.js is now 1.3MB (before it was 2.9MB) which is an improvement of 123%!