在jQuery Mobile中加载大型嵌套列表的最快方法是什么?

时间:2012-01-15 04:31:51

标签: jquery-mobile

我有一个大型嵌套数组,我是通过在PHP中解析CSV文件生成的。我让它以JSON输出并让我的jQuery Mobile网站获取它,然后将其解析为DOM列表<ul><li>。这在我的桌面浏览器上运行良好,但似乎永远在我的移动设备上。

然后我让PHP脚本实际输出HTML,并将其粘贴到我的jQuery Mobile站点中以查看是否加快了速度。这基本上删除了任何数据的提取。 index.html中只有一个非常大的嵌套<ul>。我认为这肯定会很快加载,但现在我的移动设备(Nexus One&amp; Blackberry)上的甚至更长

有没有办法加快速度?这是一个演示http://pastehtml.com/view/bkrviwxp4.html

我在链接上尝试了数据预取,但这阻止了页面完全在黑莓上加载。

2 个答案:

答案 0 :(得分:6)

正如我所看到的,您正在同时处理所有元素,但是您不会立即显示所有元素。尝试仅处理并向DOM添加将要显示的这些元素。 JQuery-mobile本身很慢,即使只有一对元素,你也有数千个。

答案 1 :(得分:2)

不使用jQuery Mobile的嵌套listview功能会更快,因为它不是为有效加载大量元素而设计的。开发团队过去甚至有considered deprecating嵌套列表功能。

相反,呈现嵌套数据的更好方法是将列表的每个级别放入其自己的HTML页面,并使用标准的jQuery Mobile页面模型来显示它。

此外,如果您有大量的标记要由jQuery Mobile解析,根据我的经验,您可以通过让PHP脚本生成必要的标记和类,并创建自己的jQM小部件来显着提高性能。不要试图遍历数百个DOM节点。这种性能提升是以带宽为代价的,但到目前为止,我的经验是,以这种方式完成移动设备的总体加载时间会减少。