jquery IE 8 中的滚动性能最高

发布于 2024-10-06 22:24:10 字数 635 浏览 0 评论 0原文

我正在使用 jQuery .scrollTop 在 div 中滚动图像。它在 Firefox 中运行得很好 - 滚动非常流畅和快速。在 IE 8 中,滚动非常缓慢且不稳定 - 图像大约一秒滚动一次 - 两秒。图像大小平均在 2000 * 2000 到 4000 * 4000 像素之间。

IE 8 有没有办法改进这个?

IE 7 中的性能稍好一些,但仍然不够好。

谢谢

编辑:我认为问题在于 IE 7 和 8 中如何实现滚动。我启用了两个滚动条(overflow-x 和 Overflow-y),并且我尝试滚动使用这些滚动条的图像。问题完全一样。我尝试在一台性能相当低的 PC 上运行这个程序 - 几年前的奔腾双核(2 GB RAM)以及带有 2.8GHz CPU 1600Mhz RAM 的 Core i7 台式机,结果几乎相同。 FireFox 的滚动速度要快得多,但其 CPU 使用率平均比 IE 高 10%。这让我很困惑……微软现在肯定已经解决了这个问题吗?

我发现的另一件有点奇怪的事情是,在 Core 2 Duo 笔记本电脑上滚动速度更快。我想知道这是否与显卡驱动程序有关...IE 7/8 甚至使用 GPU 吗?

如果这听起来很愚蠢,请原谅,但我真的很想解决这个问题......IE 不会那么糟糕......

I'm using jQuery .scrollTop to scroll image within a div. It works great in Firefox - scrolling is very smooth and fast. In IE 8 scrolling is very slow and glitchy - image scrolls once in about a second - two seconds. Image size is on average between 2000 * 2000 and 4000 * 4000 pixels.

Is there a way to improve this for IE 8?

Performance in IE 7 is slightly better, but still not good enough.

Thank you

Edit: I believe that an issue is in how scrolling is implemented in IE 7 and 8. I have enabled both scroll bars (overflow-x and overflow-y), and I have tried scrolling an image using these scroll bars. Issue is exactly the same. I've tried running this on a fairly underpowered PC - pentium dual core few years old with 2 GB of RAM as well as Core i7 desktop with 2.8GHz CPU 1600Mhz RAM and the results are nearly identical. FireFox scrolls a lot faster, however its CPU usage on average is 10% higher than IE CPU usage. This leaves me puzzled...surely Microsoft would have addressed this issue by now?

Another thing that I have found slightly odd is that scrolling ran faster on a Core 2 Duo laptop. I'm wondering whether this has anything to do with graphics card drivers...does IE 7/8 even make a use of GPU?

Excuse me if any of this sounds silly, but I'm really interested in solving this problem...IE can't be that bad..

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

烧了回忆取暖 2024-10-13 22:24:10

jQuery 的 .scrollTop() 在 ie 中是出了名的慢,如果标记稍微复杂或大,你永远不会让它表现良好。

解决方案是不使用 jQuery .scrollTop() 函数,而是根据本机属性 .scrollHeight.scrollTop 构建您自己的函数。

原因是 ie 计算偏移量的方式,这是 jquery .scrollTop() 缓慢的基础 - 您必须遍历 DOM 树并计算 ie 中每个父级的偏移量。

jQuery 尽其所能地做到了这一点,但是您总是能够做得更快,因为您提前知道标记并且可以对其进行优化 - 您甚至可以在大多数情况下提前进行偏移计算,并且只需使用常量作为修饰符。

话虽如此,这可能不是 jQuery 的错 - 它可能只是 ie 渲染管道的问题 - 取决于你如何制作标记和样式,滚动可能会迫使 ie 为你的每个像素完全重新渲染/重新绘制页面滚动,这会让一切变得缓慢。

jQuery's .scrollTop() is notoriously slow in ie, and if the markup is even slightly complex or large, you'll never get it to perform well.

The solution is to not use the jQuery .scrollTop() function, but build your own based on the native properties .scrollHeight and .scrollTop.

The reason is the way ie computes offsets, which is the base of jquery's .scrollTop() slowness - you have to walk up the DOM tree and calculate offsets for every parent in ie.

jQuery does this the best it can, but you will always be able to do it faster since you know the markup in advance and can optimize this - you can even do the offset calculations in advance most of the time and just use a constant as modifier.

All that said, this might not be jQuery's fault - it can simply be a problem with ie's rendering pipeline - depending on how you made your marklup and styling of it, a scroll might force ie to completely rerender/repaint the page for every pixel you scroll, and that will slow it all down to a crawl.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文