前端技术文章
-
Vue 3 中直接解构 reactive 对象的 primitive 属性会断开响应式连接。本文用排障手册的方式解释原因，并给出 toRefs、toRef 与保留 state.field 三种处理选择。496 收藏 -
Import Maps 可以把浏览器模块中的相对路径统一成稳定别名。本文从 imports、路径前缀、scopes 和加载顺序入手，给出可迁移的 HTML 示例与回归清单。486 收藏 -
Service Worker 更新并不等于页面立即切换。本文用 skipWaiting、clientsClaim 和 controllerchange 说明如何控制新 Worker 的激活与页面接管时机，避免新旧缓存混用。486 收藏 -
浏览器后台标签页可能延迟定时器，直接用客户端心跳时间判断 WebSocket 存活容易误报。本文说明如何结合 visibilitychange、应用层 ping/pong、服务端确认和退避重连，避免页面恢复时重复连接。483 收藏 -
IndexedDB 升级应在 onupgradeneeded 中按 oldVersion 累计迁移。本文用独立演示库说明跳版本结构变更、事务活性与失败回滚，并区分回调结束和打开成功。483 收藏 -
解释 CSS :has() 与 :is() 组合时参数选择器如何参与优先级计算，说明为什么后写的规则仍可能失效，并给出用 :where()、拆分选择器和级联层恢复可维护覆盖关系的方法。474 收藏 -
Background Sync 适合把离线表单的发送时机交给 Service Worker，但它不是本地存储。本文用 IndexedDB outbox、唯一同步标签和失败保留策略，整理一套可回退的延迟提交方案。463 收藏 -
文章 · 前端 | 6天前 | javascript · AbortController AbortSignal.any AbortError TimeoutError AbortSignal reason
AbortSignal.any 会把首个触发源的 reason 原样传给组合信号。本文用 TimeoutError、AbortError、自定义 reason 和来源记录器区分超时与手动取消，并说明竞态与兼容边界。447 收藏 -
TypeScript NoInfer 用于拆分泛型推断与参数约束，本文通过数组、默认值和配置对象示例说明如何保持调用方的显式类型选择，并列出版本与回归边界。443 收藏 -
从首屏内容、渐进增强、脚本时序和兼容降级四个约束出发，比较 Declarative Shadow DOM 与客户端 attachShadow 的职责边界，并给出可复用的 Web Component 初始化写法。440 收藏 -
WebTransport 的双向流和 Datagram 都能承载实时数据，但可靠性、顺序性和消息边界完全不同。本文用一个实时面板的取舍场景说明两者适合什么数据，并给出可靠流的 framing 写法与兼容检查清单。440 收藏 -
开启 TypeScript noUncheckedIndexedAccess 后，数组下标读取会带上 undefined。本文按规则、循环、索引判断和迁移边界说明怎样选择 for-of、边界检查、默认值与非空断言。435 收藏 -
Cache API 的匹配不是简单的路径字符串比较。本文围绕 Cache.match() 说明 URL、请求方法、Vary 请求头和匹配选项怎样共同决定缓存条目，并给出带命中率记录的完整 Request 示例。432 收藏 -
用Lit组件示例区分attribute命名、类型转换和property反射，说明camelCase默认映射、布尔attribute语义及对象属性入口，帮助组件作者为HTML和JavaScript调用方设计清晰接口。429 收藏 -
Lit 的 updateComplete 适合等待当前组件完成一次响应式更新，但默认不等待子组件。本文从事件派发、DOM 测量和测试三个场景说明使用方式，并比较 getUpdateComplete、requestAnimationFrame 与 ResizeObserver 的边界。425 收藏