局部滚动容器内使用position: fixed必抖，因定位基准被截断在局部上下文而非视口，浏览器反复修正导致高频跳动；应将其移出容器挂至body，或用sticky替代，或以transform+requestAnimationFrame模拟固定效果。
局部滚动容器里加 position: fixed 必抖
微信小程序的 scroll-view、Vue 的 el-scrollbar、或任意设置了 overflow: auto 的 div，只要内部有 position: fixed 元素，就会高频跳动。原因很直接：fixed 本该相对于视口定位，但被截断在局部滚动上下文里，浏览器反复修正位置，视觉上就是“一卡一跳”。
解决办法只有三个，按优先级排列：
- 把
position: fixed元素整个移出滚动容器，挂到document.body下（最干净） - 用
position: sticky替代（注意 iOS Safari 对sticky在局部滚动内支持不稳定，IE 完全不支持） - 必须保留在容器内时，改用
transform: translateY()+requestAnimationFrame模拟固定效果，监听滚动偏移手动同步
getBoundingClientRect() 在 scroll 回调里调太勤会真卡
不是“看起来卡”，是每次调用都强制同步重排（reflow）。比如在 window.addEventListener('scroll', ...) 里循环读 10 个元素的 offsetTop，等于触发 10 次 layout，主线程直接堵死。
正确写法是“读写分离”：
立即学习“前端免费学习笔记（深入）”；
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 所有尺寸读取放在回调开头一次性做完：
const rect = el.getBoundingClientRect(); const { top, height } = rect; - 避免在循环中穿插读写：
els.forEach(el => { el.style.top = rect.top + 'px'; })是错的；应先els.map(el => el.getBoundingClientRect())收集全部数据，再统一写样式 - 写样式时优先用
el.style.cssText或Object.assign(el.style, { transform: 'translateY(50px)' })，减少 layout 触发次数
局部滚动容器没设 overflow-anchor: none 会动态插入内容时跳
当列表加载更多、折叠区块展开、或富文本动态渲染时，页面突然往上/往下“弹一下”，大概率是浏览器默认的滚动锚定机制在作祟——它试图保持当前可见区域“锚点”不变，结果反而导致跳动。
这个行为只对有滚动能力的容器生效，所以：
- 必须给实际滚动的容器加：
.list-container { overflow-y: auto; overflow-anchor: none; } -
overflow-anchor: none对body或未溢出的元素无效 - 如果父容器也设了
overflow-anchor: auto（显式或默认），且它是真正滚动的根容器，那子容器上的none就会被覆盖——得一起设 - Chrome 82+ / Edge 88+ 支持，Firefox 和 Safari 当前完全不支持，别指望跨浏览器一致
全局滚动条显隐导致宽度突变，局部滚动也救不了
很多人以为“我把可滚动区域限定在 main 里，body 就不会抖”，其实错得很典型。只要 html 元素没锁死 overflow-y: scroll，body 宽度仍会因滚动条出现/消失而突变（通常 ±15px），所有依赖 100% 宽度、margin: 0 auto 或 flex 居中的元素都会重排。
两种务实解法：
- 最简单粗暴：
html { overflow-y: scroll; }—— 锁死宽度，滚动条常驻（Safari zoom 下偶有微调，可加margin-left: -webkit-scrollbar补偿） - 设计不允许常驻滚动条时，改用
padding-left: calc(100vw - 100%)补齐滚动条宽度空缺，但只对直接子元素有效，嵌套层级深了容易漏 - 千万别对
body设overflow-y: scroll，否则可能触发双滚动条
真正难处理的抖动，往往来自第三方组件库在 mounted 或 onLoad 里偷偷调用 clientHeight、getBoundingClientRect()，这种抖动藏得深，得靠 Chrome DevTools 的 Performance 面板看 Layout 事件密度才能揪出来。
