前端技术文章
-
Vite 依赖预构建异常时，先区分 node_modules/.vite 文件系统缓存和浏览器强缓存，再用日志、Network 和 --force 选择最小恢复动作。236 收藏 -
本文用 color-mix() 从主题色生成浅色背景、强调色和透明层，说明 oklab、oklch、srgb 的选择差异、百分比归一化，以及用 @supports 保留纯色回退的写法。236 收藏 -
用原生 Popover API 做一个可访问的无 JavaScript 弹出层，覆盖 popover、popovertarget、light dismiss、焦点行为与不支持浏览器的降级方案。235 收藏 -
document.fonts.load 可按字体家族、字重和文本等待匹配字体集合。本文对比 load、ready 与 check，提供标题字体等待及超时处理示例，并解释空数组、字形覆盖与迟到请求的边界。235 收藏 -
从输入组件重构案例说明为什么不应默认把 DOM Event 传到业务层，并给出语义回调、原生事件保留边界、TypeScript 示例和测试判断清单。234 收藏 -
CSS Anchor Positioning 用 position-try 配置浮层回退位置，本文从最小写法、自定义 @position-try、优先级和兼容性边界说明如何避免 tooltip 溢出视口。234 收藏 -
CSSNumericValue 可以把带单位的 CSS 数值统一到可判断、可转换的对象模型中。本文从 CSSUnitValue 出发，讲清 type()、to() 的使用边界、异常处理以及旧浏览器回退策略。234 收藏 -
模板字面量类型基于字符串字面量类型构建，支持通过插值生成新的字符串类型。 这让 TypeScript 能够对字符串进行更精确的类型检查，适用于事件名、路径、类名等场景。 模板字面量类型工作原理 输入类型 type Event = "click" | "focus" type Method = "ge233 收藏 -
文章 · 前端 | 2个月前 | javascript · Web Components Custom Elements attributeChangedCallback observedAttributes
attributeChangedCallback 不触发时，先检查 observedAttributes 是否监听了正确的 attribute，再确认代码改的是 DOM attribute 而不是只改 JavaScript property。本文用最小示例说明属性反射、初始值和回调重渲染的边界。233 收藏 -
Path2D.addPath 可以把可复用路径按 DOMMatrix 加入目标路径。本文说明怎样用一个矩阵同时表达缩放、旋转与平移，并区分路径级变换和 Canvas 上下文变换。233 收藏 -
围绕 CSS Anchor Positioning 浮动提示框跟随目标元素这一任务，说明 anchor-name、position-anchor 与 anchor() 的最小写法，并处理重复组件作用域、视口边缘回退和不支持环境的降级方案。233 收藏 -
本文介绍一种基于递归的 TypeScript 方法，为具有双向嵌套关系（QuestionModel 与 ResponseModel 互相引用）的 JSON 数据自动添加符合路径语义的 id 字段，确保每个节点 ID 唯一、可读且反映其在树中的完整位置。 这段内容要讲的，其实是一种基于递归的 Type232 收藏 -
使用Vue 3.5+ onWatcherCleanup同步注册AbortController清理，取消watch中的过期fetch请求，并统一保护结果、错误和loading状态，附旧版本onCleanup写法。232 收藏 -
FormData 的重复字段不能按普通对象处理。本文用 append、getAll、entries 和 set 的对比，说明如何读取同名值、保留完整提交顺序，并避开 get 或 Object.fromEntries 导致的丢值问题。232 收藏 -
前端用 fetch 下载文件时，读取 Content-Disposition 中的 filename* 或 filename，再结合 Blob URL 和 a.download 保留后端文件名；跨域场景还要暴露响应头。231 收藏