《互联网产品的客户端架构·端形态与体验基础》7.1 请求编排与去重
从「回声」发现页首屏同时发出的十七个请求出发,把并发上限、优先级、取消、总预算与指数退避放进同一张调度表,给出可运行的 TypeScript 调度器与九个注入手动时钟的确定性测试,说明去重键、超时竞速与协作式取消的边界,并复盘一次无上限重试把弱网彻底拖垮的事故。
tag
从「回声」发现页首屏同时发出的十七个请求出发,把并发上限、优先级、取消、总预算与指数退避放进同一张调度表,给出可运行的 TypeScript 调度器与九个注入手动时钟的确定性测试,说明去重键、超时竞速与协作式取消的边界,并复盘一次无上限重试把弱网彻底拖垮的事故。
深链是外部世界进入客户端的唯一入口,也是最容易把用户带到空白页的地方。本节给出一个带版本、时间戳与状态白名单的 TypeScript 深链编解码器,按格式、时效、路由、权限的顺序恢复,并为过期、下线、坏状态与未登录分别设计兜底,最后复盘一次白屏事故。
返回键的行为不是 UI 细节,而是页面栈的公开契约。本节把 push、replace、back 三种操作与 Tab 切换、冷启动深链放进同一个 TypeScript 页面栈,说明为什么登录页不该留在历史里、深链进入后返回键该去哪,并复盘一次把用户困在登录页的线上事故。
从「回声」的订单详情页出发,把路由当成状态的投影:区分该进 URL、内存、本地存储与永远不该出现的四类状态,给出一个不依赖 DOM 的 TypeScript 解析器,覆盖参数校验、查询串归一化与规范 URL 生成,并复盘一次把草稿和令牌写进分享链接的事故。
用状态数量、禁止迁移、异步边界与副作用密度四个信号,判断一段状态该用状态机还是普通布尔标记;给出可运行的 TypeScript 判定函数与上传状态机,验证非法事件拒绝、重试上限与状态可达性,并用列表筛选和表单校验说明这条判据的反例边界,避免抽象过度或抽象不足。
把服务端状态从组件状态里拆出来,按价格、会话、内容流、详情与配置分别设定 ttl、stale 窗口与刷新模式,给出一个注入时钟、支持 stale-while-revalidate 与代际失效的 TypeScript 缓存,并用可运行测试验证过期、去重、前缀失效与旧响应回写拦截。
从「回声」客户端的筛选面板与草稿栏出发,把状态分成组件本地、跨页共享与服务端缓存三层,给出一个不依赖框架的最小订阅容器、选择器与不可变更新规则,用可运行的 TypeScript 测试验证订阅、退订与提升判据,并说明什么时候不该把状态提升到全局。
把视图不能直接访问数据层、领域不能反向依赖视图、模块之间不能有循环依赖写成可执行架构规则,给出 TypeScript 检查器、带原因的例外机制与失败样例报告,并用本机 Node 26 真实测试输出证明三条规则都能拦住真实违规,最后说明如何接进本地检查与 CI 门禁。
从模块图出发把依赖方向写成可判定规则:依赖只能指向内层,反向边必须在构建前失败。给出 TypeScript 实现的模块图模型、反向依赖检查、Tarjan 强连通分量循环检测与依赖优先构建排序,并用本机 Node 26 真实测试输出现场验证,最后讨论包边界、公开入口与类型依赖的落地方式。
把回声客户端的发现、会话、下单三个页面拆成视图、状态、领域、数据访问四层,逐条说明每层负责什么、明确不负责什么,用一段可运行的分层判定与调用审计代码暴露视图直连数据层、领域反向依赖视图、状态绕过领域三类越层,并给出本机 Node 26 真实测试输出与评审问题清单。
首屏快、功能全、包体小为什么无法同时满足,如何把三者的取舍写成可复核的权重与排序函数,并复盘一次「回声」客户端的真实取舍记录,说明排序结果与评审判断的边界;所有案例数值均标注为假设值,附完整可运行 TypeScript 实现与真实测试输出。
把首包、路由包、图片、字体与运行内存拆成可执行的预算条目,说明预算如何从目标设备与网络反推、如何在 CI 中以非零状态卡住,并给出不依赖文件系统的 TypeScript 体积与内存预算检查器、注入时钟的采样器、真实测试输出与一次预算失守的复盘。
从「回声」客户端的采样问题出发,拆解 FP、FCP、LCP、INP、TBT 五个指标各自回答什么、何时采样,用最近秩分位与 p75/p95 双线预算替代平均值判定,并给出可运行的 TypeScript 分位计算器、注入时钟的采样器与真实测试输出。
把团队规模、发布节奏、离线要求、性能敏感度与平台覆盖转成硬门槛加加权评分,用 TypeScript 选型函数输出排序、淘汰原因与决策记录,并以「回声」的默认事实演示 Web 胜出、桌面备选的完整推演,说明评分结果何时可信、何时必须重跑,以及组合策略的边界。
把同构与多端复用拆成领域模型、数据层、视图、导航、生命周期、输入与存储七层,用可运行的 TypeScript 分类器判定复用、适配与分叉,给出分叉率阈值与退出条件,并复盘一次强行统一导航的失败,说明复用为什么是一项需要成本口径与退出机制的经济决策。
把 Web、原生、小程序与桌面四种端形态拆成八项可判定能力,用一份 TypeScript 能力矩阵与测试固定「稳定支持、有条件支持、不支持」的边界,再复盘一次把小程序当成全平台方案的误判,说明能力矩阵为什么必须先于框架选型,避免团队用渠道优势掩盖能力缺口。
说明 echo-client-lab 为什么把可运行性分成 L1 纯逻辑、L2 进程内端到端、L3 本地服务三级,给出可运行的 TypeScript 分级器、本机 Node 26 的真实测试输出、代码块抽取与逐字节校验流程,并明确真机性能与真实浏览器渲染不在承诺范围内,避免把示例当成实测。
把「回声」客户端收敛成页面栈、请求去重与有上限缓存三个最小部件,先回答「状态放在哪」而不是「用哪个状态库」,给出可运行的 TypeScript 模型、快照恢复与真实测试输出,并附一份状态归属决策记录,说明第一个决定如何约束后面所有架构选择。
从「回声」的三类界面出发,把客户端架构与服务器架构的差别收敛成设备碎片化、网络不确定、生命周期被打断、分发不可回滚四个独有约束,给出可运行的 TypeScript 分类器与测试,并复盘一次把在线默认值带进离线场景的失败,说明端上判断为什么必须先于框架选型。
《互联网产品的客户端架构·端形态与体验基础》的完整目录与学习路径:13 章 39 节从端上约束、端形态与体验质量属性讲到分层、状态、路由、数据、组件、构建、渲染、错误与观测,附实验工程、三条阅读路径、数字与版本口径,以及读完卷一应能回答的六个问题。