-
本文用 color-mix() 从主题色生成浅色背景、强调色和透明层，说明 oklab、oklch、srgb 的选择差异、百分比归一化，以及用 @supports 保留纯色回退的写法。
-
通过双容器卡片示例，说明怎样从视口断点迁移到CSS容器查询，配置container-type与container-name，并处理祖先选择、尺寸包含和单列降级。
-
前端可以用 PerformanceObserver 读取 layout-shift 条目，再通过 value、hadRecentInput 和 sources 判断布局偏移是否与用户输入有关，并定位发生移动的元素。本文还说明调试累计值与正式 CLS 的边界。
-
用 PerformanceNavigationTiming 计算导航级 TTFB，区分 responseStart、requestStart 与最终响应时间，并处理 PerformanceObserver 的 buffered 场景。
-
说明IntersectionObserver按列表卡片可见面积比例加载内容的实现，区分threshold与rootMargin，并处理去重、降级和卸载后的异步清理。
-
前端组件同时监听 window、document 和局部 DOM 节点时，手动保存回调并逐个 removeEventListener 容易漏清理。本文用 addEventListener 的 signal 选项把多个监听器绑定到同一个 AbortController，在组件销毁时调用一次 abort() 统一回收，并说明 capture、once、passive 和已终止 signal 的边界。
-
用 navigator.locks.query() 读取 Web Locks 的 held 与 pending 快照，理解 name、mode、clientId，并处理安全上下文和异常边界。
-
前端多标签页同步主题、登录态提示或草稿状态时，可以监听 Window 的 storage 事件。本文从一个主题同步小组件出发，说明事件来源、关键字段、删除处理和 sessionStorage 的边界。
-
页面卸载时，fetch 加上 keepalive 可以让小型收尾请求继续发送，但它受未完成请求体总预算约束，不能替代大文件上传或可靠队列。本文给出 pagehide、UTF-8 字节计算、幂等事件 ID 和 sendBeacon 降级写法。
-
Response 的 body 是一次性消费的。本文从重复读取失败的现象出发，说明为什么要在第一次 json、text 或 blob 之前调用 response.clone()，并演示如何让业务分支与日志分支分别读取，同时提醒大响应体下的缓冲风险。
-
TypeScript 在 strict 模式下会把 catch 变量视为 unknown。本文从错误收窄、非 Error 抛出值和安全日志三个边界出发，给出可复用的处理函数。
-
滚动条从不出现变成出现时，经典滚动条会占用布局宽度。本文用 scrollbar-gutter 的 stable 与 stable both-edges 预留空间，并说明覆盖式滚动条、滚动容器边界和 @supports 降级策略。
-
TypeScript satisfies 可检查对象约束并保留成员形状，但不保证所有属性都是精确字面量。通过导航配置对比类型注解与 as const，说明可写范围、额外字段和运行时数据的处理区别。
-
用 anchor-name 声明触发元素，再用 position-anchor 与 position-area 建立浮层关系，并通过 anchor-scope 和 @supports 处理重复组件与兼容降级。
-
用 requestIdleCallback 把可拆分的非关键任务放进空闲窗口，结合 deadline、timeout 和降级策略控制主线程压力，并把 DOM 提交交给 requestAnimationFrame。
