Bangumi项目收藏页面搜索功能优化方案分析

背景

Bangumi是一款开源的番剧追番应用，在用户收藏管理模块中，当前搜索功能存在一定的优化空间。当用户在不同分类页面（如动画、书籍、游戏等）进行搜索时，系统未能智能识别当前页面类型并自动限定搜索范围，导致用户操作效率降低。

现状分析

当前实现中，收藏页面的搜索功能采用全局搜索策略，无论用户处于哪个分类子页面（动画/书籍/游戏等），搜索结果都会返回所有分类的匹配项。这种设计虽然保证了搜索的全面性，但在特定场景下会影响用户体验：

1. 当用户在"动画"分类页搜索时，期望结果应优先或仅显示动画类条目
2. 跨分类搜索结果可能导致无关内容干扰
3. 用户需要额外操作筛选结果，增加使用成本

技术实现方案

前端路由感知

应用可通过监听当前路由信息获取用户所在分类页面。典型的实现方式包括：

// 获取当前路由参数
const currentCategory = router.currentRoute.params.category

搜索条件动态绑定

在搜索组件中，需要将当前分类信息作为附加条件传递给API：

function handleSearch(keyword) {
  const params = {
    keyword,
    // 动态添加分类过滤条件
    ...(currentCategory && { category: currentCategory })
  }
  api.searchCollection(params)
}

后端API适配

后端接口需要支持可选分类参数：

router.get('/collection/search', (req, res) => {
  const { keyword, category } = req.query
  const query = { title: new RegExp(keyword) }
  if (category) query.category = category
  
  Collection.find(query)
    .then(results => res.json(results))
})

用户体验优化建议

1. 视觉反馈：在搜索框附近显示当前限定的分类范围
2. 切换机制：保留全局搜索的入口，如通过特殊符号或按钮切换
3. 结果排序：即使不严格限定分类，也可将当前分类结果优先展示
4. 历史记录：保存用户在各分类的独立搜索历史

技术考量

1. 性能影响：分类限定可减少数据库查询范围，提升搜索效率
2. 状态管理：需要在前端全局状态中维护当前分类上下文
3. 向后兼容：确保旧版本API仍能处理不带分类参数的请求
4. 异常处理：当分类参数非法时的降级处理方案

总结

通过实现基于上下文的智能搜索功能，可以显著提升Bangumi用户在收藏管理场景下的操作效率。这种情境感知的设计模式不仅适用于搜索功能，也可扩展至其他需要上下文关联的交互场景，是提升应用可用性的有效手段。