Question

我正在使用jQuery Mobile Filtered List：

http://jquerymobile.com/demos/1.0.1/docs/lists/lists-search.html

在我的电脑上它工作正常，但在我的iPhone 3GS上它很慢。输入字母和被过滤的列表之间有大约半秒的延迟。我有150个项目要过滤，从一些googeling看起来应该处理得很好。所以我只是对回复id的速度不切实际或者可能是错误的？

即使单词不是以字母开头，过滤器也会找到字符。所以进入'ar'就会找到'巴黎'。这对我的应用程序来说不是必需的，我很高兴只有当过滤器开头的字母开头才能返回项目。可以关闭此功能，如果我这样做，我可能会看到明显的性能优势吗？

Answer 1

我还没有找到过滤搜索栏的变通方法，但是，如果从UL LI列表中删除所有锚标记和角色，这将删除数百个减慢页面加载和转换速度的绑定。然后，您必须添加一个函数：



    // should be defined in your body onload method, or pageinit
    $("li").on("click", function(event) {
    // determine your URI here you want to load
    // ...
        $.mobile.changePage(uri);
    }; // if list dividers exist, add code to ignore them, or get page load error.

更新：根据文档，如果您将以下内容添加到mobileinit，搜索子字符串将应用于搜索字词的开头：



    $.mobile.listview.prototype.options.filterCallback = function( text, searchValue ) {
        return text.toLowerCase().substring( 0, searchValue.length ) !== searchValue;
    };

注意：这仍然不能完全加快搜索栏的速度。由于即时搜索和DOM更新，命中退格特别慢。我没有看到一个API钩子来解决这个问题（但是？）......它可能需要修改库。

除此之外：stackoverflow的代码验证器过于挑剔，所以我省略了详细信息，比如显式的mobileinit代码......

更新：如果您使用CSS3过渡并遇到问题，请考虑以下内容......

如果您在iOS上遇到渲染工件，因为GPU的平铺渲染引擎在转换后未进行vsync，则以下内容可能有所帮助：



    <style type="text/css">
      html, body { -webkit-transform: translateZ(0); }
    </style>

Answer 2

我的结论是jQuery Mobile简直慢了。我用jQuery重建了我网站的精确副本，性能要好得多。也许是因为它是一个年轻的框架，但我非常主观的经验是，如果你需要最佳性能，它还没有准备就绪。

jQuery Mobile Filtered List在iPhone 3GS上有150个项目

2 个答案: