JQgrid 在渲染时完全挂起浏览器答案

【问题标题】：JQgrid is hanging the browser completely while renderingJQgrid 在渲染时完全挂起浏览器
【发布时间】：2016-03-15 15:41:34
【问题描述】：

当我尝试使用 JSON 作为数据源将大约 10000 条数据记录加载到 JQGrid 时遇到一个问题。

此时浏览器冻结或没有响应大约 5 分钟。我的自定义加载器也与浏览器一起挂起，页面进度未显示。

如果 JQgrid 的渲染需要一些时间，那没关系，但我想至少显示我的加载器正在旋转以了解进度。

尝试了所有这些方法来让加载器旋转。但没有任何效果。

谁能帮我在渲染 Jqgrid 时显示加载器。

loadui : "disable",
        loadtext: "Loading...",
        beforeRequest : function () {
                $("#testGrid").block();

                $('.loading').show();

                $("#testGrid").closest(".ui-jqgrid").find('.loading').show();

            $(".loading").css("display", "block");

            $(this).block({
                message: '<img src="/images/loader.gif" />',
            });            },

谢谢，

【问题讨论】：

您使用哪个版本的 jqGrid 以及来自哪个分支（free jqGrid、Guriddo jqGrid JS 或版本 rowNum)？您是否有loadComplete 或gridComplete 回调（通常是瓶颈）？网格有多少列？ ... jqGrid 中数据的纯处理应该像the demo 一样快（13 列，40000 行，一页 20 行）。
@Oleg gridComplete 花费了大量的时间来渲染行，因为我们对每一行进行了大量的设计验证。我有 20 列和 10,000 条记录。
@Oleg 我没有使用分页之王，所有数据都必须一次性处理。或者有什么方法可以在 ggridcomplete 事件中显示加载器？
永远不要在循环中为loadComplete 和gridComplete 中的每一行做一些事情。永远不要修改loadComplete 和gridComplete 内部的网格。应该使用rowattr、cellattr 和自定义格式化程序直接生成您需要的内容。应始终使用本地数据分页。我建议将rowNum 设置为 10-25。它不应该更多，因为可以在监视器上显示行数。如果您遵守规则，您将获得 jqGrid 的良好性能。 能否包含您使用的代码（loadComplete 和 gridComplete）？
@Oleg 这是我在 gridcomplete 中实际使用的代码..

标签： javascript jquery json jqgrid

【解决方案1】：

我建议您执行以下操作：

使用数据的本地分页：例如使用rowNum: 20和height: "auto"
永远不要修改loadComplete 或gridComplete 内循环中的网格数据。而不是那个应该使用rowattr来设置行的CSS样式（分配类）（参见the answer）和cellattr来设置某些列的单元格的CSS样式（分配类）（参见the answer）代码示例。
升级到最新版free jqGrid（现在是4.13.1）

如果您在页面上填充更多用户可以看到的行，那么您只需强制执行不需要的工作。它使页面缓慢。如果您用 10000 个元素修改页面的一个元素，则 Web 浏览器必须重新计算所有其他 9999 个元素的样式和位置。如果你在循环中进行这样的修改，那么你会让你的页面变得非常非常慢。

【讨论】：