jquery - 在移动设备上使用 jquery NiceScroll 滚动速度非常慢

Question

我正在使用 twitter bootstrap 开发一个寻呼机网站。我使用 jQuery NiceScroll 在部分内滚动(仅允许用户在单击菜单项时滚动特定部分)。当该部分内容较少且滚动平滑但当该部分内的元素数量增加时，它工作正常，滚动速度非常慢。

jQuery 代码:

jQuery("section").niceScroll({horizrailenabled:false,scrollspeed:"5"});
jQuery("section").getNiceScroll().hide();//to hide the scrollbar but allow scrolling

请提出建议。

Answer 1

手机内存很小。大量 DOM 元素会导致速度变慢。减少 DOM 元素和样式可能会有所帮助。

我首先删除所有 CSS，看看是否可以加快速度。 box-shadows 和 border-radis 可以使用很多处理器。其他项目可能会大大减慢速度。

您还可以使用 Safari 6.1 或 Chrome 开发工具中的时间线来查看重新计算样式和重新绘制屏幕的次数。重画太多也会减慢速度。

在移动设备上实现快速滚动的真正方法是对浏览器、DOM、网络和垃圾收集器进行大量自定义优化。查看 PerfView 的代码以了解一些优化 ( https://github.com/puppybits/BackboneJS-PerfView )。