Link to home
Start Free TrialLog in
Avatar of gmoriak
gmoriak

asked on

HTML Table (Huge) Loading time

I have a 2.5 Meg Html file that takes about a minute to render.  Most of it is a single HTML table.

Are there any "slick" tricks or things I could do to make it faster?  All users are using IE

I know I could break it into multiple tables, but then I lose the column alignment and borders, so I'd prefer a different solution.
Avatar of lexxwern
lexxwern
Flag of Netherlands image

tweaking html is possible, please give a link to the page.
but 2.5m isn't that HUGE, my 56k modem will take 10 minutes to load. phew!

lexxwern
Avatar of ibo
ibo

to speed up loading time,
* reduce unnecessary formatting tags or better yet, use inline cascading style sheet to define formatting. (reduces the size of your file).
* avoid nested tables and complicated tables.
* specify table sizes, dimensions etc so that browser will know immediately how to construct the tables.
* minimize javascript because it slows rendering of html tables.
* specify dimensions for images.
* if you have big images, slice them into parts.
well does all of this account for 2.5m~

what have you done on your page,

lexxwern
i can't imagine what's inside of that page. is it a book, a photo album, or something?

yah, give us a link so that we can see what would be best.

;-)
maybe its a thumbnails for his porn collections arranged in tables hehe :) jk!
lol@ibo ;-) ur a filipino also?? i'm surprised! ;-)
OT:
hey third.. whats up? :) yes i am. location mo?
ibo,

   we would be messing this thread if we will be discussing it here. you can contact me at
third@third.itgo.com. btw, im from ortigas.

gmorjak & other Experts,
  sorry for the little mess.
 
if it is one table it'll show it whenever it isdone loading/. No way around that. One thing you can do is get rid of all spaces. Other methods can also be used depending on your data structure inside your HTML. is there any logic to be found in the data that is written? If so you can use XML to retrieve the data and dynamically writing it out (for example).

CJ
If you are using nested tables for layout you might like to link about moving to CSS for layout (which is what CSS was designed for) and using tables only for tabulated data (which is what tables were designed for).

CSS tutorial: http://www.westciv.com/style_master/academy/css_tutorial/

Examples: http://www.glish.com/css/

CSS Specification: http://www.w3c.org/TR/1998/REC-CSS2-19980512/
ASKER CERTIFIED SOLUTION
Avatar of COBOLdinosaur
COBOLdinosaur
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
You're not cd& ;-)
Avatar of gmoriak

ASKER

It's a local network app and my first suggestion was to filter the result set.  They said they need all the rows.  

Playing with spaces etc. might improve it somewhat but likely not worth the trouble.

It's one table with a couple thousand rows of data.
I realized it had to be a local app, that was why I made the sysadmin comment.  If several user start to pull that down at the same time, it is going to seriously degrade network performance. I would try to find a way to break it up.  My experience has been that even if you tell them during development that it is going to be slow, they will still complain and open problem tickets about the slow response time.

Users always think they have to have _all_ the data.

Cd&
in designing a system, we have lots of considerations to be aware of. one big concern is how will the new system help the old process? what steps should be made in order to attain efficient system? and after this, what would be the most appropriate TOOL to be used in creating the system?

we all know web-based systems are not designed to handle HUGE data. this causes lots of network traffic that's why if the system cannot get rid of databases, FILTERING is applied just maintain good system performance. although some aspects are being sacrificed such as instant availability of all the data, this way the system comes out to be more useful to users. imagine if search engines like yahoo or google lists 1,000 links on a single page, would that be useful if you'll gonna wait for about 10 minutes waiting for the whole page to load. and then browse each link finding for the exact answer, huh that would bring a big HEADACHE...

now, what i'm tellin' here is you need to decide what would best fit the process. implement a web-based system but with limitations (ie. you need to filter the data) or if filtering cannot be avoided and you need a much faster data process, use the basic - a database application.

hope this helps...


maybe HTML is not the answer.. XML would not be the advisable too.. how about compressed data file? ;)
obvious solution :
delimited plain text file -> compress ---> network -------> decompress -> parse/tokenize plain text file.
if it has to be viewed only by a browser, generate the resultset in xml format and and use xsl to format the data. it reduces the size but not much.
Avatar of gmoriak

ASKER

This question took a wrong turn.  There are no concerns about bandwidth.  Even opening the html file from a local disk takes a long time to render and puts the CPU at 100% for 10 seconds or so.

My question was options to speed the time to render the HTML, not how to deliver a smaller file.  Also, I'm not interested in 5-10 percent gains by tweaking this or that.  Anything that is too slow, is also too slow running 10% faster.

gmoriak, i think your best bet is to post your code, let the experts take a look at it, and then proceed from there, everything else is pure speculation on what would solve your issues...

Avatar of gmoriak

ASKER

The code is a html page with a single table, no nesting.  The table has about 30 columns and several thousand rows.  The table takes about a long time to display.  

I was looking for ways to make IE display a table faster.  I appreciate the comments about requirements, yada, yada, yada, but those issues are understood.

I'll wait a bit for responses, if none, I'll give the points to Cobol for his answer that it can't be done.


so, you are saying that you have this as code:

<table> attributes whatever

<tr>
<td>
whatever
</td>

<td>
whatever>
</td>

add about 28 table data cols.

</tr>

x a thousand or so more table rows

</table>

if, so, then, well, you are just stuck with how it loads, and should prolly accept Cd&'s answer, as you are just limited with HTML if you insist on not going that direction... have you not looked into using Excel or something along those lines, or a .ASP dB pass.... with data that resides server side...

Sorry we couldn't find some trick to make it quicker. Thanks for the A. :^)

Cd&
There is way to speed up the load time. The majority of the load time spent because the browser has to read the entire table before it renders because it needs to figure out how wide to make columns. If you make the table a fixed-width, you will cut the load time in halve, and the transfer spped of the users internet connection will be the limiting speed.

You need to manually set your column width and the table width.
This code varies the table width based on the number of columns (ColCnt)

vTableWidth = cStr( 30 + (ColCnt * 10)) & "%"  ' Increase 10% for each column
Response.Write "<Table cellspacing=0 style='TABLE-LAYOUT:fixed;' width='" & vTableWidth & "'>

The table will also start to display right away, so it appears to the user that the load is faster