如何审核我的应用程序的哪个部分运行缓慢？答案

【问题标题】：How can I audit which part of my app is slow?如何审核我的应用程序的哪个部分运行缓慢？
【发布时间】：2021-11-08 23:52:06
【问题描述】：

当我在本地运行我的应用程序时，它既好又快，但是，当我部署到 Vercel 时，事情变得非常非常缓慢。我的应用程序是 NextJS 应用程序，使用 Prisma 作为数据库客户端。该数据库是一个 Amazon RDS Postgres 实例。我是预发布的，所以没有真正的流量，所以我认为连接没有问题，或者我需要一个 pgbouncer 设置......虽然我也不知道如何审计。

我很想听听他们的建议！

【问题讨论】：

我在部署一个应用程序时遇到了类似的问题，该应用程序在我的本地计算机上运行速度很快，但在部署到 Vercel 后变得很慢。事实证明，使用 getServerSideProps 在服务器端获取数据花费了太多时间。为了解决这个问题，我尝试使用 next/dynamic 在客户端延迟加载一些数据量大的组件。您也可以尝试类似的调试方法。仅加载不需要在服务器端获取大量数据的组件。通过这种方式，您可以调试您的应用程序。
确保 RDS 与您的 Vercel 应用位于同一区域以减少延迟。也使用最新版本的 Prisma，因为 nApi 被设为默认值，这应该会使数据库请求更快。

标签： next.js amazon-rds prisma vercel

【解决方案1】：

可能值得使用浏览器开发工具，特别是“网络”和“性能”选项卡，看看您是否可以找到拖慢您速度的原因。

您也可以使用 React Dev Tools 进行检查并查看那里的 Profiler 工具，但这必须在本地运行，这可能没有那么有用，因为您说应用程序在本地运行速度很快

【讨论】：