前端技术文章
-
文章 · 前端 | 2个月前 | 浏览器 · javascript · scheduler.postTask Prioritized Task Scheduling TaskController 前端任务调度
用 scheduler.postTask 把用户可见工作与后台任务分开，讲清优先级、TaskController 取消、能力检测和不支持时的 setTimeout 降级边界。372 收藏 -
介绍JavaScript HTMLTemplateElement.content的重复实例化方法，用importNode深复制保留模板原件，解释片段插入后的节点移动、事件绑定和重复id处理。372 收藏 -
文章 · 前端 | 2个月前 | 前端 · 性能优化 · javascript · JavaScript ArrayBuffer structuredClone Web Worker transfer
把 ArrayBuffer 交给 Web Worker 或异步校验流程时，structuredClone 默认会复制数据；在 transfer 中传入原始 buffer 才会转移底层资源。本文用 byteLength 和失败分支验收转移后的状态，并说明 DataCloneError 与旧环境降级边界。371 收藏 -
CSS subgrid 的关键是让嵌套网格继承父级列或行轨道。本文从最小配置、轴向继承、网格线映射和隐式轨道四个方面，排查卡片与表单对不齐的常见原因。371 收藏 -
本文用 uploadId、固定分片索引和服务端状态对账实现前端大文件上传，讲清有限并发、XHR 暂停、失败重试、恢复补传及页面刷新后的续传协作方式。371 收藏 -
讲清 TypeScript satisfies、泛型返回值与 as const 的分工，用路由配置示例保留 kind 和 path 的字面量，并说明 readonly 与运行时校验边界。368 收藏 -
React Suspense 遇到多个独立数据源时，关键不是把所有请求都塞进一个组件，而是提前并行创建稳定的 Promise，再按内容块设置 Suspense 边界。本文说明请求瀑布的成因、缓存读取、依赖顺序、刷新和错误处理。368 收藏 -
DocumentFragment 插入页面前可以直接使用 querySelector、querySelectorAll 和 getElementById 查询内部元素。关键是把查询放在片段仍持有子节点时，并理解插入后片段会被清空、已取得的元素引用仍然有效。368 收藏 -
围绕 Vite import.meta.glob 的路径基准、字面量模式、默认懒加载、eager、import 与 query 选项，整理匹配为空和取值异常的排查方法。367 收藏 -
CSS :has() 的难点在匹配范围而不是语法。本文用复杂列表说明锚点元素、直接子代、任意后代、相邻兄弟与 :not() 的组合，并给出 @supports 降级和性能边界。367 收藏 -
用 container-type: inline-size 建立卡片查询容器，再通过 @container 和 container-name 按组件自身宽度切换单列与并排布局，覆盖嵌套容器、回退样式和验收边界。367 收藏 -
Alpine.js 修改响应式数据后如何等 DOM 更新？本文用回调式和 Promise 式 $nextTick 说明读取文本、测量尺寸、聚焦元素的正确时机，并划清请求完成与浏览器布局的边界。367 收藏 -
WebSocket 断线后，如果每个页面都立即重连，网络抖动会迅速变成重连风暴。本文从连接状态、指数退避、随机抖动和页面可见性恢复入手，给出一套可观察、可停止、能回滚的前端重连方案。366 收藏 -
用 CSS @scope 给卡片组件划定样式边界，讲清嵌套 scope、to() 限制、scoping proximity 与不支持浏览器的降级检查。366 收藏 -
content-visibility:auto 可以跳过屏幕外内容的绘制，但尺寸估计不准时会让滚动条和滚动位置抖动。本文用 contain-intrinsic-size、auto 记忆尺寸和渐进校验拆开性能收益与布局稳定性的取舍。366 收藏