html - 当有很多输入时，Chrome 很慢

Question

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

当有很多资源(大约 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 中以使用服务进行异步) worker) 并移除自身或等待下一个输入。

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