随着页面大小的扩大，textarea中每次击键时的IE8渲染速度会变慢

Question

我有一个使用JQuery的页面，我在div上实现了无限滚动。页面上有一个文本区域。我注意到随着更多行被添加到可滚动div中的表，页面的性能变得更糟。您可以确切地知道页面大小何时很大，并且您尝试在文本区域中键入任何内容，因为在文本输入文本区域的时间和实际看到文本显示的时间之间存在较大的延迟。这只发生在IE8中。我没有尝试过其他IE版本。它不会发生在Firefox中。它在Firefox中真的很快。

我已经使用了一个工具来检查IE正在做什么，并且它正在花费大部分时间为每个键击执行页面的通用渲染，即使页面中没有添加任何新内容。

为什么IE8中的页面呈现频繁且缓慢，有没有办法改进它？

Answer 1

我认为表是导致性能问题的原因。当使用js动态地将行添加到包含表单元素的表时，我遇到了类似的问题。

有关如何提高性能的提示，请参阅此Microsoft Article，特别是在使用表格时。

• 将表格布局CSS属性设置为固定在表格上。
• 明确定义每列的col对象。
• 在每个列上设置WIDTH属性。

e.g：

table
 {
 table-layout:fixed;
 } 

避免在表格中嵌套表格。

W3Schools强调了使用不同表格布局算法的优缺点。

FireFox似乎比IE更有效地处理表的呈现，但使用这些技术似乎可以帮助大多数浏览器。

希望这有帮助！

Answer 2

对于非常大的页面，IE8中的文本区域滞后也会出现类似的问题。 IE8在每次按键上呈现页面似乎都是一个问题。

一种解决方案是使用iframe，其contentEditable设置为true而不是textarea。这在同一页面上没有任何明显的延迟。我怀疑这是因为IE8只在每个按键上呈现iframe的内容而不是父文档。它也可能适用于iframe中的textarea，但我还没试过。