在Internet Explorer 7中逐步呈现网页

我正在尝试改善用户对某些网页页面加载时间的感知。这些网页大约需要5秒钟才能完成加载和渲染。总体时间不错;但点击一个链接加载一个页面，大约4.5秒没有任何反应，然后整个页面出现在一个镜头中。这会损害用户体验，因为用户在点击链接后想知道是否发生了任何事情。在Internet Explorer 7中逐步呈现网页

据我所知，浏览器应该逐渐渲染网页，当可用的资源渲染部分页面可用时。有一件我见过的推荐（例如YSlow的例子:)是将css放在头部，并将javascript放在结尾body标签附近 - 或者尽可能靠近页尾。我已经这样做了，但是我没有看到页面渲染的最初部分，然后暂停加载JavaScript。据我所知，理论上说，一旦所有的CSS被加载，页面将逐渐开始渲染。我也明白，当任何JavaScript被执行/下载时，页面将暂停呈现。

还有什么会影响IE上的渐进渲染，尤其是在IE7上？

来源

2009-10-05 Rohith

Internet Explorer特别避免了渐进式渲染。如果内容可能移动，他们不想“*混淆*”用户。直到完全下载后才显示图像（与FF/WebKit相反，显示图像时收到）。在收到表格的全部内容之前，表格根本不会被渲染。等等。我只是说你会击中在其他浏览器中不存在的IE设计限制。 – 2010-06-24 18:34:37

第一步可能是要了解网络端发生了什么，像Fiddler这样的工具可以帮助您。在你的情况下，Timeline display应该是一个很好的起点。

来源

2009-10-05 09:32:03 fvu

为此，肯定会启用Fiddler的流模式。 – EricLaw 2009-10-06 04:28:41

我尝试了HTTPAnalyser（类似于Fiddler），它表明呈现页面所需的一切（css + html）在大约2秒后可用。当我开始渲染页面时，我正在努力弄清楚IE7在2秒和4秒之间正在做什么。 – Rohith 2009-10-06 04:59:01

Chrome中的开发人员工具也具有出色的时间线工具。 – chris 2011-01-11 18:13:03

检查未封闭标签。
检查所有图像都有宽度和高度属性。

来源

2009-10-05 09:34:15 wefwfwefwe

1.检查未封闭的标签 - 未找到。你能解释为什么这会影响渐进式渲染？ 2.我们无法为图像设置宽度和高度属性，因为这些图像中的很多来自内容管理系统，其中一些大于页面上可用的空间来显示它，并且放置高度和宽度会扭曲形象 - 这是客户无法接受的。谢谢你的回答 - 它肯定提高了我对渐进渲染的理解。 – Rohith 2009-10-06 04:51:59

为什么在点击链接时显示通知给用户，表示页面当前处于加载状态。

你可以这样做：

window.onbeforeunload = function(e){ document.body.innerHTML='loading...';/*or even a better content/* };

来源

2009-10-05 10:03:46 jerjer

不错的主意 - 但不幸的是，我们的客户不喜欢它。我会在未来记住这一点。 – Rohith 2009-10-06 04:55:45

这肯定会打破后退按钮 – 2010-01-10 14:54:30

我发现JavaScript的（特别是一些jQuery选择）的速度变慢，并防止页面无法呈现。我们首先通过删除一些重复选择相同元素的代码来优化jQuery代码。然后将代码移动到$ .ready，以便在页面加载后执行。总的来说，这给了我们页面加载时间2秒的提升，以及允许更多页面逐步加载。

来源

2009-10-08 11:59:30 Rohith

由于页面上的Flash视频，我的负载问题相同。有人会告诉我为什么哦，我的上帝为什么不能，即只是加载页面如Firefox一样好？

如果ie今天停业，我浪费的所有时间和日夜都将结束。

我认为是时候了，即在2009年满足web maaster的需求并改变他们加载页面的方式。

如果使用java脚本，没有java的人将看到空格。

来源

2009-10-13 03:10:29

在Internet Explorer 7中逐步呈现网页

回答

相关问题