Skip to content

Commit

Permalink
Merge pull request #227 from dmvt/reduce-driver-to-less-than-1-MB
Browse files Browse the repository at this point in the history
reduces development driver size to ~683k by removing vendor sourceMaps
  • Loading branch information
jernejpregelj committed Jul 18, 2018
2 parents b315b8f + 1b21c28 commit aaad218
Show file tree
Hide file tree
Showing 7 changed files with 179 additions and 105 deletions.
13 changes: 9 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@
"author": "BigchainDB",
"main": "./dist/node/index.js",
"browser": "./dist/browser/bigchaindb-driver.cjs2.min.js",
"sideEffects": false,
"scripts": {
"lint": "eslint ./{src,test,examples}/**/*.js",
"build": "npm run clean && npm run build:cjs && npm run build:dist",
"build:bundle": "webpack",
"build:cjs": "cross-env BABEL_ENV=cjs babel ./src -d dist/node",
"build:dist": "cross-env NODE_ENV=production webpack -p",
"dev": "webpack -p -w",
"build:dist": "cross-env NODE_ENV=production webpack",
"dev": "webpack -w",
"clean": "rimraf dist/bundle dist/node",
"test": "npm run lint && nyc ava test/ && npm run thanks && npm run report-coverage",
"thanks": "cowsay Hi, thanks for your interest in BigchainDB. We appreciate your contribution!",
Expand Down Expand Up @@ -61,7 +62,8 @@
"rimraf": "^2.6.2",
"sinon": "^6.1.0",
"webpack": "^4.16.1",
"webpack-cli": "^3.0.8"
"webpack-cli": "^3.0.8",
"webpack-concat-plugin": "^3.0.0"
},
"dependencies": {
"browser-resolve": "^1.11.3",
Expand All @@ -79,7 +81,10 @@
"json-stable-stringify": "^1.0.1",
"query-string": "^6.0.0",
"sprintf-js": "^1.1.1",
"tweetnacl": "^1.0.0"
"tweetnacl": "^1.0.0",
"uglifyjs-webpack-plugin": "^1.2.7",
"webpack-merge": "^4.1.3",
"webpack-sources": "^1.1.0"
},
"keywords": [
"bigchaindb",
Expand Down
31 changes: 31 additions & 0 deletions plugins/add-vendors-plugin.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
const { ConcatSource } = require('webpack-sources')

module.exports = class AddVendorsPlugin {
constructor(base) {
this.base = base
}

apply(compiler) {
compiler.hooks.emit.tapAsync(
`AddVendorsPlugin ${this.base}`,
(compilation, callback) => {
const main = compilation.assets[`main.${this.base}`]
const mainMap = compilation.assets[`main.${this.base}.map`]
const vendor = compilation.assets[`vendors.${this.base}`]

if (main && vendor) {
const compiledAsset = new ConcatSource(main.children[0])
compiledAsset.add(vendor)
compiledAsset.add(main.children[1])
compilation.assets = {}
compilation.assets[this.base] = compiledAsset
} else if (main && mainMap) {
compilation.assets = {}
compilation.assets[this.base] = main
compilation.assets[`${this.base}.map`] = mainMap
}
callback()
}
)
}
}
29 changes: 29 additions & 0 deletions webpack.common.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
/* eslint-disable strict, no-console, object-shorthand */

'use strict'

const { paths } = require('./webpack.parts.js')

module.exports = {
entry: paths.entry,
mode: 'none',
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
},
}
]
},
optimization: {
minimize: true,
noEmitOnErrors: true
},
resolve: {
extensions: ['.js'],
modules: ['node_modules'],
},
}
119 changes: 18 additions & 101 deletions webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,112 +2,29 @@

'use strict'

const path = require('path')

const webpack = require('webpack')

const PRODUCTION = process.env.NODE_ENV === 'production'

const PATHS = {
ENTRY: path.resolve(__dirname, './src/index.js'),
BUNDLE: path.resolve(__dirname, 'dist/browser'),
NODE_MODULES: path.resolve(__dirname, 'node_modules'),
}

