Firestore请求量优化最佳方案：实时页面场景下如何降请求次数

针对你遇到的用户关联产品单次加载触发300次请求的问题，结合实时更新需求，以下是几种高效的解决方案：

1. 改用子集合存储用户产品 #

将用户关联的产品从「用户文档内的ID数组」改为「用户文档的子集合」（如users/{userId}/products），这样可以通过一次集合查询获取所有用户产品，而非逐个请求单个文档：

// 获取用户所有产品（仅1次请求）
const productsSnapshot = await db.collection('users').doc(userId).collection('products').get();
// 实时监听用户产品变化（仅1次初始请求，后续增量更新）
db.collection('users').doc(userId).collection('products').onSnapshot(snapshot => {
  snapshot.docChanges().forEach(change => {
    // 处理新增/修改/删除的产品
  });
});

优势：既把请求次数从300次降到1次，又能通过集合监听实现实时更新，后续产品变更只会触发增量请求，无需重新加载全部数据。

2. 批量获取文档（适配现有数据结构） #

如果暂时不想调整数据结构，可使用Firestore的getAll()方法批量获取多个文档，单次请求最多支持500个文档，完全覆盖300个产品的需求：

// 收集用户所有产品的文档引用
const productRefs = userProductIds.map(id => db.collection('products').doc(id));
// 批量获取（仅1次请求）
const productsSnapshot = await db.getAll(...productRefs);

注意：批量监听仍会为每个文档创建监听，请求次数仍为300次，因此更推荐子集合方案实现实时更新。

3. 启用本地缓存减少重复请求 #

开启Firestore本地缓存后，重复获取已加载的文档会优先从本地读取，不消耗请求额度，同时缓存会自动同步实时更新：

// Web端配置缓存（移动端默认开启）
db.settings({
  cacheSizeBytes: firebase.firestore.CACHE_SIZE_UNLIMITED
});

配合子集合或批量查询，用户再次导航到页面时，若数据未变更会直接读取缓存，避免重复消耗请求额度。

4. 分页加载（按需优化） #

如果页面无需一次性展示全部300个产品，可采用分页加载，每次加载20-50个产品，进一步降低单次请求的文档数量：

// 初始加载第一页
let lastVisible = null;
const firstPage = await db.collection('users').doc(userId).collection('products')
  .limit(20)
  .get();
lastVisible = firstPage.docs[firstPage.docs.length - 1];

// 加载下一页
const nextPage = await db.collection('users').doc(userId).collection('products')
  .limit(20)
  .startAfter(lastVisible)
  .get();

分页场景下的实时更新可通过监听当前页的集合，或结合滚动加载逻辑实现。

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