Consider using source-map-explorer instead of webpack-bundle-analyzer

Webpack bundle analyzer is a great tool to determine the contents of our frontend bundles at a glance, but it is not perfectly accurate.

https://mobile.twitter.com/dan_abramov/status/866424533787586560

It calculates a rough estimate of the bundle component sizes by independently collecting and gzipping the code. This is still probably good enough when we just want to know relative module sizes, but if we want to know exactly how much space a module occupies in the compiled bundle, this will not provide it.

We currently generate these bundle analyses on every pipeline and they are published to the following urls:

http://gitlab-org.gitlab.io/gitlab-ce/webpack-report/
http://gitlab-org.gitlab.io/gitlab-ee/webpack-report/

The method suggested in some discussions between the JS community on twitter points out source-map-explorer as a more accurate alternative. This method uses the source maps generated by the production assets to determine the starting and ending byte for each module within a bundle and is thus representative of the actual contents of the bundle.

Here's an example output linked within the project's README.md:

https://cdn.rawgit.com/danvk/source-map-explorer/08b0e130cb9345f9061760bf8a8d9136ea60b457/demo.html

It's not as pretty looking, and it annoyingly would generate a separate status page for every individual bundle, but it would perhaps provide better insight for us as we look to reduce our bundle sizes.