NextJS 9 - 压缩最佳实践

Question

有了使用内置 api (/pages/api) 的新选项，在客户端 js 上实现 gzip 压缩的新最佳实践方法是什么？

我最近才开始将我的应用程序转换为 NextJS，所以我仍在学习，但我在我的灯塔报告中注意到，在转换所有内容的过程中，NextJS 没有在生产中压缩任何内容。

Answer 1

只是为了以 non-ideal 的方式回答我自己的问题以在我的项目中解决此问题，作为 band-aid 的方法是在根目录（自定义服务器）中创建一个 server.js 文件方法）并粘贴此....

process.env.NODE_ENV = "production";
const compression = require("compression");
const express = require('express');
const next = require('next');
const port = parseInt(process.env.PORT, 10) || 3000;
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(compression());
    }
    server.all("*", (req, res) => {
        return handle(req, res)
    });
    server.listen(port, err => {
        if (err) throw err
        console.log(`> Ready on http://localhost:${port}`)
    })
});

并将 npm start 命令更改为此....

"start": "node server.js"

这使用 NextJS 自定义服务器处理程序处理所有请求（get/post/delete 等），但始终附加压缩。

Answer 2

您可以考虑使用 now 部署您的 next.js 应用程序。

它在 network/hosting 层透明地处理压缩，非常不错。设置很简单。在这里查看 https://zeit.co/docs/v2/network/compression。

最重要的是，它是免费的。

我也在我的 website 上使用它，我在 lighthouse 速度测试中得到了相当不错的分数。

NextJS 9 - 压缩最佳实践

NextJS 9 - Compression best practice

next.js