Follow us on Twitter X-Cart on Facebook Wiki
Shopping cart software Solutions for online shops and malls

HTML Table MOD - *HUGE* Performance Incr for Clients!

 
Reply
   X-Cart forums > X-Cart 4 > Dev Questions
 
Thread Tools Search this Thread
  #1  
Old 08-11-2004, 05:16 PM
 
Adian009 Adian009 is offline
 

Advanced Member
  
Join Date: Mar 2004
Location: Tiverton, RI, USA
Posts: 37
 

Default HTML Table MOD - *HUGE* Performance Incr for Clients!

I got this tip from one of the HTML gurus at work and it has an amazing impact on client side performance - I mean, the difference is completely noticable, I would say 200% increase in page rendering.

The more tables you do this to in X-Cart, the better it will perform because it uses so many nested tables. Remember though, the performance increase is solely client-side, there are no server-side performance implications here...

Here is a Microsoft web page example of the effects of this. After the test page loads hit refresh a couple of times to watch the dramatic effects.

You can do this to any table where you can define the column widths! I did it in my home.tpl, product.tpl and products.tpl.

In the <table> tag you add:

style="table-layout:fixed;"

Just below the <table> tag but before any <tr> tags you add:

If you use pixles: <col width="##px">
If you use percent: <col width="##%">

Add a <col> tag for each column in the table.

There is more you can do, too but this in itself is a dramatic increase in client side performance! (You can add "width=###" to the COL tags for more performance.)

The reason this increases performance in the browser is because the browser doesn't wait for the table/cell contents before rendering the table - it renders the table immediately based on the <COL> tags instead.

I hope this helps out everyone!

--al ponte
__________________
---------------------------------------------
Infosolv, LLC
A Professional Services Company
X-Cart v3.5.10 & 4.01
Find our MOD\'s at: Custom X-Cart MOD\'s, Add-On\'s & X-Cart Hosting!
Reply With Quote
  #2  
Old 08-11-2004, 08:29 PM
 
1320AutoSports 1320AutoSports is offline
 

Advanced Member
  
Join Date: Apr 2003
Posts: 89
 

Default

wow, insanly awesome bro..

ill have to try and implement this as much as possible.
Reply With Quote
  #3  
Old 08-11-2004, 09:12 PM
  adpboss's Avatar 
adpboss adpboss is offline
 

X-Man
  
Join Date: Feb 2003
Location: Ontario, Canada
Posts: 2,389
 

Default

Please post some of your code for us. Inevitably Newbs will have questions.
Reply With Quote
  #4  
Old 08-12-2004, 04:21 PM
 
Adian009 Adian009 is offline
 

Advanced Member
  
Join Date: Mar 2004
Location: Tiverton, RI, USA
Posts: 37
 

Default

Quote:
Originally Posted by adpboss
Please post some of your code for us. Inevitably Newbs will have questions.

Sure, I will post some code from my HOME.TPL - not a problemo. I wish I could do this to every table on my site, because the performance is really noticeable - but unfortunately, there are some columns that you just can't restrict the size of.

/SKIN1/CUSTOMER/HOME.TPL Change:

The italicized text is from the original file:


<table border=0 width="100%" cellpadding=0 cellspacing=0 align="center">
<tr>
<td width=6></td>
<td width=150 valign=top>


my changed file has:

<table border=0 cellpadding=0 cellspacing=0 align="center" style="table-layout:fixed;">
<col width="9">
<col width="160">
<col width="10">
<col>
<col width="10">

Notice that the next to the last column I don't have the width for - that is acceptable and you will benefit because the browser will use the remaining space.

I really hope this helps some folks out there!

--al
__________________
---------------------------------------------
Infosolv, LLC
A Professional Services Company
X-Cart v3.5.10 & 4.01
Find our MOD\'s at: Custom X-Cart MOD\'s, Add-On\'s & X-Cart Hosting!
Reply With Quote
  #5  
Old 08-12-2004, 04:22 PM
 
Adian009 Adian009 is offline
 

Advanced Member
  
Join Date: Mar 2004
Location: Tiverton, RI, USA
Posts: 37
 

Default

Did anyone do this? Did you see a difference? How big of a difference??

Just curious, that is all!

--al
__________________
---------------------------------------------
Infosolv, LLC
A Professional Services Company
X-Cart v3.5.10 & 4.01
Find our MOD\'s at: Custom X-Cart MOD\'s, Add-On\'s & X-Cart Hosting!
Reply With Quote
  #6  
Old 08-12-2004, 08:26 PM
  adpboss's Avatar 
adpboss adpboss is offline
 

X-Man
  
Join Date: Feb 2003
Location: Ontario, Canada
Posts: 2,389
 

Default

On my worklist. With 1000 other things, but I definitely want to try this out.
Reply With Quote
  #7  
Old 08-12-2004, 09:07 PM
  DataViking's Avatar 
DataViking DataViking is offline
 

eXpert
  
Join Date: Jan 2003
Location: Las Vegas, NV
Posts: 361
 

Default

I will try this too
__________________
Web Design Web Design and Custom X-Cart Projects

http://www.dataviking.com

Mention the forums for discounts!
x-cart Version 4.1.8
Reply With Quote
  #8  
Old 08-13-2004, 05:52 AM
 
sstillwell@aerostich.com sstillwell@aerostich.com is offline
 

eXpert
  
Join Date: Jun 2004
Location: Duluth, MN
Posts: 242
 

Default

Is it possible to just add this to your CSS file "skin1.css" as


Code:
TABLE { table-layout:fixed; }

This should apply to all your tables. Is it going to cause a problem to tables that don't define widths?

I have added it to my css file, but I don't have that many products to really tell the difference.[/code]
__________________
No longer using Xcart, was good while it lasted.
Reply With Quote
  #9  
Old 08-13-2004, 06:05 AM
 
sstillwell@aerostich.com sstillwell@aerostich.com is offline
 

eXpert
  
Join Date: Jun 2004
Location: Duluth, MN
Posts: 242
 

Default

Woooooooooooooooo!!!!!!!!!!!!!!!!


Don't just add to CSS file like I did in the above post. After a refresh of my browser it centered and squished some tables way down.

Bad, bad, bad.

Looks like it will be a manual process, thanks for the mod though.
__________________
No longer using Xcart, was good while it lasted.
Reply With Quote
  #10  
Old 08-13-2004, 08:23 AM
  B00MER's Avatar 
B00MER B00MER is offline
 

X-Guru
  
Join Date: Sep 2002
Location: Keller, TX (Cart-Lab.com)
Posts: 3,165
 

Default

Ultimately, you would want to copletely remove all <table> and such tags from your html and use only CSS for tabless sites. They are faster loading, and way more Search engine friendly.

Just an example, checkout www.bluerobot.com
__________________
Cart-Lab - 100+ Social Bookmarks for X-Cart.
Reply With Quote
Reply
   X-Cart forums > X-Cart 4 > Dev Questions


Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT -8. The time now is 01:22 PM.

   

 
X-Cart forums © 2001-2020