const OUTPUTS = [
{
filename: PRODUCTION ? 'bigchaindb-driver.window.min.js' : 'bigchaindb-driver.window.js',
library: 'BigchainDB',
libraryTarget: 'window',
path: PATHS.BUNDLE,
},
{
filename: PRODUCTION ? 'bigchaindb-driver.umd.min.js' : 'bigchaindb-driver.umd.js',
library: 'bigchaindb-driver',
libraryTarget: 'umd',
path: PATHS.BUNDLE,
},
{
filename: PRODUCTION ? 'bigchaindb-driver.cjs.min.js' : 'bigchaindb-driver.cjs.js',
library: 'bigchaindb-driver',
libraryTarget: 'commonjs',
path: PATHS.BUNDLE,
},
{
filename: PRODUCTION ? 'bigchaindb-driver.cjs2.min.js' : 'bigchaindb-driver.cjs2.js',
library: 'bigchaindb-driver',
libraryTarget: 'commonjs2',
path: PATHS.BUNDLE,
},
{
filename: PRODUCTION ? 'bigchaindb-driver.amd.min.js' : 'bigchaindb-driver.amd.js',
library: 'bigchaindb-driver',
libraryTarget: 'amd',
path: PATHS.BUNDLE,
}
]
const common = require('./webpack.common.js')

const { outputs } = require('./webpack.parts.js')

/** PLUGINS **/
const PLUGINS = [
new webpack.NoEmitOnErrorsPlugin(),
]

const PROD_PLUGINS = [
/*
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,
},
output: {
comments: false,
},
sourceMap: true,
}),
new webpack.LoaderOptionsPlugin({
debug: false,
minimize: true,
}),
*/
]

if (PRODUCTION) {
PLUGINS.push(...PROD_PLUGINS)
// '[libraryTarget]': [file extension]
const OUTPUT_MAPPING = {
'amd': 'amd',
'commonjs': 'cjs',
'commonjs2': 'cjs2',
'umd': 'umd',
'window': 'window',
}

const configBoilerplate = {
entry: [PATHS.ENTRY],

devtool: PRODUCTION ? '#source-map' : '#inline-source-map',

resolve: {
extensions: ['.js'],
modules: ['node_modules'], // Don't use absolute path here to allow recursive matching
},

plugins: PLUGINS,

module: {
rules: [
{
test: /\.js$/,
exclude: [PATHS.NODE_MODULES],
use: [{
loader: 'babel-loader',
options: {
cacheDirectory: true,
},
}],
},
],
},
const OVERRIDES = {
// optimization: {
// minimize: false
// }
}

/** EXPORTED WEBPACK CONFIG **/
const config = OUTPUTS.map(output => {
const configCopy = Object.assign({}, configBoilerplate)
configCopy.output = output
return configCopy
})

module.exports = config
if (PRODUCTION) {
module.exports = outputs(common, 'production', OUTPUT_MAPPING, OVERRIDES)
} else {
module.exports = outputs(common, 'development', OUTPUT_MAPPING, OVERRIDES)
}
30 changes: 30 additions & 0 deletions webpack.development.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
/* eslint-disable strict, no-console, object-shorthand */

'use strict'

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')

module.exports = {
devtool: 'inline-source-map',
optimization: {
minimizer: [
new UglifyJsPlugin({
test: /vendor/,
sourceMap: false,
}),
new UglifyJsPlugin({
test: /^((?!(vendor)).)*.js$/,
sourceMap: true,
})
],
splitChunks: {
cacheGroups: {
commons: {
test: /[\\/]node_modules[\\/]/,
name: 'vendors',
chunks: 'all'
}
}
},
},
}
55 changes: 55 additions & 0 deletions webpack.parts.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
/* eslint-disable strict, no-console, object-shorthand */

'use strict'

const path = require('path')
const merge = require('webpack-merge')

const development = require('./webpack.development.js')
const production = require('./webpack.production.js')

const AddVendorsPlugin = require('./plugins/add-vendors-plugin')

const paths = {
entry: path.resolve(__dirname, './src/index.js'),
bundle: path.resolve(__dirname, 'dist/browser'),
}

const outputs = (base, env, mapping, overrides) => {
const collection = []
const library = 'bigchaindb-driver'
const windowLibrary = 'BigchainDB'

let environment = development
let ext = 'js'

if (env === 'production') {
environment = production
ext = `min.${ext}`
}

Object.entries(mapping).forEach(([target, extension]) => {
const filename = `[name].${library}.${extension}.${ext}`

const compiled = {
output: {
filename: filename,
library: target === 'window' ? windowLibrary : library,
libraryTarget: target,
path: paths.bundle
},
plugins: [
new AddVendorsPlugin(`${library}.${extension}.${ext}`)
]
}

collection.push(merge(base, environment, compiled, overrides))
})

return collection
}

module.exports = {
outputs,
paths
}
7 changes: 7 additions & 0 deletions webpack.production.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
/* eslint-disable strict, no-console, object-shorthand */

'use strict'

module.exports = {
devtool: 'source-map',
}

0 comments on commit aaad218

Please sign in to comment.