如何提高Firefox中动态HTML表创建的速度?

时间:2010-01-04 08:06:15

标签: html performance google-chrome firefox html-table

我正在渲染一张不断更新的小桌子(可能是10-12个单元格)。 我希望它很快。

Chrome可以非常快速地完成工作,但我在Firefox / IE上遇到了问题。 有关更快渲染的任何建议吗?

4 个答案:

答案 0 :(得分:5)

立即渲染整个表(为表创建完整的HTML并将其插入DOM,在循环数据时不要插入单元格/行)。此外,为列生成标记应该有帮助(如果指定每列的宽度,则更多)。

答案 1 :(得分:1)

您可以借助Chrome或Safari Dev-Tools的时间轴面板(适用于Windows的Ctrl-Shift-I或适用于Mac的Cmd-Alt-I)检查页面上的实际情况。该信息可能会为您提供页面脚本优化的提示。通常,任何浏览器都会发生同一组事件。例如,如果您的javascript动态插入DOM节点,那么您将看到多个Layout / Paint事件。

您将获得更多关于Chrome的开发频道版本的时间轴信息,但它可能会有点不稳定。

不幸的是,如果您知道类似Firefox的内容,我在FireBug中找不到这样的乐器,请告诉我。

答案 2 :(得分:-1)

我认为有趣的文章对于这个问题非常重要(虽然有点间接):http://www.hotdesign.com/seybold/

我从答案到我自己的question

答案 3 :(得分:-1)

改善渲染的一种方法是使用thead / tfooter标记。这些需要在包含表格主要内容的tbody标签之前发生。

<table>
<thead></thead>
<tfoot></tfoot>
<tbody></tbody>
</table>

这样一来,浏览器就会知道你的表在呈现它之前有多大,这应该加速加载。