在大型 HTML 表格中，输入之间的切换很慢答案

【问题标题】：Switching between inputs is slow in a large HTML table在大型 HTML 表格中，输入之间的切换很慢
【发布时间】：2018-04-20 09:51:33
【问题描述】：

我创建了一个带有大量数字输入的大型 HTML 表格形式的批发订单。我注意到在此表中，数字输入和输入值之间的切换非常慢（即，当我单击输入时，光标需要花费一些时间；当我输入输入时，它需要角色出现的时间）。有什么方法可以在不对表格行进行分页的情况下消除滞后？

您可以查看并玩弄桌子here（使用访客密码“braese”）。

Chrome Dev Tools 性能记录的屏幕截图，用于在单个输入中单击（我不太确定这是做什么的）：

【问题讨论】：

您的“批发订单”在哪里？
我找到了“批发订单”。您能否描述导致“非常慢”处理的具体输入序列？此外，您的性能问题是否与使用 JavaScript 或其他方式处理浏览器有关？
在下面查看我的答案。像魅力一样工作。
@JohnH 它与 JavaScript 无关。当您在任何数字输入中单击时，光标开始闪烁之前会有一段延迟。然后，当您输入内容时，每个字符出现在输入框中之前都会有一个延迟。

标签： html performance html-table rendering

【解决方案1】：

我进行了更多的挖掘和测试，结果发现单击/键入输入时的延迟（更新层树）只是 Chrome 中的一个问题。 This answer 在另一个问题上指出了 Chrome 自 46 版以来的问题。很遗憾，如此流行的浏览器允许这样的问题持续 2 年以上。由于 Chrome 在我们客户的客户中如此受欢迎，我们将不得不对我们的订单进行分页。

【讨论】：

【解决方案2】：

哇，我的 chrome 几乎崩溃了 :) 这是你的风格每次应用翻译变换时都会创建图层查看 Chrome 开发工具中的图层菜单；测试它是否运行得更好 - 只有表:)

同时订购您的样式和脚本！ - 脚本之后的第一个样式

干杯！

【讨论】：

“每次应用翻译变换时都会创建图层” - 我在哪里应用翻译变换？它不适用于输入。问题是，当我单击其中一个输入时，光标出现之前会有延迟，而当我在输入中输入内容时，字符出现之前会有延迟。 “测试它是否运行得更好-仅表”-您的意思是在删除翻译转换后对其进行测试？ “只有桌子”是什么意思？ “脚本之后的第一个样式” - 我的脚本应该在