Next.js plugin to compress static assets at build time and serve them instead of having to compress on-the-fly

Downloads in past


3.0.13 years ago3 years agoMinified + gzip package size for @moxy/next-pre-compression in KB


!NPM versionnpm-imagenpm-url !Downloadsdownloads-imagenpm-url !Build Statustravis-imagetravis-url !Coverage Statuscodecov-imagecodecov-url !Dependency statusdavid-dm-imagedavid-dm-url !Dev Dependency statusdavid-dm-dev-imagedavid-dm-dev-url
Next.js plugin to compress static assets at build time and serve them instead of having to compress on-the-fly.


$ npm i --save @moxy/next-pre-compression



Setup the plugin in the next.config.js file:
const withPreCompression = require('@moxy/next-pre-compression');

module.exports = withPreCompression({ ...nextConfig });

This plugin will automatically disable itself if you disable compress in your next.config.js.


Express middleware used to serve the previously compressed files, by leveraging express-static-gzip.
First, you need to setup a custom express server. Then, simply add the middleware like so:
// server.js

const express = require('express');
const next = require('next');
const preCompression = require('@moxy/next-pre-compression/express-middleware');
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handle = app.getRequestHandler();

app.prepare().then(() => {
    const server = express();

    if (!dev) {
        server.use(preCompression(app, {
            maxAge: 30 * 24 * 60 * 60 * 1000, // 30 days

    server.get('*', (req, res) => handle(req, res));

    server.listen(port, host, (err) => {
        if (err) { throw err; }

        console.log(`> Ready on http://localhost:${port}`);
.catch((err) => {
    setImmediate(() => { throw err; });

⚠️ You must not use the middleware in dev as it's not supported, see tkoenig89/express-static-gzip#22.

⚠️ A custom assetPrefix that references an absolute URI is not yet supported (e.g.: https://cdn.my-site.com), see moxystudio/next-pre-compression#8.

Available options

All options from serve-static are also available.
⚠️ You can't enable the index option as it's always set to false, due to a strange behavior of express-static-gzip that modifies the request path without restoring it, see: https://github.com/tkoenig89/express-static-gzip/blob/94767f79e861a3901e8ebba31b084abc4986817f/index.js#L28
Default options
    maxAge: 365 * 24 * 60 * 60 * 1000, // 1 year
    immutable: true,
    etag: false,
    index: false // Can't be changed


Any parameter passed to the test command, is passed down to Jest.
$ npm test
$ npm test -- --watch # during development

After running the tests, a coverage folder will be created containing the test coverage info.


Released under the MIT License.