前端技术文章
-
区分 CSS Grid 轨道最小值与卡片内容溢出，比较固定列和自动换列的 minmax 写法，并用简明代码说明 min-width、长文本换行与代码块滚动的处理层级。422 收藏 -
前端已经发布新代码，浏览器却仍加载旧 JS，通常不是缓存策略一个开关的问题，而是入口 HTML、资源哈希和上传顺序没有形成闭环。本文用一个可复查的发布流程拆开判断。421 收藏 -
IndexedDB 的 readwrite 事务不是可以任意 await 的长连接。本文解释请求回调、事件任务与自动提交的关系，并给出连续写入、跨异步边界拆分事务和提交结果判断的实用写法。419 收藏 -
文章 · 前端 | 2个月前 | 前端 · javascript · Service Worker CacheStorage Cache API caches.open caches.match caches.delete
用 Cache API 为离线资源建立版本化缓存，覆盖 caches.open、cache.addAll、caches.match 与 caches.delete 的协作方式，并处理新版本缓存失败、旧缓存清理和网络回退边界。418 收藏 -
从登录状态、编辑草稿和多窗口协作三个场景出发，对比 BroadcastChannel、localStorage 的 storage 事件与 SharedWorker 的消息路径，给出选择边界和可验证的最小实现。418 收藏 -
Service Worker 的 fetch 事件不是所有请求都适合缓存。本文用同源、GET、路径和请求意图四个条件建立绕过清单，给出静态资源缓存、动态接口放行和旧缓存清理的最小实现。418 收藏 -
Promise.withResolvers 适合回调触发位置与 Promise 创建位置分离的场景，例如事件监听器、消息队列、流和 SDK 外部回调。本文用一个带缓冲和清理能力的异步队列说明正确封装方式，并列出不适合使用 deferred 的边界。418 收藏 -
Vite Environment API 用命名环境承载浏览器、Node 和 Edge 的差异。本文用配置示例说明顶层继承、optimizeDeps 边界和渐进迁移方法。418 收藏 -
AbortController 的 AbortSignal 是一次性信号，调用 abort 后不能恢复。本文用请求切换场景解释为什么复用旧控制器会让新请求立即取消，并给出每次请求新建控制器、取消旧请求和防止旧响应覆盖新结果的生产写法。418 收藏 -
本文详解如何正确实现递归函数，用于检测由 QuestionModel 和 ResponseModel 两类对象嵌套构成的 JSON 结构中，每一层级内是否存在重复的 label 值，并修复原逻辑中因过早 return 导致递归提前终止的缺陷。 这段内容主要讲清楚一件事：怎样把递归函数写对，用来检查由417 收藏 -
滚动条从不出现变成出现时，经典滚动条会占用布局宽度。本文用 scrollbar-gutter 的 stable 与 stable both-edges 预留空间，并说明覆盖式滚动条、滚动容器边界和 @supports 降级策略。417 收藏 -
CSS 容器样式查询可以用 @container style() 读取父容器上的自定义属性。本文用 card-mode 示例说明无值和值匹配、继承、计算值、@property、命名容器、尺寸组合和兼容降级。414 收藏 -
Web Worker 处理大数组时，可以把 ArrayBuffer 放进 postMessage 的 transfer list，移动内存所有权以减少结构化克隆复制。本文说明 TypedArray 与底层缓冲区的区别、byteOffset 元数据、发送后的 detached 状态、兼容降级和 SharedArrayBuffer 的边界。414 收藏 -
Vite 的 import.meta.env 主要在开发服务器启动或生产构建阶段读取并静态替换，浏览器运行时不能直接改写已经打包的值。本文解释构建期配置与运行时配置的边界，并给出外置 config.js 的落地方式。413 收藏 -
跨文档 View Transitions 不是给单页应用换皮：当前页和目标页要同源并同时用 @view-transition 选择加入，元素命名还要避免冲突。本文从多页站点导航现场出发，给出最小接入、滚动位置处理、浏览器降级和上线验收清单。412 收藏