前端技术文章
-
Web Components 的 adoptedCallback 只在自定义元素进入新的 Document 时触发。本文区分同文档换位、跨文档移动和 importNode 复制，并说明如何用 oldDocument、newDocument 与 ownerDocument 重绑文档相关资源。382 收藏 -
React Strict Mode 在开发环境会额外执行一次 useEffect 的 setup 和 cleanup，用来检查副作用是否可重复同步。本文区分开发与生产边界，并给出订阅、定时器和请求的清理写法。381 收藏 -
前端 WebSocket 需要把异常重连和页面离开分成两条路径：异常关闭采用带抖动的指数退避，pagehide 负责主动收尾，pageshow 再按 bfcache 状态恢复，避免定时器泄漏、重复连接和无休止重连。381 收藏 -
IntersectionObserver 的 scrollMargin 会扩展 root 内嵌套滚动容器的裁剪边界，适合处理轮播、虚拟列表和懒加载的提前观察。本文说明它与 rootMargin、threshold 的分工，以及重建观察器和兼容性回退方法。380 收藏 -
长列表不要让 ResizeObserver 覆盖所有组件。本文用 IntersectionObserver 控制可见范围，再用 requestAnimationFrame 和尺寸缓存合并通知，最后补上离开视口与组件卸载时的清理方式。373 收藏 -
CSS subgrid 的关键是让嵌套网格继承父级列或行轨道。本文从最小配置、轴向继承、网格线映射和隐式轨道四个方面，排查卡片与表单对不齐的常见原因。371 收藏 -
本文用 uploadId、固定分片索引和服务端状态对账实现前端大文件上传，讲清有限并发、XHR 暂停、失败重试、恢复补传及页面刷新后的续传协作方式。371 收藏 -
讲清 TypeScript satisfies、泛型返回值与 as const 的分工，用路由配置示例保留 kind 和 path 的字面量，并说明 readonly 与运行时校验边界。368 收藏 -
围绕 Vite import.meta.glob 的路径基准、字面量模式、默认懒加载、eager、import 与 query 选项，整理匹配为空和取值异常的排查方法。367 收藏 -
CSS :has() 的难点在匹配范围而不是语法。本文用复杂列表说明锚点元素、直接子代、任意后代、相邻兄弟与 :not() 的组合，并给出 @supports 降级和性能边界。367 收藏 -
用 container-type: inline-size 建立卡片查询容器，再通过 @container 和 container-name 按组件自身宽度切换单列与并排布局，覆盖嵌套容器、回退样式和验收边界。367 收藏 -
前端显示业务时间时，应保留后端时间点并显式传入用户IANA时区。本文给出Intl.DateTimeFormat复用写法、resolvedOptions检查和无偏移字符串处理边界。363 收藏 -
HTMLDialogElement 的 requestClose() 用于发起可拦截的关闭请求，close() 用于直接关闭。本文用事件顺序、returnValue 和兼容性代码说明两者的选择边界。363 收藏 -
TransformStream 会把下游的消费压力沿管道传回上游。本文用 pipeThrough、desiredSize 和 writer.ready 说明如何配置、判断并验证 Web Streams 背压。361 收藏 -
用列表底部哨兵讲清 IntersectionObserver 的 root、rootMargin 和 threshold 如何协同，补上请求锁、hasMore 标记以及自定义滚动容器的边界处理。360 收藏