我有一个用Nextjs构建的网络应用程序，托管在使用Firebase存储数据的Vercel上，目前我有一个33个文档的集合，每个文档都有17个字段，然后我有一个函数，当用户登陆索引页面时，它会获取所有这些记录。

获取数据的代码是：

const getData = async () => {
  const q = query(collection(firestore, "data"), where("published", "==", true));
  const querySnapshot = await getDocs(q);
  return querySnapshot.docs.map(doc => ({id: doc.id, ...doc.data()}))
}

然而，每当我刷新页面以获取数据时，我的使用选项卡都会显示一个巨大的峰值：image showing usage peak when I refreshed the page
我只是不明白一次加载怎么会导致2.5k的读取和19个活动连接。这正常吗？没有其他人同时使用这个应用程序，因为它还没有公开。
我真的不知道如何开始调试这个问题，所以欢迎所有的建议！

**编辑：**我已经将问题缩小到部署在Vercel上的Live应用程序。在localhost中浏览我的应用程序时，高读取/活动连接不是问题。