Patrik
Patrik

Reputation: 1129

Rendering problem with nested HTML tables (perfomance)

Does anyone have experience with rendering nested HTML tables? I am attempting to render 30 - 40 rows that each have 5 tables in them. This renders very slowly in Internet Explorer 7 and 8. Is there a trick I can use to speed my table rendering up? Is there a different element I can use other than tables?

Upvotes: 1

Views: 353

Answers (5)

fuxia
fuxia

Reputation: 63556

Add:

table
{
    table-layout: fixed;
}

Be aware: some text may flow out of the table cells now.

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114347

Tables are good for grids of information. For most other applications use a styled unordered list UL.

Upvotes: 0

Ian Mercer
Ian Mercer

Reputation: 39277

Setting explicit height and width on every element in the tables will improve browser layout performance.

For internet explorer, see http://msdn.microsoft.com/en-us/library/ms531161(VS.85).aspx

Setting the property to fixed significantly improves table rendering speed, particularly for longer tables. Setting row height further improves rendering speed, again enabling the browser's parser to begin rendering the row without examining the content of each cell in the row to determine row height.

Upvotes: 1

Mitchel Sellers
Mitchel Sellers

Reputation: 63126

if you are working with a nested structure that bad, I would guess that there are ways that it could be refactored to not be as complex, and your performance gain is going to be great by doing so.

However, we would need to see exactly what you are doing to give a valid answer.

Upvotes: 3

Alin P.
Alin P.

Reputation: 44346

30-40 tables is a lot of code to render. You should definitely switch to CSS layouts.

Upvotes: 2

Related Questions