前端技术文章
-
本文介绍多种可靠方式判断字符串首字符是否为数字（0–9），重点解决正则误判、空字符串边界问题，并提供简洁高效的替代方案。 本文介绍多种可靠方式判断字符串首字符是否为数字（0–9），重点解决正则误判、空字符串边界问题，并提供简洁高效的替代方案。在 Ja vaScript 里，如果要判断一个字符串（比如116 收藏 -
围绕 Vue watchEffect 的异步副作用清理时机，说明 onCleanup 与 onWatcherCleanup 的注册位置、重跑前清理和旧请求写回边界，给出可取消请求的实用写法。116 收藏 -
本文用一个可伸缩组件场景说明 ResizeObserver 的 contentBoxSize、borderBoxSize 和 contentRect 如何选择，并给出数组形态、旧实现回退与组件销毁处理方式。114 收藏 -
Server Actions 的输入校验不能停留在浏览器表单约束。本文从 FormData 解析、字段白名单、服务端授权、预期错误、异常与幂等副作用五个边界说明如何设计可靠的输入处理。114 收藏 -
从几何边界、alpha/luminance 和交互区域三个角度，对比 SVG clipPath 与 mask 的透明度处理，给出可直接改写的最小示例。114 收藏 -
Vite 8.1 已使用 Rolldown 与 Oxc。本文比较直接升级、rolldown-vite 过渡和兼容层兜底，说明如何从配置警告与插件挂载位置判断迁移风险。112 收藏 -
本文用搜索列表案例拆分 React 中必须立即响应的交互状态与可中断的后台渲染，说明 useTransition、isPending、受控输入、异步更新和 Suspense 的正确边界。112 收藏 -
文章 · 前端 | 1星期前 | 兼容性 · CSS animation-timeline timeline-scope Scroll-driven Animations scroll-timeline-name
CSS timeline-scope 可以扩大命名滚动时间线的作用域，让不在同一滚动容器后代树中的动画元素引用同一个时间线。本文用一个小型结构说明默认边界、共同祖先配置、@supports 降级和匿名时间线的区别。112 收藏 -
中文搜索框不能靠空格切词。本文用 JavaScript Intl.Segmenter 的 word 粒度保留 segment、index 与 isWordLike，再把字符位置映射到高亮范围，处理中文、英文和表情符号的边界。111 收藏 -
用 CSS :has(> ...) 让卡片只响应直接子元素的状态，理解后代匹配与直接子代匹配的差异，并处理多个状态、优先级和组件边界。111 收藏 -
Vite 默认只把 VITE_ 开头的环境变量暴露给客户端，因为浏览器代码会在构建时拿到这些值。本文解释前缀的安全边界、.env 模式优先级、字符串类型和 envPrefix 配置，并给出变量不生效时的排查路径。111 收藏 -
scheduler.yield 能把主线程长任务切成多个 continuation，并在 postTask 内继承优先级。本文给出时间预算切片、取消处理与兼容降级的完整写法。110 收藏 -
JavaScript Iterator Helpers 可以把 filter、map、take 等操作组合成惰性处理链。本文用可运行配方解释何时取值、怎样提前停止，以及一次性消费与兼容性边界。110 收藏 -
围绕 Web Worker 二进制消息传递，解释 ArrayBuffer 所有权、TypedArray 视图与 transfer 列表，提供往返示例及子视图、异常和在途任务的处理方法。110 收藏 -
在 Vite 项目里，使用 ?worker 导入得到的是 Worker 构造器，而不是普通模块对象。本文用一个最小的 TypeScript 示例说明 worker 文件、消息协议、?worker&inline、?sharedworker 与 vite/client 类型提示的关系，并整理部署和生命周期中的常见误区。110 收藏