前端技术文章
-
IntersectionObserver 回调频繁触发不等于请求必须重复。本文从首次 observe、threshold 穿越和 entries 批量回调说起，用元素级 loading/done 状态、rootMargin 与 unobserve 设计稳定的懒加载去重方案。154 收藏 -
WebSocket close code 1006 不是服务端发送的关闭原因，而是浏览器在没有收到 Close 帧时给出的异常关闭表示。本文用 CloseEvent、代理日志和服务端日志三层证据定位断开位置。154 收藏 -
当多个嵌套组件必须沿用同一组父网格轨道时，CSS subgrid 可以避免重复定义列宽和行高。本文通过卡片与表单场景说明 subgrid 的写法、gap 和隐式轨道边界，以及如何保留独立 grid 回退。147 收藏 -
讲清 IntersectionObserver 的 root、null、祖先关系、rootMargin 与 threshold，并用 rootBounds 和检查表定位滚动容器中不触发的问题。144 收藏 -
用 Vue Router 的 scrollBehavior 区分新导航、浏览器前进后退、hash 锚点和异步内容，配置固定头部偏移并排查滚动位置恢复异常。133 收藏 -
Service Worker 更新后旧缓存不消失，通常是新旧 worker 共存和缓存未版本化造成的。本文用 install、activate、event.waitUntil 和受限删除名单设计可回退的版本清理方案。127 收藏 -
用 AbortController 和 AbortSignal.timeout 为 Fetch 设置超时，区分 TimeoutError、AbortError、HTTP 状态和普通网络错误，并给出兼容回退写法。108 收藏 -
复杂组件更新时，CSS contain 可以把布局、绘制、样式或尺寸计算限制在子树内。本文说明 layout、paint、size、content 的边界，解释定位和溢出副作用，并给出 contain-intrinsic-size 的实用写法。107 收藏 -
IntersectionObserver 观察列表底部时反复触发，通常源于初始通知、相交状态变化与分页请求状态混在一起。本文用 loading、hasMore、nextCursor 和 unobserve 组合，避免同一页重复请求。106 收藏