Question

嗨，我正在使用 NextJs，我遇到了一个问题，当我的应用程序托管在我的本地服务器上时，使用 getStaticProps 预加载的页面会在几毫秒内加载，但是当托管在 Vercel 上时，加载需要 300 毫秒. 有人对如何让我的页面在 Vercel 上更快加载有任何建议吗？

我的应用目前托管在 https://next-movie-delta.vercel.app/

我的 github 仓库是 https://github.com/lewisRotchell/next-movie

我的 getStaticPaths 代码如下所示：

    export async function getStaticPaths() {
  const movies = await getMovies();

  const bigMovieArray = [
    ...movies[0].results,
    ...movies[1].results,
    ...movies[2].results,
  ];

  const paths = bigMovieArray.map((movie) => ({
    params: { movieId: movie.id.toString() },
  }));

  return {
    paths,
    fallback: "blocking",
  };
}

getMovies 代码如下所示：

export async function getMovies() {
  const urls = [newReleasesUrl, popularMoviesUrl, topRatedMoviesUrl];

  try {
    let data = await Promise.all(
      urls.map((url) => fetch(url).then((response) => response.json()))
    ).catch((error) => console.log(error));
    return data;
  } catch (error) {
    console.log(error);
  }
}

谢谢:)

Answer 1

我已经设法解决了这个问题！我将链接从 withRouter 更改为来自 next/link 的标签，它解决了我的问题！

为什么当我在本地服务器上的生产环境中使用 getStaticPaths 时，页面会立即加载但部署在 Vercel 上却没有？

1 个答案: