frontend-interview-playbook

Appearance

多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 ​

机制定位 ​

多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同。

  • 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同
  • 多标签页通信要解决的是同源页面之间的消息同步、一致性和资源共享问题
  • 关键不是 API 数量，而是消息时效、可靠性、广播范围和生命周期边界
  • 消息同步不等于状态一致性；冲突写入、顺序问题和页面恢复仍然需要业务协议层处理

参与者与职责 ​

  • 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同
  • 多标签页通信要解决的是同源页面之间的消息同步、一致性和资源共享问题
  • 关键不是 API 数量，而是消息时效、可靠性、广播范围和生命周期边界
  • 消息同步不等于状态一致性；冲突写入、顺序问题和页面恢复仍然需要业务协议层处理
  • storage 事件依赖 localStorage 变更触发，适合低频同步，但表达能力弱且不适合作为消息总线

关键流程 ​

  • 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同
  • 多标签页通信要解决的是同源页面之间的消息同步、一致性和资源共享问题
  • 关键不是 API 数量，而是消息时效、可靠性、广播范围和生命周期边界
  • 消息同步不等于状态一致性；冲突写入、顺序问题和页面恢复仍然需要业务协议层处理
  • storage 事件依赖 localStorage 变更触发，适合低频同步，但表达能力弱且不适合作为消息总线
  • BroadcastChannel 提供同源页面之间的显式广播通道，语义直接、实现简单，适合状态同步和通知

关键数据结构或调度关系 ​

  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 背后通常都有一组关键容器或调度关系，它们决定性能边界

容易误解的边界 ​

  • 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同
  • 关键不是 API 数量，而是消息时效、可靠性、广播范围和生命周期边界
  • 消息同步不等于状态一致性；冲突写入、顺序问题和页面恢复仍然需要业务协议层处理
  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 背后通常都有一组关键容器或调度关系，它们决定性能边界
  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 这类问题不能只背定义，更要分清它解决的对象、内部机制和工程取舍。 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同。 多标签页通信要解决的是同源页面之间的消息同步、一致性和资源共享问题。 storage 事件依赖 localStorage 变更触发，适合低频同步，但表达能力弱且不适合作为消息总线。 storage 更像副作用触发器，BroadcastChannel 是广播消息通道，SharedWorker 是共享执行上下文，三者层级不同。 登录态变更、主题切换、草稿同步、单实例播放控制和连接复用，都是多标签页通信的常见场景。 追问通常会沿着 缓存、存储、多标签页和进程模型 展开，重点在于把现象还原成系统行为

工程后果与调试抓手 ​

  • 多个标签页共享同源环境，但状态同步方式并不唯一，能力边界也不同
  • 多标签页通信要解决的是同源页面之间的消息同步、一致性和资源共享问题
  • 关键不是 API 数量，而是消息时效、可靠性、广播范围和生命周期边界
  • 消息同步不等于状态一致性；冲突写入、顺序问题和页面恢复仍然需要业务协议层处理
  • storage 事件依赖 localStorage 变更触发，适合低频同步，但表达能力弱且不适合作为消息总线

问答设计及延伸 ​

标准回答 ​

回答 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 时，先说明它在 浏览器 主链中解决的核心问题，再按参与者、流程阶段、关键数据结构和边界条件展开，最后落到性能、调试或架构后果。

追问拆解 ​

  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 与“浏览器存储：Cookie、localStorage、sessionStorage、IndexedDB 与配额边界”在主链中的职责分工
  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 与“页面生命周期与 bfcache：冻结、恢复与副作用管理”在主链中的职责分工
  • 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 与“认证模型：Session、Cookie、Token 与前端存储边界”在主链中的职责分工
  • 规模增大后最先暴露瓶颈的阶段
  • 行为异常时优先检查的参与者、阶段与数据结构

容易失分的点 ​

  • 只会背术语，不会解释流程顺序
  • 把机制和工程结果混成一层
  • 忽略边界条件，导致结论过度绝对

项目映射 ​

  • 结合一次真实问题说明 多标签页通信：storage、BroadcastChannel、SharedWorker 与一致性 如何帮助你定位 bug、性能问题或更新错序
  • 补充源码阅读或调试时看到的关键数据结构位置
  • 补充它和上下游模块的连接关系

相关主题 ​