1

我需要一些建议如何提高应用程序的性能，我正在开发 MVC 3 ASP.NET 应用程序。从控制器中，我提取了 50,000 条字符串类型的记录，所有项目（即 50,000 条）都使用 Jquery 动态添加到 HTML Div。

   $(div).append("<input type='radio' name='reportType' 
   id='" + item.Item1 + "' value = '" + item.Item2 + "'/>" + item.Item1 ");

我看到将上面的单选按钮添加到父控件（即 HTML）时需要花费大量时间DIV

父 HTMLDIV在Check box检查时必须选中所有子框。我发现检查所有项目有相当多的时间

所有这些项目都在 Scroll Viewer 中，有没有办法改善用户体验，比如在 Scroll 上加载数据，比如HTML 5中Silverlight的数据虚拟化。

我检查所有项目并拖动到页面的另一部分，这使浏览器进入非响应模式。谁能通过提高查询性能为我提供这些许多记录的最佳用户体验

4

3 回答 3

1
  1. 构建要附加的 HTML 字符串。
  2. 在其构建完成后附加一次。

这将比附加每个字符串更快。

var htmlToAppend = "";
for (var i in items) {
     var item = items[i];
     htmlToAppend = "<input type='radio' name='reportType' id='" + item.Item1 + "' value = '" + item.Item2 + "'/>" + item.Item1;
}

$(div).append(htmlToAppend);

另外，我相信还有更好的方法！

于 2013-05-08T19:12:31.640 回答
1

您应该创建一个 documentFragment 并在其中添加节点。完成后将 documentFragment 添加到 DOM。此外，使用它createElement比使用字符串更有效。有很多 jsperf 测试可以证明这一点，您还可以在那里找到最有效的方法。

为防止浏览器长时间完全冻结，您应该以...1000 个项目（纯猜测）为单位中断迭代。并根据需要多次调用该函数来完成工作。在它外面放一个柜台。用 调用它setTimeout(renderMore, 0)。至少这将防止窗口冻结。

根据您的 UI 和工作流程，您可能还可以应用其他一些改进。但是您没有提供太多有关此的信息。

于 2013-05-08T19:34:34.770 回答
0

基本上，要显示大型数据集，请尝试以下操作：

1) 将其存储在浏览器内存中，使用 sessionStorage() 或 localStorage()

2）最小化DOM，不要将所有数据写入DOM，动态添加和删除元素。

3）允许数据集可搜索，这意味着修剪数据集的过滤功能。

解决此问题的另一种推荐方法是使用Megalist，需要 jQuery 并且适用于平板电脑或移动设备。

于 2013-05-08T23:20:02.447 回答