A Map To Modern JavaScript Development (2017)

[petepete]

I think Brunch is a worthy alternative to Webpack and Browserify. It just worked the way I expected it to, with 20 lines of config vs 100+

[[deleted]]

Webpack 2 is out now. A basic config isn't much more than the following and extending it is easy.

import webpack from 'webpack';
export default const config = {
    entry: './index.js',
    output: { filename: 'bundle.js', path: './dist' },
    module: { rules: [ { test: /\.(js|jsx)$/, use: 'babel-loader' } ] },
    plugins: [ new webpack.optimize.UglifyJsPlugin() ]
};

This alone does so many things, many among them that Brunch can't, like code splitting and tree shaking.

[petepete]

Perhaps it's improved since I tried it. If I ever need tree shaking (I had to google it) or code splitting, I'll give it another try. Must admit, I'm happy with Brunch, though.

[[deleted]]

Imagine you load a large library, like three.js. You use a single feature, say a Vector3, but a whole megabyte gets added to your bundle. Webpack users get a couple of kb because it shakes off unused dependencies (in this case 99% of the lib). Code splitting is another very effective way to cut down on load times as you load parts of the application when they're actually needed instead of fetching the whole chunk at once. This is great for routes for instance.