Progressive rendering of a webpage in Internet Explorer 7

Question

I'm trying to improve the user perception of page load time of some web pages. These web pages take about 5 seconds to complete loading and rendering. The overall time is fine; but on clicking a link to load a page, nothing happens for about 4.5 seconds and then the whole page appears in one shot. This spoils the user experience, since the user is left wondering if anything is happening or not after clicking the link.

As I understand it, browsers are supposed to progressively render web pages as and when the resources available to render portions of the page become available to it. One thing I've seen recommended (by YSlow for eg:) is to put the css in the head and the javascript near the ending body tag - or as near the end of the page as possible. I've done this, but I don't see the initial part of the page rendering and then pausing for the javascript to load. The theory, as I understand it, is that the page will begin rendering progressively once all the CSS is loaded. I also understand that the page will pause rendering when any javascript is being executed/downloaded.

What else can affect progressive rendering on IE, especially on IE7?

Answer 1

A first step may be to understand what's going on on the network side, a tool like Fiddler will help you. In your case, Timeline display should be a good starting point.

Answer 2

1. check for unclosed tags
2. check all images have width and height attributes

Answer 3

Why not show notifications to users when a link is clicked that the page is currently in loading state.

You can do this:

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

Answer 4

I found out that javascript (specifically, some jQuery selectors) were slowing things down and preventing the page from rendering. We first optimized the jQuery code by removing some code which was repeatedly selecting the same elements. Then moved the code down to $.ready so that it executes after the page has loaded. Overall, this has given us a 2 second boost in page load times as well as allowing more pages to load progressively.

Answer 5

I'm having the same load problems because of flash videos on a page. Will somebody tell me why oh my God why can't ie just load pages as nicely as firefox does???

If ie went out of business today, all the hours and days and nights I've wasted would be over.

I think it's about time that ie get with the demands of web maasters in 2009 and change the way they load pages.

If java script is used, people without java will see blank spaces.