sencha touch list infinite 属性

sencha touch list

1 默认每一项的高度会自动适应其内容。

2 当每一个 item 的高度都相同且不变时， 设置 itemHeight 为固定值 和 variableHeights 为 false，

可以优化性能，因为不用去动态计算每一项的高度。

3 infinite 属性对底层做了优化，大体是 infinite 为 false 时，每一个 item 都对应一个 dom 元素，当 list 有很多项时肯定影响性能。 当 infinite 为 true 时，假设一屏能显示 10 条，底层只有 10 个 dom 元素， 当滚动时只循环这 10 个 dom，所以性能与 item 的个数没有关系。我测试了一下，当数据很多时，设置 infinite 为 ture 确实滚动流畅了很多。

一个老外说当数据较少时（比如 500 条以内），用不用 infinite 滚动都差不多， 当数据很多时 infinite 能起到优化作用。

至于底层实现到底有什么不同，有兴趣的同学可以去研究一下 sencha 的源码。

4 发现 list 设置了 infinite 为 ture 后， 内容很长时布局就乱掉了。 原来为了优化性能  variableHeights 被设置成了 false，每一项的高度都设置成了默认高度。把 variableHeights 设置成 true 就可以自适应了。

还有问题： 设置了infinite : true  后,客户报了一个 bug 说 在 IOS 中快速滑动界面会突然卡死。经我测试确实有这个 bug (当list item 有多行内容, 确切的说是每行高度超过 list item 的默认高度时), 而设置 infinite : false 就没有问题。

查了一下这是 sencha 2.2 的一个 bug,  经测试在 sencha 2.3 中修正了这个 bug.

老外也有讨论这个 bug ,更多请参考

2.2.0 Infinite List Freezing