每日整理真实提问 356 个问题 · 726 个回答 需要系统性的技术文档?看 Shopify 技术百科 1000 篇 → 400-873-8117
已解决 提问于 16 天前

搜索联想很慢,输入卡顿

2 个回答 1,840 次浏览 性能与 Core Web Vitals 最后活跃 12 天前
66

搜索框输入时每次按键都发请求,服务端压力大,前端也卡。

陈
陈工提问者
Shopify 认证开发者 · 专注主题与 Liquid
16 天前提问 · 已收到 2 个回答

2 个回答

已采纳 · 提问者确认解决
55

先把判断放在前面:缺少防抖与请求取消,按键密集时请求堆积。

1处理顺序

  1. 加 250ms 防抖,输入停顿后再请求。
  2. 用 AbortController 取消上一次未完成的请求。
  3. 结果做本地缓存,重复前缀直接命中。
  4. 限制返回条数与字段,减小响应体。
  5. 键盘上下选择时不要触发新请求。
验收:输入流畅,请求数量下降 80% 以上。
风 风格技术团队 回答于 15 天前
3

搜索联想是「用户感知速度」的关键点。即使后端慢,先本地过滤已有结果再请求,体验也会好很多。

泽 阿泽 · 前端工程师 · 14 天前

你的处理方式是什么?

写下你实际验证过的步骤,比「我也有这个问题」有用得多。当前版本为静态展示,提交后会由团队整理并回复。

描述你遇到的现象、店铺环境(主题 / 套餐 / 应用)、已经试过哪些操作……
我要单独提问 工作日 10 分钟内回复,可直接加微信 fenggejishu