From b1d02cf0346f8f571d08e0502f576c7724f2f89a Mon Sep 17 00:00:00 2001 From: Sven Lechner Date: Tue, 17 Apr 2018 19:51:00 +0200 Subject: [PATCH] build(babel): improve app.bundle.js size --- .babelrc | 13 ++++- package.json | 8 ++- webpack/prod.config.js | 23 +++++++- yarn.lock | 120 +++++++++++++++++++++++++++++++++++++++-- 4 files changed, 156 insertions(+), 8 deletions(-) diff --git a/.babelrc b/.babelrc index c077bee0..e8b11f16 100644 --- a/.babelrc +++ b/.babelrc @@ -1,9 +1,18 @@ { "presets": [ - "env", + ["env", { + "targets": { + "node": 7 + }, + "useBuiltIns": true + }], "react" ], "plugins": [ + "lodash", "transform-object-rest-spread" - ] + ], + "env": { + "production": ["react-optimize"] + } } diff --git a/package.json b/package.json index ca53d775..d190fd53 100644 --- a/package.json +++ b/package.json @@ -7,7 +7,7 @@ "lint": "eslint --ext .jsx,.js app/src/js", "contributors:add": "all-contributors add", "contributors:generate": "all-contributors generate", - "build": "cross-env NODE_ENV=production webpack --mode production --progress --color --config ./webpack/prod.config.js", + "build": "cross-env NODE_ENV=production webpack --mode production --color --config ./webpack/prod.config.js", "pack": "electron-builder --dir", "dist": "electron-builder", "lint-fix": "eslint --ext .jsx,.js app/src/js --fix", @@ -19,6 +19,7 @@ "start-build": "electron build/app/app.js", "test": "jest --coverage", "precommit": "lint-staged", + "analyze": "npm run profile && webpack-bundle-analyzer stats.json build/app", "profile": "webpack --config webpack/prod.config.js --profile --json > stats.json" }, "license": "Apache-2.0", @@ -87,9 +88,11 @@ "babel-eslint": "^8.2.1", "babel-jest": "^22.4.3", "babel-loader": "^7.1.2", + "babel-plugin-lodash": "^3.3.2", "babel-plugin-transform-object-rest-spread": "^6.26.0", "babel-preset-env": "^1.6.1", "babel-preset-react": "^6.24.1", + "babel-preset-react-optimize": "^1.0.1", "commitizen": "^2.9.6", "compression-webpack-plugin": "^1.1.3", "concurrently": "^3.5.1", @@ -122,8 +125,11 @@ "rimraf": "^2.6.2", "sass-lint": "^1.12.1", "sass-loader": "^6.0.6", + "speed-measure-webpack-plugin": "^1.2.2", "style-loader": "^0.19.1", + "uglifyjs-webpack-plugin": "^1.2.4", "webpack": "^4.5.0", + "webpack-bundle-analyzer": "^2.11.1", "webpack-cli": "^2.0.14", "webpack-dashboard": "^1.1.1", "webpack-dev-server": "^3.1.3", diff --git a/webpack/prod.config.js b/webpack/prod.config.js index ffd2b661..5356e3e6 100644 --- a/webpack/prod.config.js +++ b/webpack/prod.config.js @@ -3,6 +3,10 @@ const CopyWebpackPlugin = require('copy-webpack-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const DashboardPlugin = require('webpack-dashboard/plugin'); +const SpeedMeasurePlugin = require("speed-measure-webpack-plugin"); +const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); + +// const smp = new SpeedMeasurePlugin(); module.exports = { context: path.join(__dirname, '../app'), @@ -10,7 +14,7 @@ module.exports = { * There is a known problem with devtools in webpack right now. * Will add it back once that is fixed. */ - // devtool: 'source-map', + // devtool: 'cheap-eval-source-map', entry: { app: [ './src/res/sass/main.sass', @@ -44,7 +48,7 @@ module.exports = { }, target: 'electron-renderer', plugins: [ - new DashboardPlugin(), + // new DashboardPlugin(), new MiniCssExtractPlugin({ filename: 'css/main.css', allChunks: true, @@ -71,4 +75,19 @@ module.exports = { ], }), ], + + optimization: { + minimize: true, + minimizer: [ + new UglifyJsPlugin({ + uglifyOptions: { + beautify: false, + comments: false, + compress: true, + mangle: true, + toplevel: false, + }, + }), + ], + }, }; diff --git a/yarn.lock b/yarn.lock index 07f74462..95431ab2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -686,6 +686,17 @@ babel-helper-hoist-variables@^6.24.1: babel-runtime "^6.22.0" babel-types "^6.24.1" +babel-helper-is-react-class@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/babel-helper-is-react-class/-/babel-helper-is-react-class-1.0.0.tgz#ef6f3678b05c76dbdeedadead7af98c2724d8431" + +babel-helper-module-imports@^7.0.0-beta.3: + version "7.0.0-beta.3" + resolved "https://registry.yarnpkg.com/babel-helper-module-imports/-/babel-helper-module-imports-7.0.0-beta.3.tgz#e15764e3af9c8e11810c09f78f498a2bdc71585a" + dependencies: + babel-types "7.0.0-beta.3" + lodash "^4.2.0" + babel-helper-optimise-call-expression@^6.24.1: version "6.24.1" resolved "https://registry.yarnpkg.com/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz#f7a13427ba9f73f8f4fa993c54a97882d1244257" @@ -769,6 +780,16 @@ babel-plugin-jest-hoist@^22.4.3: version "22.4.3" resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-22.4.3.tgz#7d8bcccadc2667f96a0dcc6afe1891875ee6c14a" +babel-plugin-lodash@^3.3.2: + version "3.3.2" + resolved "https://registry.yarnpkg.com/babel-plugin-lodash/-/babel-plugin-lodash-3.3.2.tgz#da3a5b49ba27447f54463f6c4fa81396ccdd463f" + dependencies: + babel-helper-module-imports "^7.0.0-beta.3" + babel-types "^6.26.0" + glob "^7.1.1" + lodash "^4.17.4" + require-package-name "^2.0.1" + babel-plugin-syntax-async-functions@^6.8.0: version "6.13.0" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95" @@ -1057,12 +1078,24 @@ babel-plugin-transform-object-rest-spread@^6.22.0, babel-plugin-transform-object babel-plugin-syntax-object-rest-spread "^6.8.0" babel-runtime "^6.26.0" +babel-plugin-transform-react-constant-elements@^6.5.0: + version "6.23.0" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-constant-elements/-/babel-plugin-transform-react-constant-elements-6.23.0.tgz#2f119bf4d2cdd45eb9baaae574053c604f6147dd" + dependencies: + babel-runtime "^6.22.0" + babel-plugin-transform-react-display-name@^6.23.0: version "6.25.0" resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-display-name/-/babel-plugin-transform-react-display-name-6.25.0.tgz#67e2bf1f1e9c93ab08db96792e05392bf2cc28d1" dependencies: babel-runtime "^6.22.0" +babel-plugin-transform-react-inline-elements@^6.6.5: + version "6.22.0" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-inline-elements/-/babel-plugin-transform-react-inline-elements-6.22.0.tgz#6687211a32b49a52f22c573a2b5504a25ef17c53" + dependencies: + babel-runtime "^6.22.0" + babel-plugin-transform-react-jsx-self@^6.22.0: version "6.22.0" resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-jsx-self/-/babel-plugin-transform-react-jsx-self-6.22.0.tgz#df6d80a9da2612a121e6ddd7558bcbecf06e636e" @@ -1085,6 +1118,16 @@ babel-plugin-transform-react-jsx@^6.24.1: babel-plugin-syntax-jsx "^6.8.0" babel-runtime "^6.22.0" +babel-plugin-transform-react-pure-class-to-function@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-pure-class-to-function/-/babel-plugin-transform-react-pure-class-to-function-1.0.1.tgz#32a649c97d653250b419cfd1489331b0290d9ee4" + dependencies: + babel-helper-is-react-class "^1.0.0" + +babel-plugin-transform-react-remove-prop-types@^0.2.5: + version "0.2.12" + resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.2.12.tgz#3406696df0b8b456089f9d726d27e7e123d2f929" + babel-plugin-transform-regenerator@^6.22.0, babel-plugin-transform-regenerator@^6.24.1: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz#e0703696fbde27f0a3efcacf8b4dca2f7b3a8f2f" @@ -1175,6 +1218,15 @@ babel-preset-jest@^22.4.3: babel-plugin-jest-hoist "^22.4.3" babel-plugin-syntax-object-rest-spread "^6.13.0" +babel-preset-react-optimize@^1.0.1: + version "1.0.1" + resolved "https://registry.yarnpkg.com/babel-preset-react-optimize/-/babel-preset-react-optimize-1.0.1.tgz#c23509fba7cbc76d7de7050e7d26bcd22bc304e8" + dependencies: + babel-plugin-transform-react-constant-elements "^6.5.0" + babel-plugin-transform-react-inline-elements "^6.6.5" + babel-plugin-transform-react-pure-class-to-function "^1.0.1" + babel-plugin-transform-react-remove-prop-types "^0.2.5" + babel-preset-react@^6.24.1: version "6.24.1" resolved "https://registry.yarnpkg.com/babel-preset-react/-/babel-preset-react-6.24.1.tgz#ba69dfaea45fc3ec639b6a4ecea6e17702c91380" @@ -1256,6 +1308,14 @@ babel-traverse@^6.18.0, babel-traverse@^6.23.1, babel-traverse@^6.24.1, babel-tr invariant "^2.2.2" lodash "^4.17.4" +babel-types@7.0.0-beta.3: + version "7.0.0-beta.3" + resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-7.0.0-beta.3.tgz#cd927ca70e0ae8ab05f4aab83778cfb3e6eb20b4" + dependencies: + esutils "^2.0.2" + lodash "^4.2.0" + to-fast-properties "^2.0.0" + babel-types@^6.18.0, babel-types@^6.19.0, babel-types@^6.23.0, babel-types@^6.24.1, babel-types@^6.26.0, babel-types@^6.7.2: version "6.26.0" resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497" @@ -1337,6 +1397,14 @@ better-sqlite3@^4.0.2: integer "^1.0.3" lzz-gyp "^0.4.2" +bfj-node4@^5.2.0: + version "5.3.1" + resolved "https://registry.yarnpkg.com/bfj-node4/-/bfj-node4-5.3.1.tgz#e23d8b27057f1d0214fc561142ad9db998f26830" + dependencies: + bluebird "^3.5.1" + check-types "^7.3.0" + tryer "^1.0.0" + big.js@^3.1.3: version "3.2.0" resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e" @@ -1825,6 +1893,10 @@ chardet@^0.4.0: version "0.4.2" resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.4.2.tgz#b5473b33dc97c424e5d98dc87d55d4d8a29c8bf2" +check-types@^7.3.0: + version "7.3.0" + resolved "https://registry.yarnpkg.com/check-types/-/check-types-7.3.0.tgz#468f571a4435c24248f5fd0cb0e8d87c3c341e7d" + chokidar@^2.0.0, chokidar@^2.0.2: version "2.0.3" resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.0.3.tgz#dcbd4f6cbb2a55b4799ba8a840ac527e5f4b1176" @@ -2070,7 +2142,7 @@ combined-stream@1.0.6, combined-stream@^1.0.5, combined-stream@~1.0.5: dependencies: delayed-stream "~1.0.0" -commander@2.15.x, commander@^2.11.0, commander@^2.14.1, commander@^2.8.1, commander@^2.9.0, commander@~2.15.0: +commander@2.15.x, commander@^2.11.0, commander@^2.13.0, commander@^2.14.1, commander@^2.8.1, commander@^2.9.0, commander@~2.15.0: version "2.15.1" resolved "https://registry.yarnpkg.com/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f" @@ -2910,7 +2982,7 @@ duplexer3@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/duplexer3/-/duplexer3-0.1.4.tgz#ee01dd1cac0ed3cbc7fdbea37dc0a8f1ce002ce2" -duplexer@~0.1.1: +duplexer@^0.1.1, duplexer@~0.1.1: version "0.1.1" resolved "https://registry.yarnpkg.com/duplexer/-/duplexer-0.1.1.tgz#ace6ff808c1ce66b57d1ebf97977acb02334cfc1" @@ -3855,7 +3927,7 @@ fileset@^2.0.2: glob "^7.0.3" minimatch "^3.0.3" -filesize@^3.3.0: +filesize@^3.3.0, filesize@^3.5.11: version "3.6.1" resolved "https://registry.yarnpkg.com/filesize/-/filesize-3.6.1.tgz#090bb3ee01b6f801a8a8be99d31710b3422bb317" @@ -4445,6 +4517,13 @@ growly@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081" +gzip-size@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-4.1.0.tgz#8ae096257eabe7d69c45be2b67c448124ffb517c" + dependencies: + duplexer "^0.1.1" + pify "^3.0.0" + handle-thing@^1.2.5: version "1.2.5" resolved "https://registry.yarnpkg.com/handle-thing/-/handle-thing-1.2.5.tgz#fd7aad726bf1a5fd16dfc29b2f7a6601d27139c4" @@ -6998,6 +7077,10 @@ onetime@^2.0.0: dependencies: mimic-fn "^1.0.0" +opener@^1.4.3: + version "1.4.3" + resolved "https://registry.yarnpkg.com/opener/-/opener-1.4.3.tgz#5c6da2c5d7e5831e8ffa3964950f8d6674ac90b8" + opn@^5.1.0: version "5.3.0" resolved "https://registry.yarnpkg.com/opn/-/opn-5.3.0.tgz#64871565c863875f052cfdf53d3e3cb5adb53b1c" @@ -8421,6 +8504,10 @@ require-main-filename@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/require-main-filename/-/require-main-filename-1.0.1.tgz#97f717b69d48784f5f526a6c5aa8ffdda055a4d1" +require-package-name@^2.0.1: + version "2.0.1" + resolved "https://registry.yarnpkg.com/require-package-name/-/require-package-name-2.0.1.tgz#c11e97276b65b8e2923f75dabf5fb2ef0c3841b9" + require-uncached@^1.0.2, require-uncached@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/require-uncached/-/require-uncached-1.0.3.tgz#4e0d56d6c9662fd31e43011c4b95aa49955421d3" @@ -9105,6 +9192,12 @@ spdy@^3.4.1: select-hose "^2.0.0" spdy-transport "^2.0.18" +speed-measure-webpack-plugin@^1.2.2: + version "1.2.2" + resolved "https://registry.yarnpkg.com/speed-measure-webpack-plugin/-/speed-measure-webpack-plugin-1.2.2.tgz#ed6c850985d3a55376b6d26cfb439ac719acf38c" + dependencies: + chalk "^2.0.1" + speedometer@~0.1.2: version "0.1.4" resolved "https://registry.yarnpkg.com/speedometer/-/speedometer-0.1.4.tgz#9876dbd2a169d3115402d48e6ea6329c8816a50d" @@ -9644,6 +9737,10 @@ truncate-utf8-bytes@^1.0.0: dependencies: utf8-byte-length "^1.0.1" +tryer@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/tryer/-/tryer-1.0.0.tgz#027b69fa823225e551cace3ef03b11f6ab37c1d7" + tty-browserify@0.0.0: version "0.0.0" resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6" @@ -10042,6 +10139,23 @@ webpack-addons@^1.1.5: dependencies: jscodeshift "^0.4.0" +webpack-bundle-analyzer@^2.11.1: + version "2.11.1" + resolved "https://registry.yarnpkg.com/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.11.1.tgz#b9fbfb6a32c0a8c1c3237223e90890796b950ab9" + dependencies: + acorn "^5.3.0" + bfj-node4 "^5.2.0" + chalk "^2.3.0" + commander "^2.13.0" + ejs "^2.5.7" + express "^4.16.2" + filesize "^3.5.11" + gzip-size "^4.1.0" + lodash "^4.17.4" + mkdirp "^0.5.1" + opener "^1.4.3" + ws "^4.0.0" + webpack-cli@^2.0.14: version "2.0.14" resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-2.0.14.tgz#71d03d8c10547c1dfd674f71ff3b0457c33a74cd"