为什么固定元素会减慢 Firefox 中的滚动速度？
为什么应用了 CSS position:fixed 的元素会导致 Firefox 在滚动其所在页面时占用 100% CPU？ 有什么解决方法吗？
我在一些网站上注意到了这种行为，例如 StackOverflow 页面顶部的通知栏。 我正在使用 Linux，以防万一。
Why do elements with the CSS position: fixed applied to them cause Firefox to eat 100% CPU when scrolling the page they are in? And are there any workarounds?
I've noticed this behavior on a few sites, for example the notification bar at the top of the page on StackOverflow. I'm using Linux in case that matters.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（6）
这是错误#201307。
This is bug #201307.
该网站有一个固定元素“第一次使用 Stack Overflow？查看常见问题解答！”，并且在 Firefox 中速度非常慢。 但与 Opera 和 Chrome 配合使用效果更好。
FF3、Windows XP、ATI。
This website has a fixed element "First time at Stack Overflow? Check out the FAQ!", and it's slow as hell in firefox. Works better with Opera and Chrome though.
FF3, Windows XP, ATI.
如前所述，这是错误 #201307。 解决方法是禁用平滑滚动：
编辑 -> 首选项 -> 高级-> 常规选项卡 -> 取消选中“使用平滑滚动”
As already stated, this is bug #201307. The workaround is to disable smooth scrolling:
Edit -> Prefrences -> Advanced -> General tab -> uncheck "Use smooth scrolling"
这是 bugzilla 中报告的错误，
显然是一种解决方法（成功的报告不一） ..) 是禁用平滑滚动
It's a bug reported in bugzilla
Apparently a work-around (with mixed reports of success..) is to disable smooth-scrolling
您确定这里有直接链接吗？ 您是否创建了一个包含固定元素的静态 HTML 页面来验证您的理论？ 考虑到这些 CSS 属性的使用范围有多广泛，我认为无论您运行什么浏览器/操作系统，其他人现在都会注意到它。
Are you sure that there's a direct link here? Have you created a static HTML page with fixed elements to verify your theory? Given how widely these CSS properties are used, I'd think someone else would have noticed it by now, whatever browser/OS you're running.
它会消耗 CPU，因为浏览器必须在每次滚动更改时重新绘制整个视口，而不仅仅是新的可见区域
it eats CPU because the browser has to repaint the entire viewport every scroll change rather than just the newly visible area