Update webpack bundle configuration

[kristw]

• Add flags to enable speed measurement and bundle analyzer

npm run build -- --measure=true --analyzeBundle=true

• Update dependency versions (css-loader, webpack-cli)

• Remove json-loader which is not necessary for webpack 4

• Switch from default UglifyjsPlugin to TerserPlugin as minimizer. The TerserPlugin use an updated fork of uglifyjs-es under the hood while UglifyjsPlugin use uglifyjs version 3 which does not support es module. This let us enable parallel and cache options for some speed up in the build.

• After analyzing the bundles, define a special chunk called vendors-major for brace, core-js and react-dom which takes large portion of the three main entry points (dashboard, explore and sqllab). This will enable better caching and reduce size of the entry points. Somehow these modules were not automatically split into the common chunks as expected from default behavior.

• Total bundle size (in assets/dist directory) goes down from 14.9MB to 12.9MB

Before

After

@williaster @xtinec @conglei

[codecov-io]

Codecov Report

Merging #5983 into master will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##           master    #5983   +/-   ##
=======================================
  Coverage   63.56%   63.56%           
=======================================
  Files         393      393           
  Lines       23667    23667           
  Branches     2638     2638           
=======================================
  Hits        15044    15044           
  Misses       8610     8610           
  Partials       13       13

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 52033cb...ee3fb2c. Read the comment docs.

[mistercrunch]

This is great.
LGTM

[williaster]

amazing! LGTM