从设计和优化两个层面，请说明你如何构造一场高并发秒杀活动的用户侧系统？

回答思路

1. 【回答框架 1】秒杀前端核心策略是分层缓存与任务分离：静态资源（商品图、页面HTML）全部上CDN，用户进入页面先从本地缓存或内存读取按钮状态，避免直接请求商品详情接口；动态数据（库存、秒杀状态）通过WebSocket或长连接推送，减少轮询压力。
2. 【回答框架 2】关键链路要拆成异步任务：点击秒杀后先本地限制按钮置灰（防重复点击），同时发出一次请求，后端只做资格预扣，结果异步回传；前端把发起请求、等待结果、失败重试排成队列，配合loading与倒计时状态机，保证交互可感知且不阻塞。
3. 【回答框架 3】针对高并发下的首屏与交互性能，优先使用骨架屏、图片懒加载、请求合并，并利用HTTP/2多路复用与浏览器缓存策略；必要时在页面内做地域分片分发或Web Worker分流计算，降低主线程压力。
4. 【回答框架 4】风险与取舍：乐观更新会带来库存回滚展示误差，需以服务端最终状态为准；本地限频算法（如令牌桶）只防客户端误触，不能防脚本攻击，需配合指纹、验证码、风控后端与验签，前端不承担安全主责。
5. 【关键点 1】静态资源CDN化，动态状态用推送而非轮询。
6. 【关键点 2】秒杀请求异步化，队列化，防止阻塞与重复提交。
7. 【关键点 3】本地缓存与状态机保证交互流畅，最终一致以服务端为准。
8. 【关键点 4】前端防刷只能辅助，必须有后端验签与风控兜底。
9. 【关键点 5】性能优化以实际场景为据，如弱网与低端机必须覆盖。
10. 【易错点 1】不区分本地优化与真实瓶颈，盲目加缓存导致数据已过期。
11. 【易错点 2】只在前端限制按钮，忽略绕过页面的直接接口暴力请求。
12. 【易错点 3】误把前端幂等当成业务幂等，库存扣减等必须依赖后端唯一约束或去重。