Next.js <Image /> 组件在 Netlify 上较慢，在 Vercel 上较快

Question

我有一个相对简单的 Next.js 应用程序，并使用 Next.js 的<Image />组件来渲染两个小图像，如下所示：

<Row className="justify-content-center m-0 mt-3 text-center">
  <Col xs={4} md={3} lg={2} className="pr-xs-0  pr-sm-5 pl-0">
    <Image
      src="/assets/images/logo1.png"
      alt="Logo etc1"
      width={320}
      height={150}
    />
  </Col>
  <Col xs={4} md={3} lg={2} className="pl-xs-0 pr-0 pl-sm-5">
    <Image
      src="/assets/images/logo2.jpg"
      alt="Logo etc2"
      width={320}
      height={150}
    />
  </Col>
</Row>

这两个小镜像（每个约 50Kb）在开发过程中可以立即加载，但在 Netlify 上部署时却花费了相当长的时间（最多 4 秒！！）。

部署到 Vercel 的完全相同的存储库可以立即渲染图像。

值得一提的是，使用普通的 html<img />标签在 Vercel 和 Netlify 上渲染它们的速度都非常快，但是当使用 Next.js 组件延迟加载时，我很困惑地看到这样不显眼的图像在 Netlify 上加载需要多长时间<Image />。

我有什么遗漏的吗？

Answer 1

Vercel 在您的应用程序前面使用某种服务器，用于在使用 next/image 时优化图像。

尝试使用 Next.js 的 Netlify 插件https://github.com/netlify/netlify-plugin-nextjs。但仍然存在一些问题：https ://github.com/netlify/netlify-plugin-nextjs/issues/155