Kevin Powell - Community•12mo ago

Brotli compression in next.js

Hey guys I'm working on brotli compression in next.js and I need your help Problem: The compression works fine, I can see the [filename-hash].js.br files in the _next/chunks. But when doing npm start, the production build doesn't have the .br chunk files. Next.config.js

webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback.fs = false;
      config.resolve.fallback.tls = false;
      config.resolve.fallback.net = false;
      config.resolve.fallback.child_process = false;
    }
    config.plugins.push(
      new BrotliPlugin({
        asset: "[path].br",
        test: /\.(js|css|html|svg)$/,
        threshold: 10240,
        minRatio: 0.8,
      })
    );
    return config;
  },

webpack: (config, { isServer }) => {
    if (!isServer) {
      config.resolve.fallback.fs = false;
      config.resolve.fallback.tls = false;
      config.resolve.fallback.net = false;
      config.resolve.fallback.child_process = false;
    }
    config.plugins.push(
      new BrotliPlugin({
        asset: "[path].br",
        test: /\.(js|css|html|svg)$/,
        threshold: 10240,
        minRatio: 0.8,
      })
    );
    return config;
  },

middleware.js

// This part contains error i guess (Start)
  if (nextUrlPathname.includes("_next/static/")) {
    NextResponse.rewrite("*.js", (req, res, next) => {
      req.url = req.url + ".br";
      res.set("Content-Encoding", "br");
      res.set("Content-Type", "application/javascript; charset=UTF-8");
      next();
    });
  }
// This part contains error i guess (End)

// This part contains error i guess (Start)
  if (nextUrlPathname.includes("_next/static/")) {
    NextResponse.rewrite("*.js", (req, res, next) => {
      req.url = req.url + ".br";
      res.set("Content-Encoding", "br");
      res.set("Content-Type", "application/javascript; charset=UTF-8");
      next();
    });
  }
// This part contains error i guess (End)

Note: I'm using next.js version 13.4.6, and I'm NOT using app router. And i don't need server.js or node.js suggession. Just wanted to handle it in NextRequest and NextResponse itself. (Thanks In Advance)

1 Reply

Rägnar O'ock•12mo ago

Can you provide the repository for this project? I cannot personally help you because I never used those tools but someone that did will most likely need more than the 2 snippets of code you've provided

Gaming

Programming

Brotli compression in next.js