前端技术文章
-
Web Worker 处理大数组时，可以把 ArrayBuffer 放进 postMessage 的 transfer list，移动内存所有权以减少结构化克隆复制。本文说明 TypedArray 与底层缓冲区的区别、byteOffset 元数据、发送后的 detached 状态、兼容降级和 SharedArrayBuffer 的边界。414 收藏 -
从主线程帧预算、滚动事件高频位置读取和观察器边界三个层面，说明怎样用 IntersectionObserver 控制 root、rootMargin、threshold，并通过回调去重与 unobserve 减少滚动监听抖动。477 收藏 -
用 fetch 获取流式响应时，ReadableStream 可以让页面边接收边处理。本文说明 response.body、getReader、TextDecoderStream、异步迭代和 AbortController 的组合方式，并列出 UTF-8 分片、流锁定和取消清理的边界。150 收藏 -
JavaScript fetch 可通过超时信号与用户取消信号组合控制等待。本文给出覆盖 JSON 响应体读取的封装与兼容写法，说明错误分类、资源清理和取消不等于服务端回滚的边界。100 收藏 -
CSS :has() 可以根据表单子控件的 valid 或 invalid 状态切换父级样式。本文给出字段容器写法、@supports 降级、直接子元素约束和选择范围边界，帮助前端减少简单状态联动脚本。214 收藏 -
Service Worker 只缓存同源静态资源时，关键是同时检查请求 origin 和 Request.destination，排除接口、页面导航与跨源资源，再用 Cache.match、fetch 和 Cache.put 组成缓存优先策略。本文还说明 HTTPS、localhost、作用域和缓存版本更新的排查边界。189 收藏 -
从 WebSocket close、readyState 和 CloseEvent 边界出发，给出带指数退避、随机抖动、重试上限和主动关闭保护的前端重连方案。278 收藏 -
Vue watch 深度监听要先区分对象替换与嵌套变更，再按范围选择精确 getter、deep: true、Vue 3.5+ 数值 deep 或 watchEffect，并处理旧值引用与异步清理。192 收藏 -
React useEffect 发起搜索请求时，旧请求可能晚于新请求返回并覆盖页面状态。本文用 cleanup 的 ignore 标记与 AbortController 两层边界处理竞态，并用可观察指标判断修复是否生效。107 收藏 -
Vite alias 在开发环境可用、Vitest 测试却失效时，优先检查绝对路径、vitest.config.ts 的配置层级、import 与 require 的差异，以及外部化依赖限制。483 收藏 -
说明Vite envPrefix的客户端暴露范围，给出双前缀迁移、公开配置集中读取和类型转换示例，并梳理模式目录、CI覆盖及构建期配置边界。161 收藏 -
从计算边界、消息协议、结构化克隆、ArrayBuffer 转移和生命周期五个方面说明前端如何把合适的计算移到 Web Worker，并给出错误处理与场景判断。121 收藏 -
读取 ArrayBuffer 的多字节字段时，DataView 的 offset、字段宽度和 littleEndian 参数必须与协议约定一致。本文用一个字节序读错的故障现场，说明如何定位、修复并封装 Uint16/Uint32 的读取规则。248 收藏 -
讲清前端用 ReadableStream 分块读取 Fetch 响应时的 reader、TextDecoder、done、异常、取消与锁定边界，给出可直接改造的 JavaScript 示例。380 收藏 -
说明 Vite 8 的 Baseline 固定日期、build.target 特殊值与显式浏览器数组的选择，区分语法转换、运行时 API、组件降级和 CSS 目标，整理升级时的兼容性决策。366 收藏