Question

在我们的MVC5项目中，有一个页面，用户可以在其中检查多个资产。每个资产都由复选框和名称表示。

当有大量资产（大约800-1000）时，Chrome变得非常慢。甚至有时会显示“页面不负责任”的消息。

看起来像这样： - 页面被部分渲染并粘贴在带有复选框的DIV上 - 然后有30-40-50秒的延迟。有时错误信息 - 呈现复选框的DIV以及呈现的页面的其余部分

在FF和IE中没关系。

提前致谢

我同意这不是一个好的用户体验，但在目前阶段我需要解决这个问题。这是标记（这个div是4级嵌套）：

<div class="list">
        @for (int i = 0; i < Model.Items.Count; i++)
        {
            <text>
                @{var cid = Guid.NewGuid().ToString();}
                @Html.HiddenFor(m => Model.Items[i].Id)
                @Html.CheckBoxFor(m => Model.Items[i].Selected, new { id = cid })
                <label for="@cid">@Trakopolis.WebSite.AppHelper.GetLocalizedString(Model.Items[i].Name)</label><br />
            </text>
        }
    </div>

Answer 1

您可以尝试使用javascript，其中所有内容都是带有数据属性的纯文本，然后单击，临时添加输入元素，输入元素获取输入，将其发送到服务器（或将其保存在indexeddb中以进行异步使用服务工作者）并自行删除或等待下一次输入。

<td id=“unique-id1” data-url=“/action” data-name=“InputName”>data</td>

Answer 2

与Safari相同的问题，我怀疑是一个webkit错误。任何包含数百或数千个输入字段的页面导航或编辑的速度都非常慢。

请参阅Why does Safari Mobile have trouble handling many input fields on iOS 8

我们有一个包含300行的表的页面，每行有几个单元格，每个单元格都是可编辑的（输入）。

上面链接中给出的解决方法效果很好。

Answer 3

看起来Chrome没有使用关闭标记为<br>的复选框下拉标记，这会以某种方式强制进行额外的浏览器内部检查，从而导致与IE和FF浏览器（使用结束标记）相比较慢的页面呈现。为避免因<br />标记而导致Chrome加载缓慢，您可以使用打开和关闭<div>来加快页面速度，但我不确定是否可以替换<input>个元素不知。

当有大量输入时，Chrome很慢

3 个答案: