-
前端上线后用户仍看到旧页面,通常不是重新部署失败,而是 HTML、静态资源缓存和 Service Worker 的更新边界没有分开。本文用一套可回滚的发布检查,讲清 Cache-Control、文件指纹、CDN 缓存刷新和浏览器验证如何配合。
-
批量导入 CSV 时,解析、校验和结果展示最好拆成可观测的前端流水线:主线程只负责触发与通知,Web Worker 分片处理数据,队列状态和失败原因由明确的质量门禁收口。
-
同一个后台系统开两个标签页时,登录态、筛选条件或草稿状态很容易互相覆盖。本文用 BroadcastChannel 搭一个可验证的同步层,处理消息去重、版本冲突、页面关闭和不支持时的降级边界。
-
CSS 的 height:auto 过去很难直接做平滑过渡。本文从 max-height 和 JavaScript 测量的旧方案切入,演示 interpolate-size: allow-keywords 的最小改造,并核对继承范围、浏览器降级与 prefers-reduced-motion 边界。
-
前端上传几百 MB 文件时,真正容易卡住的不是单个请求,而是分片队列、并发窗口和失败重试互相放大。本文用浏览器 File.slice、Promise 队列和服务端分片状态,拆解从一次性上传改成可暂停、可续传方案时的架构取舍。
-
原生 dialog 和 popover 关闭时直接消失,通常不是 opacity 写错,而是 display 的离散切换没有参与过渡。本文用一组不依赖框架的 CSS/HTML 示例,解释 @starting-style、display、overlay 与 transition-behavior 的配合方式,并给出旧浏览器的降级边界。
-
同一张商品卡片放进主栏、侧栏和弹窗后,不该继续按浏览器窗口宽度硬切布局。用 CSS 容器查询让组件根据自己的可用宽度切换网格、字号和按钮排列,并补上不支持时的降级写法。
-
商品卡片内容长短不一时,底部价格和按钮容易上下漂移。本文从实际错位现象入手,用 CSS Grid 的 subgrid 统一行轨道,并给出不支持 subgrid 浏览器的稳定降级写法。