如何使用下一个 js 加速 getServerSideProps？答案

【问题标题】：How to speed up getServerSideProps with next js?如何使用下一个 js 加速 getServerSideProps？
【发布时间】：2021-08-04 00:48:59
【问题描述】：

当我将 getServerSideProps 与 next js 一起使用时，页面加载几乎需要 5 或 6 秒。我尝试只使用一个 url 来获取而不是很多，但再次加载页面需要很多时间。

export const getServerSideProps = async (ctx) => {
   let data ;
   try {
      data = axios.get("url")
   } catch(e){
      data = "error"
   }
   return {
     data: data,
   };
 };

我想知道是否有任何技巧可以加快 getServerSideProps 数据获取速度，以便我可以更快地加载初始页面？

【问题讨论】：

标签： javascript reactjs axios next.js server-side-rendering

【解决方案1】：

我不知道让您想使用getServerSideProps 的场景，但如果可能的话，您可以改用getStaticProps。

当您使用getServerSideProps 时，第一个字节的时间 (TTFB) 将比getStaticProps 慢，因为服务器必须计算每个请求的结果，并且如果没有额外的配置，CDN 无法缓存结果。

因此，如果 SEO 对您很重要，并且您希望提供更新的数据，您可以使用 getStaticProps 和 Incremental Static Regeneration feature，这样您就可以通过在流量进入时在后台重新呈现现有页面来更新它们。

或者，如果 SEO 不重要（例如在面板和类似的网络应用上），您可以在客户端获取数据。

【讨论】：

我需要使用 ssr 因为 cookie 或 localStorage 在 getStaticProps 上不可用。谢谢。

【解决方案2】：

我刚刚找到了一个关于如何加快 getServerSideProps 的article，它确实有效。

【讨论】：