From a6d732ed14516b3b7c2f8bb83946423b0f68722c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tomasz=20Drwi=C4=99ga?= Date: Tue, 13 Mar 2018 16:54:39 +0100 Subject: [PATCH] [stable] Optimize JS build (#8093) * Extract common chunks plugin. * Fix common CSS. * Fix js push for stable. * Remove arguments to getPlugins. --- js/package-lock.json | 195 +++++++++++++++++++++++++++++++++++---- js/package.json | 4 +- js/scripts/push-cargo.sh | 2 +- js/webpack/app.js | 50 +++++----- js/webpack/shared.js | 2 - 5 files changed, 208 insertions(+), 45 deletions(-) diff --git a/js/package-lock.json b/js/package-lock.json index 10c90235b..b8229249a 100644 --- a/js/package-lock.json +++ b/js/package-lock.json @@ -45,13 +45,13 @@ "dev": true }, "@parity/dapp-dapp-methods": { - "version": "github:js-dist-paritytech/dapp-dapp-methods#b649fb9056d49bbf4fde719f91a4cfcaf529f9f6", + "version": "github:js-dist-paritytech/dapp-dapp-methods#01dcabc56ecea95cdc87dde81598b7e8469375d6", "dev": true, "requires": { "@parity/api": "2.1.15", "@parity/mobx": "1.1.2", - "@parity/ui": "3.0.22", - "mobx": "3.6.1", + "@parity/ui": "3.1.4", + "mobx": "3.6.2", "mobx-react": "4.3.5", "prop-types": "15.6.1", "react": "16.2.0", @@ -79,10 +79,91 @@ "@parity/shared": "2.2.23" } }, + "@parity/ui": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/@parity/ui/-/ui-3.1.4.tgz", + "integrity": "sha512-aG79IOxMBeRsu92Zlq3QsR6Z6PAmlhmOdU9tQP+F9XB/44Y4sGxfSDNucGucWz/Jz0VGerJn53CoACa4Yj5uYA==", + "dev": true, + "requires": { + "@parity/api": "2.1.15", + "@parity/etherscan": "2.1.3", + "@parity/mobx": "1.1.2", + "@parity/shared": "2.2.23", + "babel-runtime": "6.26.0", + "bignumber.js": "4.1.0", + "brace": "0.11.0", + "date-difference": "1.0.0", + "eventemitter3": "2.0.3", + "file-saver": "1.3.3", + "geopattern": "1.2.3", + "js-sha3": "0.6.1", + "keycode": "2.1.9", + "lodash": "4.17.4", + "moment": "2.19.2", + "qrcode-generator": "1.3.1", + "react-ace": "5.7.0", + "react-copy-to-clipboard": "5.0.1", + "react-datetime": "2.11.0", + "react-dom": "16.1.1", + "react-dropzone": "4.2.3", + "react-element-to-jsx-string": "13.1.0", + "react-event-listener": "0.5.2", + "react-intl": "2.4.0", + "react-markdown": "3.0.2", + "react-portal": "4.0.0", + "react-qr-reader": "2.0.1", + "react-redux": "5.0.6", + "react-router": "3.2.0", + "react-tooltip": "3.4.0", + "recharts": "1.0.0-beta.2", + "redux": "3.7.2", + "semantic-ui-css": "2.2.12", + "semantic-ui-react": "0.76.0", + "zxcvbn": "4.4.2" + }, + "dependencies": { + "react-dom": { + "version": "16.1.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.1.1.tgz", + "integrity": "sha512-q06jiwST8SEPAMIEkAsu7BgynEZtqF87VrTc70XsW7nxVhWEu2Y4MF5UfxxHQO/mNtQHQWP0YcFxmwm9oMrMaQ==", + "dev": true, + "requires": { + "fbjs": "0.8.16", + "loose-envify": "1.3.1", + "object-assign": "4.1.1", + "prop-types": "15.6.1" + } + }, + "semantic-ui-react": { + "version": "0.76.0", + "resolved": "https://registry.npmjs.org/semantic-ui-react/-/semantic-ui-react-0.76.0.tgz", + "integrity": "sha512-CdiIT8n7ZwUlytZkYsQMnaVGmoIZI/mVs4lijvLcR568kcnlRkYYaFKhMLq5tFDQU6+QhdTD+8WebF7ov0Ql6Q==", + "dev": true, + "requires": { + "babel-runtime": "6.26.0", + "classnames": "2.2.5", + "lodash": "4.17.4", + "prop-types": "15.6.1" + } + } + } + }, + "bignumber.js": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-4.1.0.tgz", + "integrity": "sha512-eJzYkFYy9L4JzXsbymsFn3p54D+llV27oTQ+ziJG7WFRheJcNZilgVXMG0LoZtlQSKBsJdWtLFqOD0u+U0jZKA==", + "dev": true + }, + "js-sha3": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.6.1.tgz", + "integrity": "sha1-W4n3enR3Z5h39YxKB1JAk0sflcA=", + "dev": true + }, "mobx": { - "version": "3.6.1", - "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.1.tgz", - "integrity": "sha1-rmOo8A4UhadA0Pka4val9o4wO+o=", + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.2.tgz", + "integrity": "sha512-Dq3boJFLpZEvuh5a/MbHLUIyN9XobKWIb0dBfkNOJffNkE3vtuY0C9kSDVpfH8BB0BPkVw8g22qCv7d05LEhKg==", "dev": true }, "prop-types": { @@ -136,13 +217,12 @@ } }, "@parity/dapp-dapp-visible": { - "version": "github:js-dist-paritytech/dapp-dapp-visible#28546f312ea9877ebeea9c52afea1e7ec943cd0d", + "version": "github:js-dist-paritytech/dapp-dapp-visible#14e6499495a3421c4a6da4728b8d99dfa1656e1c", "dev": true, "requires": { "@parity/api": "2.1.15", - "@parity/mobx": "1.1.2", - "@parity/ui": "3.0.22", - "mobx": "3.6.1", + "@parity/ui": "3.1.4", + "mobx": "3.6.2", "mobx-react": "4.3.5", "prop-types": "15.6.1", "react": "16.2.0", @@ -170,10 +250,91 @@ "@parity/shared": "2.2.23" } }, + "@parity/ui": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/@parity/ui/-/ui-3.1.4.tgz", + "integrity": "sha512-aG79IOxMBeRsu92Zlq3QsR6Z6PAmlhmOdU9tQP+F9XB/44Y4sGxfSDNucGucWz/Jz0VGerJn53CoACa4Yj5uYA==", + "dev": true, + "requires": { + "@parity/api": "2.1.15", + "@parity/etherscan": "2.1.3", + "@parity/mobx": "1.1.2", + "@parity/shared": "2.2.23", + "babel-runtime": "6.26.0", + "bignumber.js": "4.1.0", + "brace": "0.11.0", + "date-difference": "1.0.0", + "eventemitter3": "2.0.3", + "file-saver": "1.3.3", + "geopattern": "1.2.3", + "js-sha3": "0.6.1", + "keycode": "2.1.9", + "lodash": "4.17.4", + "moment": "2.19.2", + "qrcode-generator": "1.3.1", + "react-ace": "5.7.0", + "react-copy-to-clipboard": "5.0.1", + "react-datetime": "2.11.0", + "react-dom": "16.1.1", + "react-dropzone": "4.2.3", + "react-element-to-jsx-string": "13.1.0", + "react-event-listener": "0.5.2", + "react-intl": "2.4.0", + "react-markdown": "3.0.2", + "react-portal": "4.0.0", + "react-qr-reader": "2.0.1", + "react-redux": "5.0.6", + "react-router": "3.2.0", + "react-tooltip": "3.4.0", + "recharts": "1.0.0-beta.2", + "redux": "3.7.2", + "semantic-ui-css": "2.2.12", + "semantic-ui-react": "0.76.0", + "zxcvbn": "4.4.2" + }, + "dependencies": { + "react-dom": { + "version": "16.1.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.1.1.tgz", + "integrity": "sha512-q06jiwST8SEPAMIEkAsu7BgynEZtqF87VrTc70XsW7nxVhWEu2Y4MF5UfxxHQO/mNtQHQWP0YcFxmwm9oMrMaQ==", + "dev": true, + "requires": { + "fbjs": "0.8.16", + "loose-envify": "1.3.1", + "object-assign": "4.1.1", + "prop-types": "15.6.1" + } + }, + "semantic-ui-react": { + "version": "0.76.0", + "resolved": "https://registry.npmjs.org/semantic-ui-react/-/semantic-ui-react-0.76.0.tgz", + "integrity": "sha512-CdiIT8n7ZwUlytZkYsQMnaVGmoIZI/mVs4lijvLcR568kcnlRkYYaFKhMLq5tFDQU6+QhdTD+8WebF7ov0Ql6Q==", + "dev": true, + "requires": { + "babel-runtime": "6.26.0", + "classnames": "2.2.5", + "lodash": "4.17.4", + "prop-types": "15.6.1" + } + } + } + }, + "bignumber.js": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-4.1.0.tgz", + "integrity": "sha512-eJzYkFYy9L4JzXsbymsFn3p54D+llV27oTQ+ziJG7WFRheJcNZilgVXMG0LoZtlQSKBsJdWtLFqOD0u+U0jZKA==", + "dev": true + }, + "js-sha3": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.6.1.tgz", + "integrity": "sha1-W4n3enR3Z5h39YxKB1JAk0sflcA=", + "dev": true + }, "mobx": { - "version": "3.6.1", - "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.1.tgz", - "integrity": "sha1-rmOo8A4UhadA0Pka4val9o4wO+o=", + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.2.tgz", + "integrity": "sha512-Dq3boJFLpZEvuh5a/MbHLUIyN9XobKWIb0dBfkNOJffNkE3vtuY0C9kSDVpfH8BB0BPkVw8g22qCv7d05LEhKg==", "dev": true }, "prop-types": { @@ -254,7 +415,7 @@ "@parity/mobx": "1.1.2", "@parity/ui": "3.0.22", "format-number": "3.0.0", - "mobx": "3.6.1", + "mobx": "3.6.2", "mobx-react": "4.3.5", "prop-types": "15.6.1", "react": "16.2.0", @@ -284,9 +445,9 @@ } }, "mobx": { - "version": "3.6.1", - "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.1.tgz", - "integrity": "sha1-rmOo8A4UhadA0Pka4val9o4wO+o=", + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-3.6.2.tgz", + "integrity": "sha512-Dq3boJFLpZEvuh5a/MbHLUIyN9XobKWIb0dBfkNOJffNkE3vtuY0C9kSDVpfH8BB0BPkVw8g22qCv7d05LEhKg==", "dev": true }, "prop-types": { diff --git a/js/package.json b/js/package.json index dbc958221..0e382c3f7 100644 --- a/js/package.json +++ b/js/package.json @@ -21,10 +21,10 @@ "Parity" ], "scripts": { - "build": "npm run build:inject && npm run build:app && npm run build:embed", + "build": "npm run build:inject && npm run build:app:embed", "build:app": "webpack --config webpack/app", "build:inject": "webpack --config webpack/inject", - "build:embed": "cross-env EMBED=1 node webpack/embed", + "build:app:embed": "cross-env EMBED=1 node webpack/embed", "build:i18n": "npm run clean && npm run build && babel-node ./scripts/build-i18n.js", "ci:build": "cross-env NODE_ENV=production npm run build", "clean": "rimraf ./.build ./.coverage ./.happypack", diff --git a/js/scripts/push-cargo.sh b/js/scripts/push-cargo.sh index 83f5a199b..d32b6f6b7 100755 --- a/js/scripts/push-cargo.sh +++ b/js/scripts/push-cargo.sh @@ -4,7 +4,7 @@ set -e # variables PVER="1-9" UTCDATE=`date -u "+%Y%m%d-%H%M%S"` -BRANCH="beta" +BRANCH="stable" GIT_PARITY="https://${GITHUB_JS_PRECOMPILED}:@github.com/paritytech/parity.git" echo "*** [cargo] Setting up GitHub config for parity" diff --git a/js/webpack/app.js b/js/webpack/app.js index 45d8f7762..ffdeb2416 100644 --- a/js/webpack/app.js +++ b/js/webpack/app.js @@ -19,6 +19,7 @@ const fs = require('fs'); const path = require('path'); const rimraf = require('rimraf'); const flatten = require('lodash.flatten'); +const webpack = require('webpack'); // const ReactIntlAggregatePlugin = require('react-intl-aggregate-webpack-plugin'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const WebpackErrorNotificationPlugin = require('webpack-error-notification'); @@ -47,9 +48,10 @@ const EMBED = process.env.EMBED; const isProd = ENV === 'production'; const isEmbed = EMBED === '1' || EMBED === 'true'; -const entry = isEmbed - ? { embed: ['babel-polyfill', './embed.js'] } - : { bundle: ['babel-polyfill', './index.parity.js'] }; +const entry = { + embed: ['babel-polyfill', './embed.js'], + bundle: ['babel-polyfill', './index.parity.js'] +}; module.exports = { cache: !isProd, @@ -164,23 +166,30 @@ module.exports = { }, plugins: (function () { - let plugins = Shared.getPlugins().concat( - new WebpackErrorNotificationPlugin(), - new ExtractTextPlugin({ - filename: `${isEmbed ? 'embed' : 'bundle'}.css` - }), - ); - - if (!isEmbed) { - plugins = [].concat( - plugins, + let plugins = [] + .concat(Shared.getPlugins()) + .concat( + new WebpackErrorNotificationPlugin(), + new ExtractTextPlugin({ + filename: '[name].css', + allChunks: true + }) + ) + .concat( + new HtmlWebpackPlugin({ + title: 'Parity Bar', + filename: 'embed.html', + template: './index.parity.ejs', + favicon: FAVICON, + chunks: ['commons', 'embed'] + }), new HtmlWebpackPlugin({ title: 'Parity', filename: 'index.html', template: './index.parity.ejs', favicon: FAVICON, - chunks: ['bundle'] + chunks: ['commons', 'bundle'] }), new CopyWebpackPlugin( @@ -246,16 +255,11 @@ module.exports = { {} ) ); - } - if (isEmbed) { - plugins.push( - new HtmlWebpackPlugin({ - title: 'Parity Bar', - filename: 'embed.html', - template: './index.parity.ejs', - favicon: FAVICON, - chunks: ['embed'] + if (isProd) { + plugins.unshift( + new webpack.optimize.CommonsChunkPlugin({ + name: 'commons' }) ); } diff --git a/js/webpack/shared.js b/js/webpack/shared.js index 63c86c7e5..2834ea922 100644 --- a/js/webpack/shared.js +++ b/js/webpack/shared.js @@ -19,7 +19,6 @@ const webpack = require('webpack'); const HappyPack = require('happypack'); const PackageJson = require('../package.json'); -const EMBED = process.env.EMBED; const ENV = process.env.NODE_ENV || 'development'; const isProd = ENV === 'production'; const UI_VERSION = PackageJson @@ -38,7 +37,6 @@ function getPlugins (_isProd = isProd) { const plugins = [ new webpack.DefinePlugin({ 'process.env': { - EMBED: JSON.stringify(EMBED), NODE_ENV: JSON.stringify(ENV), RPC_ADDRESS: JSON.stringify(process.env.RPC_ADDRESS), PARITY_URL: JSON.stringify(process.env.PARITY_URL),