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

 

sencha touch list infinite 属性的更多相关文章

  1. sencha touch 入门系列 (五)sencha touch运行及代码解析(上)

    由于最近项目比较忙,加之还要转战原生开发,所以很久没更新了,今天我们接着上一次的内容往下讲: 首先我们打开index.html,这是我们整个程序的访问入口,也是整个项目的引入地: <!DOCTY ...

  2. sencha touch的开源插件和例子

    写了好久的sencha touch,没想到换工作竟然一年多没有搞了.因为项目的缘故收集了好多的组件,由于懒惰,没有整理,现在想想有点后悔了,再加上如果就这样丢弃,感觉有些遗憾,今天整理了一下放在git ...

  3. sencha touch打包成安装程序

    为了更好地向大家演示如何打包一个sencha touch的项目,我们用sencha cmd创建一个演示项目,如果你的sencha cmd环境还没有配置,请参照 sencha touch 入门系列 (二 ...

  4. sencha touch 入门系列 (二)sencha touch 开发准备

    这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...

  5. 使用 crosswalk-cordova 打包sencha touch 项目,再也不用担心安卓兼容问题!

    国内的安卓手机品牌众多,安卓操作系统碎片化也很严重,我们使用sencha touch 开发的应用不可避免的出现了各种无解的兼容性问题. 有时候我就在想,有没有既能支持cordova,又能让我们把Chr ...

  6. sencha touch api 使用指南

    本文主要讲解如何使用sencha touch的api以及如何查看api中官方示例源码 前期准备 1.sdk 下载地址:http://www.sencha.com/products/touch/down ...

  7. Sencha Touch 手机移动开发框架 HTML5 项目压缩方案;

    Sencha Touch框架生成基本项目目录结构 Index.html/ App.js App.json /touch[sdk]/ /Sencha-touch.js /src Resources/ A ...

  8. sencha touch 开发准备

    这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...

  9. Android环境配置Sencha Touch

    转自http://www.phonegap100.com/portal.php?mod=view&aid=19 作为你开发的一部分,为安卓设备开发的 Sencha Touch框架应该在安卓虚拟 ...

随机推荐

  1. Grails项目开发——前端请求跨域问题

    Grails项目开发--前端请求跨域问题 最近做项目采用前后端分离的思想,使用Grails作为后台开发Restful API供前端调用. 在项目开发的过程中,遇到前端没办法通过ajax访问到后台接口的 ...

  2. 设计模式8---适配器模式(Adapter)

    1. 适配器模式简介 适配器模式(Adapter):将一个类的接口转换成客户希望的另外一个接口.Adapter 模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作. 适用场景: 1.已经存在 ...

  3. fwrite与fread

    函数原型 size_t fread(void *buffer, size_t size, size_t count, FILE *stream);   size_t fwrite(const void ...

  4. Apache网站服务

    Apache 下载地址: http://mirror.bit.edu.cn/apache/httpd/相关软件下载地址:http://mirror.bjtu.edu.cn/apache/apr/apr ...

  5. .net 有参属性 index (索引)

    public class IndexTempte { public ArrayList nameList = new ArrayList(); public string this[int index ...

  6. java-04流程控制语句

    这里先简单介绍几种流程控制语句 包括if/if-else.switch语句 1.三大流程控制结构 所谓流程控制,就是说要控制程序的执行方式,根据不同的情况执行不同的代码,从而得到不同情况下的不同结果. ...

  7. 转:javascript判断IE浏览器

    http://blog.csdn.net/ranbolwb/article/details/18555847 function isIE() { //ie? if (!!window.ActiveXO ...

  8. .Net Core 自动化部署:使用jenkins部署到linux docker容器运行

    上次我们说到.Net Core 自动化部署:使用docker版jenkins部署dotnetcore应用,这次我们使用jenkins发布我们的.NET Core站点到docker容器中运行,为后面的的 ...

  9. cisco和h3c网络设备中一次性打印全部配置信息

    cisco的是全页打印配置信息的命令: #terminal length 0 #show run 华为和h3c的是: >screen-length 0 temporary >display ...

  10. 在Java中如何优雅地判空

    判空灾难 ​ 作为搬砖党的一族们,我们对判空一定再熟悉不过了,不要跟我说你很少进行判空,除非你喜欢NullPointerException. 不过NullPointerException对于很多猿们来 ...