jquery - 将 'touchstart' 绑定(bind)到文档时的 Mobile Safari (iPad) 滚动性能

Question

我一直在调查在 iPad Safari 上滚动我的网站时出现的一些性能问题。我们有一些页面很大table最多 500 行的元素；性能影响似乎肯定与表中的行数有关(并且，在没有此类表的页面上，滚动性能似乎很好)。桌面浏览器完全没问题。

您可以通过以下链接尝试此操作。 注意:要重现，请确保将默认值 25/页更改为 500/页。 http://www.cellartracker.com/list.asp?table=Notes&iUserOverride=0&T=1000

经过大量调试后，我发现如果删除已绑定(bind)的任何“touchstart”事件，滚动性能是正常的(并且如预期的那样超快)。我有几个$(document).on('touchstart', '<selector>', function ()...)配置为帮助触摸设备访问某些悬停功能的事件。目前，我绑定(bind)到$(document)有两个原因:

1. 可能有很多元素与选择器匹配，因此传统上单个委托(delegate)事件处理程序的性能优于附加到每个元素的 500 多个处理程序(我刚刚修复了 IE8 上与此相关的一些性能问题)。
2. 一些受影响的元素是通过 AJAX 加载的，因此如果我绑定(bind)到各个元素，这些元素不会自动获取处理程序。

好的，太好了——我找到了原因——但我不知道为什么这个问题只出现在带有大表格的页面上，也不知道如何解决它。对于具有两者触摸和键盘/鼠标的设备，我希望每个输入机制都能一致地运行(因此 if (touch) bind('click') else bind('mouseenter') 方法不是我想要的)。另外，我还在考虑实现 Fast Buttons某些元素的方法，这可能需要绑定(bind)到 $(document)因为这就是相应的 click当前已绑定(bind)处理程序。

所以...有关如何改进这些页面上的滚动性能同时仍将 touchstart 绑定(bind)到 $(document) 的任何想法？此时 HTML 已经相当固定，但如果对 DOM 进行简单调整会产生重大影响，我对此持开放态度。

Answer 1

好吧，在把这个放在一边几天去处理其他事情之后，我回来发现性能神奇地显着提高了!回溯所做的其他更改，我发现了性能问题的根源:jQuery UI 1.8.20。我刚刚升级到 jQuery UI 1.9.2 以修复其他一些问题，现在我不再看到可怕的滚动滞后/性能问题。

现在，我仍然看到将 touchstart 绑定(bind)到 $(document) 导致性能略有下降，但现在它是如此微小，以至于几乎难以察觉。不过，如果有人对如何更好地优化原始问题有其他指导，我仍然很想听听!