前端技术文章
-
用 BroadcastChannel 广播登录、退出和会话失效信号，让多个同源标签页及时刷新登录状态；同时说明 storage 事件降级、消息去重、首屏初始化和令牌安全边界。243 收藏 -
calc-size() 可以把 max-content 当作固有尺寸基准，再用 size + 固定长度表达最终宽高；本文说明 fallback、@supports、百分比边界，以及它与 interpolate-size 的分工。243 收藏 -
讲清 JavaScript Element.getAnimations 的默认范围、subtree 参数、伪元素筛选和 finished Promise 用法，帮助组件在动画结束后安全清理。243 收藏 -
围绕 Astro ClientRouter 的页面交换生命周期，说明如何在 astro:after-swap 后把焦点移到新页面主标题或稳定入口，并区分持久元素焦点保留与普通路由焦点重置。240 收藏 -
文章 · 前端 | 5天前 | 前端 · 性能 · javascript · ReadableStream Web Streams highWaterMark desiredSize backpressure 前端流式读取
前端流式读取失控，通常不是把 chunk 存进数组就能解决。本文用 ReadableStream 的 desiredSize、highWaterMark 与串行 read 建立有界消费，并说明取消、异常和 TransformStream 的清理边界。239 收藏 -
用 Angular afterNextRender 的 read 阶段读取首次渲染后的 DOM 尺寸，说明 viewChild、SSR、hydration、读写分离，以及何时需要 ResizeObserver。239 收藏 -
用 SVGTextContentElement 的 getSubStringLength 测量指定字符区间，用 getComputedTextLength 测量整段文本，并说明字距、x 属性和索引边界对结果的影响。237 收藏 -
React createPortal 只改变 DOM 挂载位置，点击事件仍按 React 树向逻辑父组件冒泡。本文用最小示例说明定位方法、阻断位置和组件边界取舍。237 收藏 -
本文用 color-mix() 从主题色生成浅色背景、强调色和透明层，说明 oklab、oklch、srgb 的选择差异、百分比归一化，以及用 @supports 保留纯色回退的写法。236 收藏 -
document.fonts.load 可按字体家族、字重和文本等待匹配字体集合。本文对比 load、ready 与 check，提供标题字体等待及超时处理示例，并解释空数组、字形覆盖与迟到请求的边界。235 收藏 -
CSSNumericValue 可以把带单位的 CSS 数值统一到可判断、可转换的对象模型中。本文从 CSSUnitValue 出发，讲清 type()、to() 的使用边界、异常处理以及旧浏览器回退策略。234 收藏 -
Path2D.addPath 可以把可复用路径按 DOMMatrix 加入目标路径。本文说明怎样用一个矩阵同时表达缩放、旋转与平移，并区分路径级变换和 Canvas 上下文变换。233 收藏 -
围绕 CSS Anchor Positioning 浮动提示框跟随目标元素这一任务，说明 anchor-name、position-anchor 与 anchor() 的最小写法，并处理重复组件作用域、视口边缘回退和不支持环境的降级方案。233 收藏 -
使用Vue 3.5+ onWatcherCleanup同步注册AbortController清理，取消watch中的过期fetch请求，并统一保护结果、错误和loading状态，附旧版本onCleanup写法。232 收藏 -
FormData 的重复字段不能按普通对象处理。本文用 append、getAll、entries 和 set 的对比，说明如何读取同名值、保留完整提交顺序，并避开 get 或 Object.fromEntries 导致的丢值问题。232 收藏