Is it possible to render table at end tag

Let's say I have a开发者_开发百科 large table (a couple of thousand rows) and I want the whole table to render as fast as possible.

Is it possible to somehow delay rendering of a table until the whole table is downloaded ? Otherwise the width calculations after each row seem to take up too much time.

When I use IE without a declared doctype the browser seem to wait until it gets the table’s closing tag. However when I do declare a doctype the table start rendering at once and therefore have to calculate the table width after each new row. I don't want to use table-layout:fixed since I don’t want the content to line break where it shouldn’t.

It only seem to be a significant time difference in IE(8)?

(Pagination is not an option)

Thanks!

You could hide the table until it's loaded:

<table id="PopTable" style="display:none">
  ...
</table>
<script type="text/javascript">
document.getElementById('PopTable').style.display = '';
</script>

Although it would be an ugly solution, you could propably wrap that HTML in a document.write()-call or so which would propably delay rendering.

Something like this:

<script>document.write('<table>...</table>')</script>

You can do the following: use table-layout:fixed on the table, while the data is being downloaded.

And after the closing tag of the table, add a small script, that removes the css.

Example:

<table style='table-layout:fixed' id='data_table'>
<!-- All your data -->
</table>
<script type='text/javascript'>
    document.getElementById('data_table').style.tableLayout = 'auto';
</script>