Skip to content

Commit

Permalink
Precompress and optimize static files during build and serve them to …
Browse files Browse the repository at this point in the history
…the browsers.

- create precompressed variants of js, css, svg files: gz using zopfli and br using brotli

Currently using forked versions of expressjs/send/negotiator while waiting for the PRs to go through:
- jshttp/negotiator#49
- pillarjs/send#108
  • Loading branch information
Mikko Tiihonen committed Nov 25, 2016
1 parent aeb1502 commit 6d55853
Show file tree
Hide file tree
Showing 3 changed files with 23 additions and 2 deletions.
4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
"csscolorparser": "1.0.3",
"debug": "2.3.3",
"element-resize-detector": "1.1.9",
"express": "4.14.0",
"express": "gmokki/express#6eeb054",
"fluxible": "1.2.0",
"fluxible-action-utils": "0.2.4",
"fluxible-addons-react": "0.2.8",
Expand Down Expand Up @@ -112,7 +112,9 @@
"babel-loader": "6.2.8",
"babel-plugin-dev-expression": "0.2.1",
"babel-preset-latest": "6.16.0",
"brotli-webpack-plugin": "0.1.1",
"chance": "1.0.4",
"compression-webpack-plugin": "0.3.2",
"css-loader": "0.26.0",
"csswring": "5.1.0",
"eslint": "3.10.2",
Expand Down
5 changes: 4 additions & 1 deletion server/server.js
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,10 @@ const app = express();
function setUpStaticFolders() {
const staticFolder = path.join(process.cwd(), '_static');
// Sert cache for 1 week
app.use(config.APP_PATH, express.static(staticFolder, { maxAge: 604800000 }));
app.use(config.APP_PATH, express.static(staticFolder, {
maxAge: 604800000,
precompressed: [{ encoding: 'br', extension: '.br' }, { encoding: 'gzip', extension: '.gz' }],
}));
}

function setUpMiddleware() {
Expand Down
16 changes: 16 additions & 0 deletions webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,9 @@ const autoprefixer = require('autoprefixer');
const csswring = require('csswring');
const StatsPlugin = require('stats-webpack-plugin');
const fs = require('fs');
const glob = require('glob');
const GzipCompressionPlugin = require("compression-webpack-plugin")
const BrotliCompressionPlugin = require('brotli-webpack-plugin')

require('babel-core/register')({
presets: ['modern-node', 'stage-2'], // eslint-disable-line prefer-template
Expand Down Expand Up @@ -153,6 +156,19 @@ function getPluginsConfig(env) {
filename: 'css/[name].[contenthash].css',
allChunks: true,
}),
new GzipCompressionPlugin({
debug: true,
asset: '[path].gz[query]',
algorithm: 'zopfli',
test: /\.(js|css|html|svg)$/,
minRatio: 0.95
}),
new BrotliCompressionPlugin({
debug: true,
asset: '[path].br[query]',
test: /\.(js|css|html|svg)$/,
minRatio: 0.95
}),
new webpack.NoErrorsPlugin(),
]);
}
Expand Down

0 comments on commit 6d55853

Please sign in to comment.