NextJS 13.4部署AWS EC2首屏加载过慢问题排查与优化求助

我已将NextJS 13.4应用部署至内存为2GB的AWS EC2实例中。我了解开发模式下NextJS会进行构建并展示结果，可能导致页面加载缓慢，但首次加载耗时竟长达20秒。

RootLayout 核心代码 #

export default async function RootLayout({ children }) {
  let token = cookies().get("byg_tk");
  let cookie =
    cookies().get("Device_id")?.value || headers().get("Device_id") || uuidv4();

  const categories = await getCategory(
    { page: 1, limit: 1000000 },
    token,
    cookie
  );

  const product = await getProduct(
    {
      page: 1,
      limit: 100000,
    },
    token,
    cookie
  );
  const cartList = await getCartList({}, token, cookie);
  const contact_us = await getContactUs({}, token, cookie);
  const contact_number = await getContactNumber({}, token, cookie);
  let searchProducts = await getProductBySearch({}, token, cookie);
  let coupons = await getCoupons({}, token, cookie);
  let userdetails = await getUser({}, token, cookie);
  const recent = await getRecentViews({}, token, cookie);
  let cartDetails = {
    couponDiscount: 0,
    cod_price: 0,
  };

  return (
    <html lang="en">
      <GoogleAnalytics GA_TRACKING_ID={GA_TRACKING_ID} />
      <Script
        id="bookyourgiftSchema"
        dangerouslySetInnerHTML={{
           __html: JSON.stringify(byg_schema(), null, "	"),
        }}
      />
      <Script
        id="bookyourgiftSocialSchema"
        dangerouslySetInnerHTML={{
          __html: JSON.stringify(byg_social_schema(), null, "	"),
        }}
      />
      <body>
        <Providers
          data={{
            coupons,
            categories,
            product,
            cartList,
            searchProducts,
            userdetails,
            contact_us,
            contact_number,
            cartDetails,
            recent,
          }}
        >
          {children}
        </Providers>
      </body>
    </html>
  );
}

已实施的优化操作 #

• 移除所有未使用依赖、CSS及其他影响构建体积的重型依赖
• 使用React缓存方法处理API请求
• 按NextJS官方建议进行图片优化并安装sharp包

尽管做了以上操作，首屏加载速度仍然极慢。我知晓服务器在返回含数据的HTML过程中起关键作用，但单项目部署场景下不该出现如此严重的加载延迟。首屏渲染时的网络请求按大小筛选后的结果显示资源体积偏大。

咨询问题 #

1. 哪些因素可能导致这种程度的首屏加载缓慢？
2. 可以采取哪些具体优化手段实现首屏快速渲染？

内容的提问来源于stack exchange，提问作者Shirish Pokhrel