时间戳

首页 > 解决方案 > 如何减少 next.js 中的 SSR 渲染时间

next.js - 如何减少 next.js 中的 SSR 渲染时间

问题描述

我正在尝试减少 SSR 现在所花费的加载时间，因此，我正在构建一个产品页面和单个产品描述页面，但是这次每当我单击特定类别时会发生什么，进行 API 调用并获取数据并渲染该数据，但假设我有 1000 个产品，那么获取和渲染数据将花费大量时间。

如何减少该时间，并且用户不必等待足够长的时间来加载产品。

当前代码：

export async function getServerSideProps(context) {
  const { query } = context
  const { id, categoryId } = query

  var json ={
    _id : id
  }
  try{
    const respones = await fetch(Constants.getProducts, {
      method: 'POST',
      headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json'
      },
      
      body: JSON.stringify(json),
      });
      const result = await respones.json();
      return{
          props : {result : result.doc[0], categoryId : categoryId , status : 200}
      }
  } catch(e){
    return{
      props : {result : result, categoryId : categoryId, status : 404}
  }
  }
}

请帮忙

标签： next.jsserver-side-rendering

解决方案

对于正在添加的新产品，您应该使用静态生成并getStaticProps使用增量静态生成。

Next.js 博客有一个可以帮助您的示例。

链接在这里：

电子商务 Next.js 应用示例。

阅读更多关于：增量静态生成

推荐阅读