Investigate Webpack bundle size discrepancy

[jryans]

On my local machine, running yarn build in riot-web produces a 4.6 MB bundle.js file. However, the official build for develop comes up with a 14 MB bundle.js file.

Why are they so different?

[jryans]

A table of curious sizes:

Type	bundle.js uncompressed size
Develop @ 3fad360f5fa2	14 MB
Staging	4.0 MB
Local yarn build	4.6 MB

[jryans]

@ara4n pointed out that Develop doesn't minify builds, so I guess that explains the largest difference here. I'll keep this open to do a bit more digging on bundle size.

[jondavidjohn]

I built a tool to help you analyze webpack bundles for size regressions, and report them directly to GitHub PRs. It's free for open source, so it might be worth checking out and helpful in this scenario.

https://packtracker.io

[jryans]

The bundles continue to grow:

Type	vendors~init.js uncompressed size
Develop	18.83 MB
App	5.33 MB
Local yarn build	3.2 MB

Local yarn build continues to differ from app in some perplexing way. 🤔

[jryans]

There's also #2498 as a historical similar issue, but that one sort of proscribes a particular change to make as well. Over here, I'd just like to know more about why things are so large, and review a variety of possible changes we might make.

[novocaine]

I think this is because of differences in how we embed the original source when generating sourcemaps. This might be clearer after I cleaned up how this is decided in reaction to develop's bundle being so large that sentry wouldn't take the upload.

[novocaine]

Now:

Type	vendors~init.js uncompressed size	webpack devtool
Develop	6.8 MB	source-map
App	5.7 MB	nosources-source-map
Local yarn build	3.3 MB	nosources-source-map

Okay, I don't know why the local build is smaller than the size of prod .. it should be the same.