我有一页显示价值约300页的表格数据。Firefox,Chrome,Safari都能正常工作,但IE7、8和8兼容视图都很糟糕。当我试图滚动或按下页面向上/向下按钮时,它会延迟几秒钟。
分页、较小的数据集和其他可用性建议将不适用于此页面。假设我别无选择只能一次显示所有这些数据..。我能做些什么来调整它?
数据是通过jQuery/Ajax加载的,这似乎至少在一定程度上值得怀疑,因为当我创建一个直接呈现结果的测试页面时,它并不像其他浏览器那么慢,但仍然没有其他浏览器那么快。
我过去曾成功地使用过jQuery插件(如SlickGrid )来解决类似的问题,但由于需要很长时间才能解释它们不是一种选择,即使具有微模板呈现功能。我主要关注的是,在不修改整个页面或引入第三方解决方案的情况下,我可以做出哪些调整来提高性能。
简化的DOM会产生很大的影响吗?或者IE不能很好地处理通过JavaScript/Ajax带来的数据?
发布于 2010-05-24 16:52:11
如果没有更多的细节或者一个例子.你是如何构建内容的?构建表内容有很多小技巧:特别是在IE中直接在<table>上设置<table>不起作用,所以如果您正在使用jQuery的html(),它可能会执行很长很慢的工作。
但是,对于任何有表的东西,特别是较大的表,都有一个通用提示:在<table>元素上设置样式width,在第一行单元格上设置列width样式,或者在一组<col>上设置列width样式。(在液体布局情况下,没有显式width的列将在它们之间平均共享剩余的宽度。)
由于它不依赖于每个单元格中的内容数量,因此fixed表布局比默认的auto表布局算法更快、更可预测。
发布于 2010-06-24 13:18:43
使用innerHTML和最小化js / dom交互。Js在IE中并不慢,但是js/dom桥非常慢。还要避免在要插入的html中选择元素。如果这样做,jQuery将必须遍历每个元素并对id或css属性进行测试。这太慢了。
在IE中,在DOM中插入数千个元素本身是可行的。但是,如果您开始对这个html进行一些更改,您可能会遇到严重的perf问题。
除此之外,还需要您的代码来说明如何使其更快。此外,一个测试页,可以被剖析将是很好的。
FYI,IE唯一可用的性能分析工具是dynatrace版本。它的免费和优秀的质量软件。用它!
发布于 2010-05-24 17:53:57
我发现,当您动态地将大型复杂内容插入到现有页面时,IE在设置innerHTML方面比以编程方式创建几十个或数百个DOM节点并插入它们要快得多,无论您是否使用客户端库。如果您呈现HTML服务器端并将其作为字符串发送,而不是发送JSON数据和呈现客户端,您将使用更多的带宽,但是您的IE用户可能会有更好的体验。
IE的javascript性能目前相当糟糕,所以如果您想让您的站点在IE中更快,最小化大规模DOM操作是一个好的开始。为比较做一个简单的测试用例应该不难,看看这样的更改是否会对您的特定情况有好处。
https://stackoverflow.com/questions/2897956
复制相似问题