CODEWITHSUNDEEP
htmlrendering
chris
chris

Reputation: 37480

What prevents HTML pages from taking advantage of progressive rendering?

I've notice that some pages begin to render almost immediately, while others sometime have to wait until many or all of the resources (javascript, image, css) have been downloaded. The worst case seems to be for a large page, on a slow connection or server. One specific page I'm looking at comes out to almost 2 MB, with 30 different .js files, a dozen .css files, and 80 image.

I'm aware of the suggestions at http://developer.yahoo.com/performance/rules.html, but what would be preventing the browser from attempting to render the page until the last element has been downloaded?

Upvotes: 5

Views: 1990

Answers (2)

Apalala
Apalala

Reputation: 9244

The general rule is to not use tags about structure to affect layout. With the styles at the start of a page a rendering engine knows what it has to do to render a certain part of the page, but it always has to wait for a part to download to know how to render it properly.

With that in mind:

  1. Tables should rearely (never?) be used for layout purposes.
  2. Parts that should be reasonably rendered first (sidebars, toolbars, and anything that framews the page) should be featured at the top of the HTML document.

The huge JavaScript libraries in use today are different in that they only need to be loaded (and cached) once.

Upvotes: 1

Brad
Brad

Reputation: 163468

There are a handful of reasons why this may happen. The most common that I see are large tables.

For example, Internet Explorer doesn't like to render a table until it is finished loading.

Each browser is a bit different though, in how they render things that are still downloading.

Upvotes: 1

Related Questions